Hi @Jack Baty,
there would be a way that involves editing the storyview javascript tiddler
... that solution would be nice to have in the core, it just adds a class
to the tiddler when it's being navigated and removes it after the interval
of the animation duration has passed.
using a stylesheet the tiddler can be styled so that there's a visual
feedback. if no styling is done, nothing changes visually.
if the classic storyview is used, the tiddler is
$:/core/modules/storyviews/classic.js ...
it contains a block "ClassicStoryView.prototype.navigateTo" that looks like
this:
ClassicStoryView.prototype.navigateTo = function(historyInfo) {
var listElementIndex = this.listWidget.findListItem(0,historyInfo.title);
if(listElementIndex === undefined) {
return;
}
var listItemWidget = this.listWidget.children[listElementIndex],
targetElement = listItemWidget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
// Scroll the node into view
this.listWidget.dispatchEvent({type: "tm-scroll", target: targetElement});
};
if it's changed to the following, the class "tc-navigating-classic" is
added for the interval of the animation duration:
ClassicStoryView.prototype.navigateTo = function(historyInfo) {
var listElementIndex = this.listWidget.findListItem(0,historyInfo.title);
if(listElementIndex === undefined) {
return;
}
var listItemWidget = this.listWidget.children[listElementIndex],
targetElement = listItemWidget.findFirstDomNode();
// Abandon if the list entry isn't a DOM element (it might be a text node)
if(!(targetElement instanceof Element)) {
return;
}
$tw.utils.addClass(targetElement,"tc-navigating-classic");
// Scroll the node into view
this.listWidget.dispatchEvent({type: "tm-scroll", target: targetElement});
setTimeout(function() {
$tw.utils.removeClass(targetElement,"tc-navigating-classic");
},$tw.utils.getAnimationDuration());
};
please note that this should be done in a testing wiki at first... I've
tested this on an empty wiki where it works fine
after modifying the tiddler, save and reload.
create a stylesheet tiddler and add your desired styles, like:
.tc-tiddler-frame.tc-navigating-classic {
transition: 0.4s ease;
border: 3px solid <<colour primary>>;
}
--
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 [email protected].
To post to this group, send email to [email protected].
Visit this group at https://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/02fb3fdd-fdfc-417b-b18b-4e3d8a2ecdf1%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
