Preventing tag pill menu from appearing multiple times

[Soren Bjornstad]

Hi everyone,

I am trying to make a simple table that lists tiddlers matching a filter, along with those tiddlers' tags (in the standard pill display). I've written the following template tiddler:

<table>
  <$list filter="[all[current]backlinks[]!tag[Source]!tag[Publication]!tag[Place]!tag[Meta]!tag[PAO]]">
    <tr>
      <td>
        <$link>{{!!title}}</$link>
      </td>
      <td class="tc-tags-wrapper">
        <$list filter="[all[current]tags[]]" template="$:/core/ui/TagTemplate"/>
      </td>
    </tr>
  </$list>
</table>

This renders nicely enough when I transclude it. However, when the same tag appears multiple times in a list and I click on that tag pill, every pill's menu opens, creating an unusable mess:

How can I make only the pill I click on open? From my limited knowledge of web programming, I am guessing this is happening because the pills don't have unique identifiers, but I have no idea how to go about fixing this in my template.

[TonyM]

Soren,

The tags macro overcomes this limitation

<$list filter="[all[]tags[]]">
<$macrocall $name=tag tag=<<currentTiddler>>/>
</$list>

Only the clicked tag drop down appears.

Regards

Tony

[Soren Bjornstad]

Tony,

Thanks for your reply! I switched to using the tag macro per your suggestion, but unfortunately I am still seeing the same behavior. I simplified it a bit just to rule out something wrong with my table, so I now have:

<$list filter="[all[current]backlinks[]]">

  {{!!title}}

  <$list filter="[all[current]tags[]]">

    <$macrocall $name=tag tag=<<currentTiddler>>/>

  </$list>

  <br>

</$list>

[A Gloom]

The cause isn't your table but the tag macro-- it has a popup state mechanism

I duplicated your problem with 2 stand-alone lists in th same tiddler and got the same results

at tiddlywiki . com create some test tiddlers with the same 4 tags and assign each to a seperate list-- clicking on a tag pill in one list opens in the other list as well

<$list filter="[[test Tiddler 1]tags[]]" template="$:/core/ui/TagTemplate">
  </$list>

<$list filter="[[test Tiddler 2]tags[]]" template="$:/core/ui/TagTemplate">
  </$list>

[Mohammad]

Have a look here

https://tiddlywiki.com/prerelease/#Formatting%20List%20Results%20as%20Tables%20with%20CSS%20-%20Variable%20Column%20Method

--Mohammad

[Soren Bjornstad]

Thanks everyone for all your help so far!

The tiddler Mohammad linked isn't really what I want to do. I want nested lists where each backlink to the current tiddler is a row, and one of the columns of each row shows the tags of the backlinked tiddlers  -- not a multi-column listing of one set of tags. So a responsive, multi-column table doesn't help much here.

I did try using the <$transclude /> widget as described in that reference, but this didn't work either. I also tried putting each entry in a separate div in case this caused selectors to work differently:

<$list filter="[all[current]backlinks[]]">
 <div>
   {{!!title}}

   <$list filter="[all[current]tags[]]">

     <$transclude tiddler="$:/core/ui/TagTemplate"/>
   </$list>
 </div>
</$list>

I think A Gloom is on to something -- $:/core/ui/TagTemplate appears to have a state tiddler hard-coded into it:

<$reveal state=<<qualify "$:/state/popup/tag">> type="popup" position="below" animate="yes" class="tc-drop-down">

