next/previous navigation

[dorian...@gmail.com]

hello,

http://tw5magick.tiddlyspot.com has a great bit in "Putting common stuff into tiddlers" where the next and previous tiddler in a tag are linked to at the end of each tiddler. I want to use this for a bunch of tags, so that at the bottom of each tiddler, for each tag that tiddler has, it links for the next and previous tiddler in that tag. However, that functionality doesn't seem to work with current version, even importing the next.js and previous.js tiddlers from tw5magick. The current previous and next operators would make doing this extremely tedious, since I don't want to define each list manually. I'd prefer if it was just ordered by reverse creation date, but having a chronology field would also work. Can anyone help me with this?

Thank you.

[Jed Carty]

You can now do this with just wikitext and a display template.

Make a tiddler, tag it with "$:/tags/ViewTemplate"

put this in the text field (you will probably want different styling, but this should do the rest):

<$list filter='[is[current]tags[]]' variable=CurrentTag>
<$tiddler tiddler=<<CurrentTag>>><<tag>></$tiddler> - <$button>Previous<$list variable=PreviousTiddler filter='[tag<CurrentTag>before<currentTiddler>]'><$action-navigate $to=<<PreviousTiddler>>/></$list></$button><$button>Next<$list variable=NextTiddler filter='[tag<CurrentTag>after<currentTiddler>]'><$action-navigate $to=<<NextTiddler>>/></$list></$button>
</$list>

then you should get a list of tags at the bottom of each tiddler with previous and next buttons that will bring you to the previous or next tiddler with that tag. You may want to add some sort of sorting to the filters if you have your tiddlers ordered in some way.

[dorian...@gmail.com]

Thank you so much! I've been breaking my head over this for quite a bit now. Where is <<tag>> documented?

[Jed Carty]

http://tiddlywiki.com/#tag%20Macro

[dorian...@gmail.com]

How do I exclude tiddlers from the ordering?

<$list variable=NextTiddler filter='[tag<CurrentTag>sort[order] -priority[-1] +after<currentTiddler>]'>

doesn't work. 

On Saturday, February 18, 2017 at 2:39:42 PM UTC-5, Jed Carty wrote:

[Eric Shulman]

On Saturday, February 18, 2017 at 2:24:42 PM UTC-8, dorian...@gmail.com wrote:

How do I exclude tiddlers from the ordering?

<$list variable=NextTiddler filter='[tag<CurrentTag>sort[order] -priority[-1] +after<currentTiddler>]'>

doesn't work. 

 

Try this:

<$list variable=NextTiddler filter='[tag<CurrentTag>sort[order]after<currentTiddler>] -[priority[-1]]'>

or this:

<$list variable=NextTiddler filter='[tag<CurrentTag>sort[order]after<currentTiddler>!priority[-1]]'>

Let me know how it goes...

enjoy,

-e

Eric Shulman

TiddlyTools: Small Tools for Big Ideas! (tm)
InsideTiddlyWiki: The Missing Manuals

 

[dorian...@gmail.com]

Wouldn't that completely remove it? The behavior I'm trying to get is for it to skip over tiddlers with priority[-1] and go to the next tiddler in order, not omit it completely.

[Jed Carty]

What would the difference be between skipping something and completely removing it here? Also you need to have the remove part before the before or after operator because they work from left to right and if the next tiddler would have priority -1 and then you remove the priority -1 tiddlers nothing is returned.

<$list filter='[is[current]tags[]]' variable=CurrentTag>

<$tiddler tiddler=<<CurrentTag>>><<tag>></$tiddler> - <$button>Previous<$list variable=PreviousTiddler filter='[tag<CurrentTag>!priority[-1]nsort[order]before<currentTiddler>]'><$action-navigate $to=<<PreviousTiddler>>/></$list></$button><$button>Next<$list variable=NextTiddler filter='[tag<CurrentTag>!priority[-1]nsort[order]after<currentTiddler>]'><$action-navigate $to=<<NextTiddler>>/></$list></$button>
</$list>

will skip tiddlers that have -1 in their priority field.

[Thomas Elmiger]

Hi all,

Cool stuff! I have played a bit with Jed’s (first) code and made a new version. Main differences:
- buttons appear only if there is a tiddler we can navigate to
- tooltip on the button instead of the tag

\define prevnextTip(direction:"next/previous")
Go to $direction$ in $(CurrentTag)$
\end

<$list filter='[is[current]tags[]]' variable=CurrentTag>

<$list variable=PreviousTiddler filter='[tag<CurrentTag>before<currentTiddler>]'>
<$wikify name=tt text=<<prevnextTip "previous">>>
<$button tooltip=<<tt>>><$action-navigate $to=<<PreviousTiddler>>/>
Previous</$button>
</$wikify>
</$list>
<$list variable=NextTiddler filter='[tag<CurrentTag>after<currentTiddler>]'>
<$wikify name=tt text=<<prevnextTip "next">>>
<$button tooltip=<<tt>>><$action-navigate $to=<<NextTiddler>>/>
Next</$button>
</$wikify>
</$list>
</$list>

Happy presentations!
Thomas

[The Bo]

Very interesting stuff indeed!
@thomas
I played with your code as well and added some css and made some changes:
- displays the tiddlers title on hover
- cuts long tiddler titles to "tiddler title..." (maybe you have to change the max-width)

tag it $:/tags/ViewTemplate

\define prevnextTip()
$(prev_nextTiddler)$
\end

