Eventcatcher external links

I’m using the <$eventcatcher> method described elsewhere by @saqimtiaz and others for performance reasons on lines of text. It’s for a homebrew outliner, so I want any clicking of the text to perform an action (switch the line into edit mode in my real wiki). All is working well except for links. Internal links work fine - they perform normally, but external links don’t process. How could I change the code to allow external links to work like internal ones?

Sample code to copy/paste into TiddlyWiki.com (simplified example)

\define actions() <$action-setfield $tiddler="$:/temp/test" $value=<<dom-line-id>>/>

<$eventcatcher selector=".line" $click=<<actions>>>
<ul>
<$list filter="[tag[TableOfContents]] [[https://google.com]]">
<li class="line" line-id=<<currentTiddler>>>The title is {{!!title}}</li>
</$list>
</ul>
</$eventcatcher>

Test = {{$:/temp/test}}

Which looks like this:
image

And here’s an animated GIF showing the clicking working / not working
eventcatcher

tm-open-external-window worked for me. Not perfect. Would need more experimenting. May be some browser setting, that it opens it in a new tab.

Just a fast experiment.

\define actions()
<$action-setfield $tiddler="$:/temp/test" $value=<<dom-line-id>>/>
<$action-sendmessage $message="tm-open-external-window" $param=<<dom-line-id>> windowName="_tiddlywiki" windowFeatures="height=400, width=600"/>
\end

Edit: uups.
You’ll need some more logic to only use open-widow with external links. So may be a new parameter in the eventcatcher eg: link-is-external

-m

Hmmm well to be clear I still want it to do what it’s doing when not clicking a link (like other text in the same line) - it’s just that when a link is in the line I want it to respond to that - just like how it works for internal links. Your example seems to read like an action that would apply to a click anywhere in the line.

I’ll see if I can figure out how to implement what you sent - though I’ll think about my design to see if there’s another way to simplify - maybe abandon the eventcatcher.

Thanks!

May be @saqimtiaz can help. He’s the eventcatcher expert?!

I look forward to @saqimtiaz’s perspective on event catcher, but keep in mind we also have a link catcher, and message catcher.

I have done a lot with what I would call “smart links” but wondering if @stobot or @pmario could spell out for me what the expected behavior is, because when I try the same code “its seems to be working”.

If you click the https-link it does not open the page, because the eventcatcher catches it and since there is no action to open the link it’s blocked.


The advantage of the eventcatcher-widget is performance, since the browser does not have to handle every link with a link-widget. There is only 1 event to handle at the eventcatcher element in the DOM

In the list widget LI element (code below) you can see, that there are no links created. Instead the currentTiddler variable is assigned to a line-id parameter of the LI element. This parameter can be evaluated in the eventcatcher actions, which is much faster, if there are 1000’s of LI elements

<$list filter="[tag[TableOfContents]] [[https://google.com]]">
<li class="line" line-id=<<currentTiddler>>>The title is {{!!title}}</li>
</$list>

Thanks Mario

So if the “title” passed to the actions contains say // could an open external link occur?

Use the matchSelector attribute of the eventcatcher to exclude events targeting external links. Something along these lines but please confirm the selector is correct as this is from memory:

matchSelector=":not(a.tc-tiddlylink-external)"
2 Likes

Great memory! It worked :slight_smile:

\define actions() <$action-setfield $tiddler="$:/temp/test" $value=<<dom-line-id>>/>

<$eventcatcher selector=".line" $click=<<actions>> matchSelector=":not(a.tc-tiddlylink-external)">
<ul>
<$list filter="[tag[TableOfContents]] [[https://google.com]]">
<li class="line" line-id=<<currentTiddler>>>The title is {{!!title}}</li>
</$list>
</ul>
</$eventcatcher>

Test = {{$:/temp/test}}
1 Like