My question remains, is there some way to get around this? Worst case I could handle having the tags be non-clickable (and I don't know how to do that either off the top of my head), but the drop-downs are pretty nice.

Incidentally, I am on TiddlyWiki 5.1.21 running through TiddlyServer.

[Saq Imtiaz]

The quickest solution would be to use your own template, a modified version of the $:/core/ui/TagTemplate

This is untested code and not the most elegant, but something like this should work:

<table>
  <$list filter="[all[current]backlinks[]]">
  <$set name="_currentTiddler" value=<<currentTiddler>> >

    <tr>
      <td>
        <$link>{{!!title}}</$link>
      </td>
      <td class="tc-tags-wrapper">

        <$list filter="[all[current]tags[]]" template="$:/myTagTemplate"/>
      </td>
    </tr>
</$set>
  </$list>
</table>

where the template looks like this (note the second line of the template that cobbles together a state tiddler title):

\whitespace trim
\define tagPopupState() $:/state/popup/tag/$(storyTiddler)$/$(_currentTiddler)$/$(currentTiddler)$
<span class="tc-tag-list-item">
<$set name="transclusion" value=<<currentTiddler>>>
<$macrocall $name="tag-pill-body" tag=<<currentTiddler>> icon={{!!icon}} colour={{!!color}} palette={{$:/palette}} element-tag="""$button""" element-attributes="""popup=<<tagPopupState>> dragFilter='[all[current]tagging[]]' tag='span'"""/>
<$reveal state=<<tagPopupState>> type="popup" position="below" animate="yes" class="tc-drop-down">
<$set name="tv-show-missing-links" value="yes">
<$transclude tiddler="$:/core/ui/ListItemTemplate"/>
</$set>
<$list filter="[all[shadows+tiddlers]tag[$:/tags/TagDropdown]!has[draft.of]]" variable="listItem"> 
<$transclude tiddler=<<listItem>>/> 
</$list>
<hr>
<$macrocall $name="list-tagged-draggable" tag=<<currentTiddler>>/>
</$reveal>
</$set>
</span>

[Mohammad]

Hi Soren,

The tiddler I just shared shows how to use the TagTemplate. Your issue is using the same state tiddler, so if there is repeated tag when you click on one of the the other tag pills are opened!

Saq has addressed your issue using a custom template and suitable state tiddler.

You can also use dynamic table in Shiraz https://kookma.github.io/TW-Shiraz/

your filter is the same, the fields are title and tags

--Mohammad

[TonyM]

Folks,

This solution I presented very early worked for me,

The Key is given the state tiddler is "qualified" it is based on the currentTiddler, and in my example the current tiddler is changed to match the tag, and thus there is a different state tiddler for each tag.

The macro is defined in $:/core/macros/tag and uses  $:/core/ui/TagTemplate 

I looked at modifing the $:/core/ui/TagTemplate  references to `<<qualify "$:/state/popup/tag">>` to `<<qualify "$:/state/popup/tag/$tag$">>` since the $tag$ is always available in the macros may be unnecessary

<<tag test>>
<<tag fred>>
<<tag test>>

Mentioning the same tag in the same tiddler will cause the popup twice but this is easily avoided.

Regards

Tony

[Mohammad Rahmani]

Hi Tony!

Good to submit a ticket and ask Jeremy to revise this if has no consequences!

Best wishes

Mohammad

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/15826e22-3fe2-493a-84e6-f021c73ea1e7%40googlegroups.com.

[TonyM]

Mohammad,

Great  but to be clear;

I am not suggesting a Fix, I only said "I looked at modifying".

Regards

Tony

On Wednesday, March 18, 2020 at 8:37:16 AM UTC+11, Mohammad wrote:

Hi Tony!

Good to submit a ticket and ask Jeremy to revise this if has no consequences!

Best wishes

Mohammad

To unsubscribe from this group and stop receiving emails from it, send an email to tiddl...@googlegroups.com.

[Mat]

TonyM wrote:

Mentioning the same tag in the same tiddler will cause the popup twice but this is easily avoided.

Maybe I don't understand your proposal but, just to make sure: Regarding the Qualify Macro, note that multiple uses of it in the one and same tiddler produces the identical "number" every time. One must change the environment (e.g by using the tiddlerwidget) to have it output a different number.

<:-)

[TonyM]

Mat,

The number generated by Qualify is related to the tiddlername, specifically the current tiddler so if that changes for each tag, as in my first post the issue only occurs if the same tag is referenced in the same tiddler with the same currentTiddler value. In Soren's original post his current Tiddler need only change according to the items in the left hand list, and the mentioning of the same tag in the list should not result in multiple popups as each is qualified by the tiddler in the left hand list.

