How to push a tiddler from the story river to the top of it?

#1

I had a look at ControlPanel->Appearance->Toolbar->View Toolbar but I don’t see such a magic button there.

I have a workflow that involves two ways of adding tiddlers to the story river:

  • I have a tiddler which is the root of a big multi-level ToC, this tiddler auto opens at startup
  • When I want to work with an existing tiddler, I click on the link to it in the ToC. The tiddler opens in the story river below the root tiddler
  • Sometimes I need to create a tiddler, then I click to the new tiddler button in the Page Toolbar. It opens above the root tiddler

Whenever I need to move content from an existing tiddler into a new one, there’s at least the root tiddler between them, sometimes other open tiddlers. All of this does not fit on the screen, regardless if it’s a phone or a PC.

I thought a simple workflow that would be effective on any screen would be to have a button in the View Toolbar that will push the existing tiddler to the top of the story river, so the new tiddler ends being just under it, thus saving me a lot of scrolling.

Does TiddlyWiki offer such functionality? Hypothetically, I know how to add a new, custom button to Edit Toolbar, so if I knew where to read in the docs to learn how would the event handler for such a button look, I’m willing to try doing it myself.

Edit: I missed to specify it explicitly: I want the tiddler moved to the top of the story river, and the story river auto-scrolled there of course.

#2

I’m not sure if this fits your exact workflow needs, but you might try:
https://tiddlytools.com/#TiddlyTools%2FTemplates%2FPin

This ViewToolbar adds a “pin/unpin” button to each tiddler’s toolbar.
It also creates an “AboveStory” container for displaying the tiddlers that are currently “pinned”.

-e

#3

I have managed it with the following:

<$button>
  <$action-setfield $tiddler="$:/StoryList" $field="list" $value=`[[$(currentTiddler)$]] ${ [{$:/StoryList!!list}] }$` />
  <$action-sendmessage $message="tm-focus-selector" $param="h2.tc-title" />
  Move to top
</$button>

action-setfield prepends the currentTiddler to the story list (it will be repeated down along the list, but this is ignored/ automatically deduplicated), then the message tm-focus-selector sets the focus on the first tiddler title in the river.

You would just need to neatly put these two actions inside a properly structured view toolbar button.

This was quickly put together as I was trying if it is possible at all. There might be a more elegant way to do this. I expect it could fail on titles containing [ ] { }.

1 Like
#4

I have just tried your recipe in four setups, with mixed results.

  1. Android Tiddloid
  2. Android Vivaldi browser
  3. Ubuntu TiddlyDesktop (the official compiled portable release from Github)
  4. Ubuntu Vivaldi browser

1. and 2. work just fine.

Both 3. and 4. have an anomaly. So far I have narrowed it down to two different scenarios:

a) The story river is in its lets say “initial state”. Its head - the very first tiddlers are visible on screen. Any of those first tiddlers that is fully visible gets pushed correctly to the top by your event handler. Autoscrolling is not involved here.

b) Many tiddlers are opened to make the story river long enough to not fit on screen. If I scroll to the bottom of the story river and try to push a tiddler from its tail (not necessarily the last one) - it goes to the top, but the autoscrolling is not exact. I don’t see the whole first tiddler on screen. Sometimes just a half of it, sometimes a very small part of its footer.

Perhaps another DOM element that is upper in the tree shall be picked for autoscrolling back to it?

#5

Others seem to be helping you achieve this. But I wondered if you might find a different approach helpful. I use @btheado’s move-to-top layout (thread ) alongside setting the Control Panel > Settings > Tiddler Titles to “Display tiddler titles as links”. This makes it simple: all tiddlers open at the top of the story river. And if you click on the title of the current tiddler, it moves to the top. Thus if I want two tiddlers near one another for copying or whatever, I can just click on both from any link, sidebar, story river, wherever, and they will be the first two.

1 Like
#6

If I understand correctly, pinning works like the Open tab, just allows building a subset of tiddlers and provides a shortcut to access them, right? And it doesn’t influence the placement of tiddlers in the story river. For me it’s essential to put the current tiddler at the top, because I know next tiddler is the draft for a new one and I’m minimizing scrolling between them.

@vilc 's solution “almost” does what I want, I posted feedback above.

#7

Aside from the fact that I developed a phobia towards big pieces of wikitext :rofl: , this solution seems to be working correctly on desktop. I think it will be my plan B if the problem with tm-focus-selector that I described above isn’t getting ultimately sorted out.

And it’s a pity this solution isn’t packaged into a plugin, it would be easier and quicker to have it bundled in many wikis.

#8

I tried to experiment with this a little.

My idea was to try “cheating” by jumping above the first tiddler. So I used

$param="input"

to jump to the search field.

This works on desktop in the browser, because the input field is above the story river. Doesn’t work in TiddlyDesktop, because it uses a two-pane layout and the input field is on the right side of the story river rather than above it.

#9

One more idea, perhaps worth experimenting, for me works the same in desktop browser as h2.tc-title.
You can place something above the story river using the $:/tags/AboveStory tag.
If you tag a tiddler with $:/tags/AboveStory and in its text you put something like: @@display:none;@@, it will add an invisible section.story-backdrop at the top of the story river. Try this as the $param.

#10

Unfortunately this does not fix the issue. I still get only the bottom of first tiddler after autoscroll in TiddlyDesktop.