How to build a custom storyview?

#1

Is there a documentation on how storyviews work?

  • What elements are needed?
  • What happens, when the storyview is changed?
  • What ressources of other storyviews can be while these are not active?

Given the power of that tool my knowledge here is quite incomplete.
In Kristal and even in @BurningTreeC 's new multicolumn for example this does not seem to work correctly. horizontal figures as a storyview…but you cannot switch to normal.

So : How do I build a storyview?

Slideshow / presenter based on horizontal storyview
#2

What does not work correctly? It isn’t clear what you are referring to here. Please clarify with a description of what does not work correctly and instructions for how to recreate the problem.

Can you please try to express this differently? I really do not follow what you are trying to say here. What are “horizontal figures” ? What are you referring to as normal?

A storyview is a single JavaScript file that adds behaviour to a ListWidget, usually in terms of animation and hiding/showing elements. The storyviews in the core are designed to work with the core layout and CSS.

#3

Hi Saq, both views appear in the storyview-dropdown as “horizontal” respectively “multi-column”, but you cannot switch back to classic, pop or zooming in that dropdown.

#4

The storyview dropdown in the control panel shows all story views that are available in the wiki, i.e. the JavaScript code is present. However it is the layout that needs to be setup to use them - by assigning the storyview attribute of the list widget that generates the tiddlers in the story - and not all custom layouts will work with all storyviews.

Changing the storyview in this dropdown wont actually change the storyview being used unless the layout is designed to use this setting. This is similar to how not all theme tweaks work with custom themes.

For a multi-column layout, I actually allow configuring a different storyview for each column.

#5

Okay,
that sounds quite complicated.
So we need three components

  • Layout
  • Theme and
  • storyview
    which work together … but which are not necessarily compatible.

I wish it was as easy as in muuri

1 Like
#6

It really depends on the multi-column layout implementation. In mine I have no trouble using the zoomin and classic storyviews. @BurningTreeC might not have thought of making the storyviews configurable.

#7

Hi @saqimtiaz,
I’d love to see your implementation, it’s always an inspiration to see the things you build ;-).

#8

Is there a simple way of switching Layout … or does this simply mean switching theme.

1 Like
#9

Layouts essentially refer to different page templates, and you can switch between them with ctrl+shift+L https://tiddlywiki.com/#Alternative%20page%20layouts

It isn’t much different to Jeremy’s work in TWPub and an extension of what I worked on in the Stories plugin. I don’t have the opportunity to get into a shareable shape and prefer to focus my efforts on work on the core instead.

#10

Hello @Jan ,

I think I’m causing confusion because in my multi-column layout I have temporarily disabled the use of other storyviews than “multi-column”

I’m going to enable the storyviews now, will be online within some minutes

Best wishes,
Simon

2 Likes
#11

Building a custom storyview is not that difficult.
Have a look at https://tiddlywiki.com/#%24%3A%2Fcore%2Fmodules%2Fstoryviews%2Fclassic.js

It simply applies an animation when an element is inserted and removed

1 Like
#12

That is very good basic info! Tx!

Regarding the OP, I got a bit clearer that you CAN make stuff compatible with the existing storyviews so long as you stay within their scope of function.

Personally I’d far rather use what we have than get into divergences.

Your note is useful in clarifying the basic architecture!

Best, TT

1 Like