Plugin: SingleTiddlerView

Plugins
#1

I finally got around to make my single-tiddler view into a proper plugin.
This plugin actually comes with two components: a minimal story view that removes all animations when navigating between tiddlers, and a SingleTiddlerView page template that only shows a single tiddler at a time in the story river:

https://yaisog-singletiddlerview.tiddlyhost.com/

Check out the plugin readme for instructions on how to activate everything.

An advantage of this page template is that feels fast. Without the animations and with only a single tiddler that needs to be rendered during refresh, this can make large wikis feel more responsive, with faster much refresh times.

Previously, I hijacked the zoomin story view to hide all tiddlers except one (https://talk.tiddlywiki.org/t/zoomin-storyview-without-navigation-animations/6106). However, this is not the purpose of a story view. The selection of the tiddlers shown in the story river is part of the page template, and I finally put it there.

Currently, this plugin works only in 5.3.0-prerelease due to the way that the flexible MessageCatcher is implemented (see https://github.com/Jermolene/TiddlyWiki5/pull/7340 for more details and the original code by @btheado). The MessageCatcher needs to intercept tm-close-tiddler and tm-delete-tiddler to set a new tiddler to view after closing / deleting, so that the screen does not remain empty. The way it is implemented, the previously viewed tiddler is shown in this case, which is on the wish list for some users (see https://github.com/Jermolene/TiddlyWiki5/issues/7262).

Also, before installing the plugin you need to import the :then filter run prefix functionality from https://github.com/Jermolene/TiddlyWiki5/pull/7392 which you can drag-n-drop from the demo site.
I apologize for this extra bump in the road, but I am confident that the PR will be merged shortly so that this step can be skipped in the future.

If anything breaks, press Ctrl+Shift+L to select the default page template and let me know in the comments.

Yaisog

PS: Since $:/HistoryList!!current-tiddler is always synchronous with the tiddler being shown, this enables e.g. displaying additional information about this tiddler in the sidebar by referencing this field of the HistoryList or highlighting the displayed tiddler in the list of open tiddlers.

3 Likes
Defining "single-tiddler mode" via the Story River
Adapted Zoomin Storyview without Navigation Animations breaks in 5.3.0
#2

Thank you @Yaisog,

The demo is on TW 5.2.5. I think it should be published with TW 5.3.0p

1 Like
#3

Thanks for sharing, @Yaisog! I’m still working on integrating it with the alternate layout I use, but it’s been very smooth and bug-free in the prerelease so far.

#4

@Yaisog Ctrlpanel in the demo site:

image

AND clicking Appearence > Layout > SingleTiddlerView also causes bug

#5

Hi @Mohammad, you are right. The plugin does not work on TiddlyHost sites, because 5.3.0-prerelease is not available there. The site I am linking to is actually just my collection of plugins, not a demo. I have thus disabled the plugin there.

Does anyone know if there is a version-checking mechanism for plugins in TW? I put “>=5.3.0-prerelease” in the core-version field, but that doesn’t trigger any warnings…

#6

When you create a new site on TiddlyHost, there is a more option, click on t then you see create from prerelease and the TW 5.3.0p is there.

#7

Hi @Mohammad, thanks for the pointers. I set up a 5.3.0 demo site on TiddlyHost. The required :then run prefix can also be installed from there. Hope this makes it easier to get things up and running…

Yaisog

2 Likes
#8

Thnak you @Yaisog. I did some experiments (Win 10 + Chrome/Edge 113) and it works great! I will give more feedback.

There was some discussion I think 2019 or 2020 on single tiddler mode (please see Jermolene/TiddlyWiki5 at single-tiddler-mode (github.com))

I was working on TiddlyShow (later Tamasha) to create a PowerPoint like app in TiddlyWiki and I had to use the Zoomin story view. It caused a lot of trouble, as I could not create slide transitions and effects.

There was some discussion on having History tab instead Open tab. This may be of your interest.

I see $:/plugins/yaisog/single-tiddler-view is fast and small. I thought it may also be used for creating a Photo album in TiddlyWiki.

#9

Hi @Mohammad, when I did some experimenting with modals, the one thing that couldn’t be done in pure WikiText+CSS were the animations (background fade and “drop-in” of the modal from above). I then made some storyviews for that. Storyviews are actually just JS scripts that control how $list elements are inserted or removed. So I made a storyview that fades in a semi-transparent layer (backdrop) that covers the background and another one that drops in the modal content from above. Both are used by separate ListWidgets. I could imagine that this might be adapted as a base for slide transitions.

modal-storyviews.json (5.5 KB)

These are used like this (ignore everything that does not have anything to do with the storyview):

	<$list filter="[prefix<__statePrefix__>sortan[]last[]]" variable="stateTiddler" storyview="modal-fade">
		<!-- Show the backdrop unless we are in debug mode -->
		<$list filter="[<stateTiddler>getindex[$debug]else[no]!match[yes]]" variable="ignore">
			<$eventcatcher $click=<<close-all-modals>> selector=".tc-modal-backdrop" tag="div" class="tc-modal-frame">
					<div class="tc-modal-backdrop" />
			</$eventcatcher>
		</$list>
	</$list>
	<$list filter="[prefix<__statePrefix__>sortan[]last[]]" variable="stateTiddler" storyview="modal-drop">
		[modal template goes here]
	</$list>

If you look at the storyview code, it’s mostly just some JavaScript that controls CSS properties.

I hope this is usable for you somehow…

Yaisog

1 Like
#10

Thank you @Yaisog. Very nice! I though a button to start presentation can be used to also switched the storyview!