[Thoughts] Using TW5 as Browser-Based Presentation-Tool

[Alexander Eckert]

Hi,

I knew that I flooded this forum since last week end, but I got some ideas for the last two years. One idea is to use TW5 as a presentation-tool. I know, that some people already got this idea and built some examples, but my vision is much simpler. I think the standard is design shouldn't be changed to much. My idea got a educational purpose, because I want to put all my presentations into one file and maybe change between them.

In my opinion the standard tiddler could be a single chart, if you reduce the SideBar through the button in the top right corner. Only some things should be done to use TW5 as a presentation tool:

• Auto adjust font size to fit the computer screen in browser-fullscreen-mode (maybe with CSS or ViewTemplate)
• Add button to return to tiddler, which called the current shown tiddler (through ViewTemplates and maybe parameters)
• Add keyboard-shortcuts (Arrow Up/Down, Arrow Right/Left) to go through presentation

If this three features could be implemented TW5 could be a very nice browser-based presentation-tool. I'll try to get those features going. If You got any ideas including further features or methods of implementing, please let me know.

Kind regards,

Alex

[Alexander Eckert]

Too adjust font size I think

font-size: 1vh;

could be a solution for stylesheet

[Alexander Eckert]

After further code-research.

tc-tiddler-frame should max size and weight 100 with padding.
font-size of title and body should be adjusted with vh and vw.

[Alexander Eckert]

OK, after some coding this seems to work in alpha-status, but the scroll-event should be change.

Anyone know how to change the $:/core/modules/utils/dom/scroller.js to edit the target point?

If the new tiddler is below or above the current tiddler the scroller should stop later to see the whole new tiddler. Atm the top or bottom are not shown.

[Jan]

Hi Alex,
A Sildeshow is very intersting Project.
There is a very nice Example done by Birthe http://showroom.tiddlyspot.com/ which has some very nice features for the organisation and creation of slideshows. It comes with a Moderatorpane in a PopUp
From the point of view of design Jeremy's http://tiddlywiki.com/talkytalky/ is great.
Please upload it somewhere if make a theme in which you manage to accomplish what you intend.
Jan

--
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 tiddlywiki+...@googlegroups.com.
To post to this group, send email to tiddl...@googlegroups.com.
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/700df2c0-b040-4b27-a210-4a6b5f962a9d%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Alexander Eckert]

Hi Jan,

thanks for your answer. Both examples looks fine, but I like the current design very much. Its simple and clear, and I like the scrolling effect. I prefer seeing the lower end of the previous Tiddler above.

If I reach my goal I'll post that plugin.

1) The scrolling effect could be solved with the Plugin TopStoryView from felixhayashi (https://github.com/felixhayashi/TW5-TopStoryView). I'll set this as a dependency.

2) The variable Button to return to the calling tiddler should be done with tm-add-field and the FieldManglerWidget, where the name of the calling tiddler is added to the field "calling-tiddler" of the opened tiddler.

[Alexander Eckert]

OK, next step done =)

The "Next" and the "Back"-Button could be performed with:

<$fieldmangler tiddler="Next Tiddler">
<$button>
<$action-setfield $tiddler="Next Tiddler" tiddler-calling={{!!title}}/>
<$action-navigate $to="Next Tiddler"/>
Next
</$button>

</$fieldmangler>

and

<$button>
<$action-navigate $to={{!!tiddler-calling}}/>
Back
</$button>

=)

[Jed Carty]

I don't think you need the fieldmangler widget for that. I think it is needed for messages but not for action widgets.

For navigation you may find the 'before' and 'after' filter operators useful. If you want to look at the code I used for the forward and backward buttons in my Photo Gallery things may help. I haven't gotten them up as a plugin yet but you can see them if you look at the pet diary I am working on here. The macro that makes the buttons is in this tiddler.

[Birthe C]

Or maybe Matabeles example http://listops.tiddlyspot.com/


Birthe

[Alexander Eckert]

Hi Jed, Hi Birthe,