<div class="center">
<$list filter='[is[current]tags[]limit[1]]' variable=CurrentTag>
<$list variable=prev_nextTiddler filter='[tag<CurrentTag>!sort[]before<currentTiddler>]'>
<$wikify name=tt text=<<prevnextTip>>>
<p class="left">
<$button class='tc-btn-invisible_blue' tooltip=<<tt>>>
<$action-navigate $to=<<PreviousTiddler>>/>{{$:/core/images/chevron-left}}<span class="left-notext">Previous</span><span class="left-text">&nbsp;<<prev_nextTiddler>></span></$button></p></$wikify>
</$list>
<$list variable=prev_nextTiddler filter='[tag<CurrentTag>sort[]after<currentTiddler>]'>
<$wikify name=tt text=<<prevnextTip>>>
<p class="right"><$button  class='tc-btn-invisible_blue' tooltip=<<tt>>>
<$action-navigate $to=<<prev_nextTiddler>>/><span class="right-text"><<prev_nextTiddler>>&nbsp;</span><span class="right-notext">Next</span> {{$:/core/images/chevron-right}}</$button>
</p>
</$wikify>
</$list>
</$list>
</div>


tag this $:/tags/Stylesheet

.tc-btn-invisible_blue { color: #518dae; fill: dimgrey; padding: 0; margin: 0; background: none; border: none;}

.tc-btn-invisible_blue:hover {fill: black;}

.center {text-align: center; max-height: 3px; padding-bottom: 7px; font-size: 12px;}

.left {float: left;}
.left-notext {display: inline;}
.left:hover {background-color: Gainsboro;}
.left:hover .left-notext {display: none;}
.left-text {display: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 450px;}
.left:hover .left-text {color: black; float: right; display: block; }
.right {float: right; display: inline;}
.right:hover {background-color: Gainsboro;}
.right:hover .right-notext {display: none;}
.right-text {display: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 450px;}
.right:hover .right-text {color: black; float: left; display: block;}

[magev958]

This looks really nice, but when I try it in a new TW5 (5.1.13) the no1 and no2 tiddler in a set of three get the next/prev button but not the no3 tiddler

[magev958]

Also both buttons "next" and "previous" seems to point to the same tiddler, "next"? On Chrome 54.0.2840.99, Win7

[The Bo]

@magev958
My fault, the sort[] must be equal. In my upper code I have got both !sort[] and sort[].

It must be:

\define prevnextTip()
$(prev_nextTiddler)$
\end

<div class="center">
<$list filter='[is[current]tags[]limit[1]]' variable=CurrentTag>


<$list variable=prev_nextTiddler filter='[tag<CurrentTag>sort[]before<currentTiddler>]'>

[magev958]

Thank you! That worked perfectly :)

[tobaisch]

Hello your Santas,
am I doing something wrong?
In version 5.1.15 it does not work properly.
I can not jump back only forward.
Regards
Tob

[Thomas Elmiger]

Hohoho, dear Tob,

There is an update for my old styles-wiki now and next/previous navigation on the slides is still working. (Other stuff is not working well but that’s due to the experimental nature of hacks collected there.)

https://tid.li/tw5/styles.html#SlideShowMacros:SlideShowMacros%20%24%3A%2Fcore%2Fui%2FViewTemplate%2Fcontrols%20Slideshows should show you the relevant tiddlers, where $:/core/ui/ViewTemplate/controls contains this code:

<div class="slideshow-controls">
<span class="slideshow-next">
<$list filter="[all[current]next[$:/StoryList]]">
<$link to={{!!title}} tooltip="next">
{{$:/core/images/down-arrow}}
</$link>
</$list>
</span>
<span class="slideshow-prev">
<$list filter="[all[current]previous[$:/StoryList]]">
<$link to={{!!title}}  tooltip="previous">
{{$:/core/images/up-arrow}}
</$link>
</$list>

If this doesn’t work in your case I guess we would need more info about your tags and tiddlers.

All the best and happy navigation,
Thomas

[tobaisch]

hello thomas,
thx but it doesnt work.
total chaos.
when clicking it jumps on a random tiddler.
some tiddlers have the arrows (navigation) some not.
no system to recognize.
I put your code in a tiddler with the name "navigation" and give them the tag: "$:/tags/ViewTemplate".
Everything else tiddlers have no tags.
i tryed it also with tiddlers and tagged as "navigation". no impact.
where can be the error?
regards
tob

[Thomas Elmiger]

O.k. my solution uses the storylist instead of tags, so its buttons take you to the next/previous open tiddler. So you would have to open all tiddlers first, independent of tags. (Some other macros in my example do open all tiddlers with a given tag, I think.) If you are on top of the page, there is only one button (next). The same is true for the last tiddler, there will be only the previous button because "next" makes no sense on the last one.

You don't need the first line with the div I gave you in the last post, btw. This is enough:

<span class="slideshow-next">
<$list filter="[all[current]next[$:/StoryList]]">
<$link to={{!!title}} tooltip="next">
{{$:/core/images/down-arrow}}
</$link>
</$list>
</span>
<span class="slideshow-prev">
<$list filter="[all[current]previous[$:/StoryList]]">
<$link to={{!!title}} tooltip="previous">
{{$:/core/images/up-arrow}}
</$link>
</$list>

</span>

If this is not what you need, you could describe your use case in more detail (what you have and what you want to achieve). So people with knowledge of a suitable solution are able to help.

-t

[tobaisch]

thx thomas,
i understand now. it navigates only through the open tiddlers.

So you would have to open all tiddlers first, independent of tags.

I have 800 Tiddlers so far and there are more to come.
That makes no sense to me.
It is a kind of database or glossary.
All Tiddlers has prefix 0001 to 1000, sorted like this and should also be opened in this order
if I want to jump to the next Tiddler.
for that matter, its very simple. :)
regards
tob