Wikitext navigator and TWPub

BurningTreeC · April 5, 2022, 8:15am

I’d be really interested in how that solution works. I know I’d have to look into the corresponding tiddlers on twpub-tools.org and I already tried to get an idea how your navigation mechanism works but I’m unable to follow where it’s used on that page and how it can be implemented for - say - the standard tiddlywiki.com layout

I believe there are more people interested in the workings of such a “wikitext navigator”, and I would be very interested in building one for my own purposes.

Do you have some hints that allow getting a basic understanding of the inner workings?

Kind regards,
Simon

saqimtiaz · April 5, 2022, 8:27am

@BurningTreeC Jeremy was referring to the anchor links technique, not the one in TWPub.

For TW Pub, refer to these tiddlers:

Page layout:

github.com

TWPUB/TWPUB-Tools/blob/df50800be62e6dddee3402a9cf98258d91d9d30d/plugins/twpub-tools/$-plugins-immateriel-twpub-tools/PageLayout.tid#L29

    
      
          	tv-config-toolbar-icons={{$:/config/Toolbar/Icons}}
          	tv-config-toolbar-text={{$:/config/Toolbar/Text}}
          	tv-config-toolbar-class={{$:/config/Toolbar/ButtonClass}}
          	tv-enable-drag-and-drop={{$:/config/DragAndDrop/Enable}}
          	tv-show-missing-links={{$:/config/MissingLinks}}
          	storyviewTitle={{$:/view}}
          	languageTitle={{{ [{$:/language}get[name]] }}}
          >
          	<div class="tc-layout-flextemplate">
          		<$importvariables filter="$:/core/ui/Navigator">
          			<$macrocall $name="navigator-handler" content=<<body>>/>
          		</$importvariables>
          	</div>
          </$vars>

Story layout:

github.com

TWPUB/TWPUB-Tools/blob/df50800be62e6dddee3402a9cf98258d91d9d30d/plugins/twpub-tools/$/core/ui/Columns/story.tid#L36-L46

    
      
          				<$messagecatcher
          					$tm-navigate=<<generic-handler>>
          					$tm-close-tiddler=<<generic-handler>>
          					$tm-edit-tiddler=<<generic-handler>>
          					$tm-save-tiddler=<<generic-handler>>
          					$tm-cancel-tiddler=<<generic-handler>>
          					$tm-save-tiddler=<<generic-handler>>
          				>
          					<<navigation-popup>>
          					<<story-river-content>>
          				</$messagecatcher>

Navigator (as wikitext macro):

github.com

TWPUB/TWPUB-Tools/blob/main/plugins/twpub-tools/$/core/ui/Navigator.tid

title: $:/core/ui/Navigator

\define tv-action-refresh-policy() always

\define generic-handler()
<$vars storyConfigurationTiddler={{{ [<event-paramObject-storyConfigurationTiddler>!is[blank]] ~[all[shadows+tiddlers]tag[$:/tags/Story]] }}} >
	<$vars storyDefinitionTiddler={{{ [<storyConfigurationTiddler>get[story-definition]] }}}>
<$action-log message="In navigator generic-handler"/>
<$action-log/>
		<$importvariables filter={{{ [<storyDefinitionTiddler>get[imports]] }}}>
			<$importvariables filter=<<storyDefinitionTiddler>>>
				<$transclude tiddler=<<storyDefinitionTiddler>> field=<<event-type>>/>
			</$importvariables>
		</$importvariables>
	</$vars>
</$vars>
\end

\define navigate-handler()
<!--

This file has been truncated. show original

BurningTreeC · April 5, 2022, 8:33am

Thank you @saqimtiaz , and thank you for splitting this into a new Post

jeremyruston · April 5, 2022, 8:38am

At the moment, the wikitext navigator allows arbitrary parameters to be associated with a navigation, as well as the target tiddler title. The plan is to make one of the parameters be an optional anchor link within the target tiddler. I’m hoping to be able to unify navigation within TWPubs with navigation within tiddlers.

BurningTreeC · April 5, 2022, 10:40am

I have a stupid question about this wikitext-navigator implementation:

Where and how does it trigger a scroll? I just don’t get it

saqimtiaz · April 5, 2022, 12:15pm

Is there a specific behaviour in TWPub that you can point out - preferrably with steps to reproduce or a video/image illustration - that you wish to understand the implementation of?

I believe you are operating under some misassumptions that are leading you astray. As I clarified earlier, the alternative technique for scrolling that has been mentioned is that of using anchor links: https://tiddlywiki.com/#Anchor%20Links%20using%20HTML

As Jeremy mentions above, the wikitext navigator might be extended to optionally support navigation to a specific anchor within a tiddler. It does not as of this moment support navigation within tiddlers.

JanJo · April 5, 2022, 1:32pm

Thanks for this example
When I tested, it seemed, that the example often jumps slightly too far so that the referred header is just offscreen above. Is there a way to cure that?

saqimtiaz · April 5, 2022, 1:43pm

I believe that is due to the top menu bar plugin which obscures the heading being navigated to. See [BUG] Anchor link targets "hide" under menu bar · Issue #5150 · Jermolene/TiddlyWiki5 · GitHub

TW_Tones · April 6, 2022, 12:56am

I belive this s similar to setting the top for sticky titles

SeeSee $:/themes/tiddlywiki/vanilla/sticky and set Top to 40px as an example