thanks for your solution. I'll have a closer look at them after finishing the first steps. So far my example works, but maybe is not the best solution. Atm the keyboard-shortcut is a bigger problem (in my opinion). For days I tried to add Keyboard-Support for this ActionWidgets (right => next slide, left => last slide). Unfortunately I did not found much information about this. I'll continue trying, but if you got ideas, please let me know.

Kind regards,

Alex 

[Jeremy Ruston]

Hi Alex

On 3 Jun 2016, at 20:29, 'Alexander Eckert' via TiddlyWiki <tiddl...@googlegroups.com> wrote:

For days I tried to add Keyboard-Support for this ActionWidgets (right => next slide, left => last slide). Unfortunately I did not found much information about this. I'll continue trying, but if you got ideas, please let me know.

The problem here is that there is currently no general support for tracking the currently selected/focussed tiddler in the story view, and thus no context for the next/previous handling.

In the specific case of the zoomin storyview you may be able to work around it by treating the most recently navigated tiddler as the currently selected tiddler for focus tracking purposes.

Best wishes

Jeremy

[Jed Carty]

While it wouldn't track when you manually scroll you could have a state tiddler that lists the current tiddler for the presentation and when you want to go forward or back you use the action navigate widget. When I get into work in a few hours I will take a quick look at it. 

[Jed Carty]

Well, using a state tiddler can take care of managing which tiddler is the current tiddler in the presentation, but now I am having trouble getting the keyboard input. For the keyboard widget something needs to have focus and so far that is proving to be a problem. Also the left and right buttons aren't working for me. I may be able to make something where you click a button or text box to give it focus and then use some keys to navigate from there, but it isn't a very elegant solution.

I think that I made a mistake with how I made the keyboard widget trigger action widgets. The way it is now every action widget inside the keyboard widget tags is used, so if you want to let the same thing have focus and use two separate action widget based keyboard actions than you have to be careful and not everything is possible.

I will have to fix the keyboard widget before I can do this the way I was hoping to. It may be a while.

[Thomas Elmiger]

Hi folks!

I used TW for presentations myself and guess what I missed … keyboard/presenter support.

I didn’t have much time, so I made tag-lists and kind of a self-referential footer to copy-paste. And used my mouse. – I am sure, there are better ways to do this, but maybe it is worth the time for you to take a look at my primitive (but working) example for next page link: http://wkh.thomas-elmiger.ch/#JavaScript – a back link would be possible too, I guess.
Good luck! Thomas

[Alexander Eckert]

Hi Jeremy,

Hi Jed,

Hi  Thomas,

@Jeremy: Thanks for your answer. After testing the zoomin storyview this seems to be my workaround. Now I'm trying to set focus und for that I have to dig deeper in the manual.

@Jed: My first thought was a lil widget at the Sidebar, but I want to hide the sidebar. This solution wont work for me. I'm able to set variable buttons to open previos tiddler after I wirte the name of the calling tiddler into a field of the current tiddler. Maybe this mechanism will work to get focus of the current tiddler, but atm I dont know how. I'll try this week.

@Thomas: Thanks for your example. This problems seems to be a bit older =). If I'm able to get focus und use Buttons in zoomin storyview I'll let u know and upload an example.

Best regards,

Alex

[Alexander Eckert]

It would be awesome if someone got a working KeyboardWidget-example with focus-settings and can post this. I need to see some syntax to understand this mechanism. 

Best regards,

Alex

[Jed Carty]

I will try to track down my french flashcards I made and post it tomorrow. It was what I made the updated keyboard widget for so it should have a reasonable example.

[Dave]

Here's a recent thread on TW5 as a presentation tool 

https://groups.google.com/forum/#!searchin/TiddlyWiki/presentation/tiddlywiki/9FsMLX3ZQsE/y7dtSSW7AQAJ

I use a modified version for patient education in my clinic.  I haven't read this current thread all the way through but I'd love to be able to add the keyboard navigation.

Dave

[Alexander Eckert]

After days of "Trial and Error" I recognized, that I don't know enough about the internal structure of TW5 to get this done. Unfortunately I dont fully understand those few Keyboard-Examples.I think this project is paused until further notice.