I tend not to experience this "problem" because almost all my macros are driven by currentTiddler so I often invoke macros and templates where needed by manipulating the currentTiddler. In support of this I use the `<<storyTiddler>>` variable to access the display tiddler (almost the currentTiddler)

Regards

Tony

[TonyM]

Post script,

I expect one could even use a false currentTiddler to manipulate the "Qualify Macro".

Tony

[Soren Bjornstad]

On Tuesday, March 17, 2020 at 5:22:08 PM UTC-5, TonyM wrote:

The number generated by Qualify is related to the tiddlername, specifically the current tiddler so if that changes for each tag, as in my first post the issue only occurs if the same tag is referenced in the same tiddler with the same currentTiddler value. In Soren's original post his current Tiddler need only change according to the items in the left hand list, and the mentioning of the same tag in the list should not result in multiple popups as each is qualified by the tiddler in the left hand list.

I think each is qualified by the tiddler in the inner list, the way it stands, since currentTiddler gets overwritten by the innermost $list widget -- right? Are you suggesting I could skip overwriting currentTiddler to solve the problem? I tried setting the innermost list to use a variable <<innerTiddler>> instead, but this did not help since there is only one parameter to the <<tag>> macro which is used as the current tiddler to the tag template. That variable has then to be set to innerTiddler instead of currentTiddler to render the correct thing, and the problem just starts all over again.

On Tuesday, March 17, 2020 at 7:08:41 AM UTC-5, Saq Imtiaz wrote:

The quickest solution would be to use your own template, a modified version of the $:/core/ui/TagTemplate

This is untested code and not the most elegant, but something like this should work:

This worked, thanks! It seems a lot more complicated of a solution than this ought to require, but if I don't find something better this will do.

[TonyM]

Ahh,

Yes, I see now, the first macro involved is 

\define tag(tag)
{{$tag$||$:/core/ui/TagTemplate}}
\end

So the current Tiddler is set to $tag$ for the tag template, which then calls qualify for each tag.

Since it is in effect not keeping the currentTiddler, it sets it to currentTag we can't fake it. 

I am sure a simple modification or two to the macros will resolve this, or an improved qualify.

I will give it some thought.

Regards

Tony

[TonyM]

Filks

Here is a fix

Define a tag2 macro

\define tag2(tag)
<$set name=currentTag value="$tag$">
{{||$:/core/ui/TagTemplate2}}
</$set>
\end

Create a new template $:/core/ui/TagTemplate2

\whitespace trim
<span class="tc-tag-list-item">
<$set name="transclusion" value=<<currentTag>>>
<$macrocall $name="tag-pill-body" tag=<<currentTag>> icon={{!!icon}} colour={{!!color}} palette={{$:/palette}} element-tag="""$button""" element-attributes="""popup=<<qualify "$:/state/popup/tag">> dragFilter='[<currentTag>]tagging[]]' tag='span'"""/>

<$reveal state=<<qualify "$:/state/popup/tag">> type="popup" position="below" animate="yes" class="tc-drop-down">

<$set name="tv-show-missing-links" value="yes">

<$tiddler tiddler=<<currentTag>> >

<$transclude tiddler="$:/core/ui/ListItemTemplate"/>

</$tiddler>
</$set>

<$list filter="[all[shadows+tiddlers]tag[$:/tags/TagDropdown]!has[draft.of]]" variable="listItem">

<$tiddler tiddler=<<currentTag>> >
<$transclude tiddler=<<listItem>>/>
</$tiddler>
</$list>
<hr>
<$macrocall $name="list-tagged-draggable" tag=<<currentTag>>/>
</$reveal>
</$set>
</span>

Now when you call the tag2 macro it will respond to the current tiddler.

However the following demonstrates how if the currentTiddler changes the Qualify will

<$list filter="1 2">
   <$list filter="[all[]tags[]sort[]]" variable=tagname>
      <$macrocall $name=tag2 tag=<<tagname>>/>
   </$list>
</$list>

So if the vertical list of items become the currentTiddler the tag popup will be qualified not by the tag but the currentTiddler.

Seems to work!

Tony