[Update] Tamasha Presentation Plugin

[Mohammad Rahmani]

I would like to announce the new experimental release of Tamasha plugin.

Code and demo
Demo: https://kookma.github.io/TW-Tamasha
Code: https://github.com/kookma/TW-Tamasha

This beta release has some new features

Release 0.4.3
Feb 2nd, 2021
[NEW] Experimental font size using linear scaling based on vh
[NEW] kimia theme which hides slide number and nav buttons and uses default Tiddlywiki default setting
[NEW] classes to hide UI elements (slide number, nav buttons, progress bar)

The size kept around 34Kb as of the previous update.

Please contribute with your feedback

There are some ongoing experiments on automatic font scaling based on the screen size. I like people who have access to big screens, especially a video projector (which can create a big picture around 2m x 2m) give a try and send me their feedback on the font size, readability and overflow. The feedback can be posted here or preferably to  https://github.com/kookma/TW-Tamasha

On the other end, feedback from the small screens is welcome.

Best wishes

Mohammad

[Ste]

Hi Mo 

On mobile as always (well mostly) 

All looking good. The long long tid at the end disappears off the bottom of the slide but that's the only place it does. 

All the text looks bigger than the last version... I think. (this is a good thing)

Ste

[clutterstack]

I don't have any presentations to make, but I just want to cheer you on.

[TiddlyTweeter]

Ciao Mohammad

All looking good! Only issue I see is really a question , rather than a big problem..

(BTW, the slide Long Long Tid is NOT long enough to illustrate the issue on desktop  :-) .)

Personally, for very long Tiddlers I would like the OPTION for a scroller. 

I think it would increase the range of uses possible. 

For instance: for a library of poems where the texts are longer than screen height.

I know it might sound odd; in that presentations tend to BRIEF text. 

BUT a valid use of them can be for longer things sometimes.

So, just a thought: to have option for a SCROLLER for longer Tiddlers?

Overall its brilliant!

TT

[Ste]

Hi Mo and TT, 

Just to second that. I've just been tinkering moving some of my presentations from your previous excellent slide show to your new excellent slide show and my images just aren't small enough to fit inside the frame! 

[Stephen Wilson]

https://tmcengineering.droppages.com/Onshape%20Mouse%20Tutorial.html if you want a look!

[TiddlyTweeter]

swilson...@gmail.com wrote:

https://tmcengineering.droppages.com/Onshape%20Mouse%20Tutorial.html if you want a look!

Whoah! Very impressive. It is most interesting for being image intensive. That is a real need often.

What happens if you put that in the latest Tamasha?  

TT 

[Nicolas Petton]

Ste <needco...@gmail.com> writes:

Hi Ste,

> Hi Mo and TT,
> Just to second that. I've just been tinkering moving some of my
> presentations from your previous excellent slide show to your new excellent
> slide show and my images just aren't small enough to fit inside the
> frame!

@Mohammad, I think it would be good to scale images the same way we
scale text (not technically the same way, but to get similar results).

Cheers,
Nico

[Michael Wiktowy]

Hi Mohammad,

This is looking really good. Some feedback:

1) Counter-intuitively, looking at the long long tiddler slide, your vh scaling works on small windows but then text over-flows on large/fullscreen windows. I think it is the fact that the horizontal size of the slide content does not change with with the same proportion as the vertical size and the larger text ends up wrapping more and then flows off the bottom. Some scaling of the content window width needs to happen too.

2) How do you sort the slides? Is there a way to specify the sort field and methodology? I couldn't find anything on that and it seems that Tamasha just uses the default unsorted list which, in my experience, will shift occasionally. I see a "slide sorter" tiddler in there so maybe there is some planned functionality that I need to wait for.

Thanks,

/Mike

[Mohammad Rahmani]

On Wed, Feb 3, 2021 at 8:01 PM Michael Wiktowy <mwik...@gmail.com> wrote:

Hi Mohammad,

Hi Mike, 

I really appreciate your feedback.

This is looking really good. Some feedback:

1) Counter-intuitively, looking at the long long tiddler slide, your vh scaling works on small windows but then text over-flows on large/fullscreen windows. I think it is the fact that the horizontal size of the slide content does not change with with the same proportion as the vertical size and the larger text ends up wrapping more and then flows off the bottom. Some scaling of the content window width needs to happen too.

We are working on overflow. Right now the font is scaled based on the viewport height, but the content width is fluid and changes  up to a maximum value. The height is fixed.

 

2) How do you sort the slides? Is there a way to specify the sort field and methodology? I couldn't find anything on that and it seems that Tamasha just uses the default unsorted list which, in my experience, will shift occasionally. I see a "slide sorter" tiddler in there so maybe there is some planned functionality that I need to wait for.

Well, it was possible to pass a filter and use sort operators. But Tamasha uses the simplest, it works on tags. So, simply open one of the slides, click on the tag pill and use drag and drop to reorder them. Any other processes in Tiddlywiki you use to sort or change order of tiddlers based on tags can be used here.

Thanks,

/Mike

On Tuesday, February 2, 2021 at 2:42:45 PM UTC-4 Mohammad wrote:

I would like to announce the new experimental release of Tamasha plugin.

Code and demo
Demo: https://kookma.github.io/TW-Tamasha
Code: https://github.com/kookma/TW-Tamasha

This beta release has some new features

Release 0.4.3
Feb 2nd, 2021
[NEW] Experimental font size using linear scaling based on vh
[NEW] kimia theme which hides slide number and nav buttons and uses default Tiddlywiki default setting
[NEW] classes to hide UI elements (slide number, nav buttons, progress bar)

The size kept around 34Kb as of the previous update.

Please contribute with your feedback

There are some ongoing experiments on automatic font scaling based on the screen size. I like people who have access to big screens, especially a video projector (which can create a big picture around 2m x 2m) give a try and send me their feedback on the font size, readability and overflow. The feedback can be posted here or preferably to  https://github.com/kookma/TW-Tamasha

On the other end, feedback from the small screens is welcome.

Best wishes

Mohammad

--
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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/c874cc09-8f83-4c52-ab53-9ee51aa4dc2en%40googlegroups.com.

[Michael Wiktowy]

wrt 1). Changing the $:/plugins/kookma/tamasha/styles/layout/content stylesheet to get rid of the max-width (and controlling content width via padding) and making sizes relative to vmin rather than vh seems to get pretty good results even for narrow windows.

.tamasha-slide-content {

font-size: 1.3rem;

line-height: 1.85rem;

padding: 30px;

margin: 0 auto;

height: 480px;

overflow: hidden;

margin-bottom: 4rem;

}

.tamasha-overlay .tamasha-slide-content {

font-size: 3vmin;

line-height: 5vmin;

height: auto;

padding: clamp(20px, 10vmin, 20%);

}

There is still a fine range of aspect ratios where the content still overflows but it is better.

I found the clamp bit here:

https://stackoverflow.com/questions/38078957/can-we-define-min-margin-and-max-margin-max-padding-and-min-padding-in-css

Maybe there is some application of clamp(), max() and min() in font-size directly make sure fonts are readable.

/Mike

[Mohammad Rahmani]

Hi Nico,

 That would be great! Tiddlyshow simply uses a max-width:100% to prevent overflow, but scaling based on the screen size is perfect.

Best wishes

Mohammad

 

Cheers,
Nico

--
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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/87y2g5ti13.fsf%40petton.fr.

[Michael Wiktowy]

On Wednesday, February 3, 2021 at 2:09:22 PM UTC-4 Mohammad wrote:

On Wed, Feb 3, 2021 at 8:01 PM Michael Wiktowy wrote:

Hi Mohammad,

...

 

2) How do you sort the slides? Is there a way to specify the sort field and methodology? I couldn't find anything on that and it seems that Tamasha just uses the default unsorted list which, in my experience, will shift occasionally. I see a "slide sorter" tiddler in there so maybe there is some planned functionality that I need to wait for.

Well, it was possible to pass a filter and use sort operators. But Tamasha uses the simplest, it works on tags. So, simply open one of the slides, click on the tag pill and use drag and drop to reorder them. Any other processes in Tiddlywiki you use to sort or change order of tiddlers based on tags can be used here.

Cool. I haven't even realized that unsorted reordering via the tag-pill was a thing. Nifty undocumented feature ... do you know where that ordered list is stored?

Thanks,

/Mike

[Mohammad Rahmani]

Hi Ste,

Your presentation based on Tiddlyshow is traffic. Thank you for sharing.

For images, Nico will have a look to see how to solve the issue. By the way, I did a test. I have imported all your Onshape tiddlers and image into Tamasha and then created a new presentation as below

<<presenter tag:Onshape template:simple theme:mycls>>

<style>
.mycls img{
width:70%;
}
</style>

It works fine in presentation. You can change the width to get better results.

Best wishes

Mohammad

--

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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/a8c6096f-d118-437e-b0b5-2c1a35adfd2bn%40googlegroups.com.

[Mohammad Rahmani]

I don't have any presentations to make, but I just want to cheer you on.

Many thanks Chris.

 

--

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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/7fa12f2e-5daf-467c-8ab6-ac41d3e5abb1n%40googlegroups.com.

[Jeronimo Minino]

Hi Mohammad

Thank you for your continued work on Tamasha.

Two comments:

1.

No access to projectors this week, but I I tested the longlong tiddler
on my notebook screen (3000x2000px) and on my second screen (1366x768px).

If the font sizes are relative to vh, it surprises me that
on the bigger resolution screen (3000x2000) the text reaches near to the bottom edge,
while on the smaller resolution screen (1366x768px) the text does not grow that large.
I attach the 2 screenshots.

2.

I second TiddlyTweeter's wish for an option to scroll long text on some slides.
I actually have had exactly the use case he mentions:
When showing a long poem in the classroom, scrolling down feels to me
as a more beautiful way to show it as a piece of art, than splitting it into 2 or 3 slides.

Have a great day

[Mohammad Rahmani]

Hi Mike,

When you sort tiddlers / reorder tiddlers based on the tag! the sorted items are stored in the list field of tag tiddler.

 

Thanks,

/Mike

--
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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/f224e5a0-5545-42ae-9aaf-a139a0086933n%40googlegroups.com.

[Mohammad Rahmani]

On Wed, Feb 3, 2021 at 9:45 PM Michael Wiktowy <mwik...@gmail.com> wrote:

wrt 1). Changing the $:/plugins/kookma/tamasha/styles/layout/content stylesheet to get rid of the max-width (and controlling content width via padding) and making sizes relative to vmin rather than vh seems to get pretty good results even for narrow windows.

.tamasha-slide-content {

font-size: 1.3rem;

line-height: 1.85rem;

padding: 30px;

margin: 0 auto;

height: 480px;

overflow: hidden;

margin-bottom: 4rem;

}

.tamasha-overlay .tamasha-slide-content {

font-size: 3vmin;

line-height: 5vmin;

height: auto;

padding: clamp(20px, 10vmin, 20%);

}

Thank you Mike! We will give a try to see how it works.

 

There is still a fine range of aspect ratios where the content still overflows but it is better.

I found the clamp bit here:

https://stackoverflow.com/questions/38078957/can-we-define-min-margin-and-max-margin-max-padding-and-min-padding-in-css

Maybe there is some application of clamp(), max() and min() in font-size directly make sure fonts are readable.

Let's have a look.

 

--

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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/1b462f6d-5ced-443e-af94-b3727fa251d6n%40googlegroups.com.

[Mohammad Rahmani]

Hi TT,

Many thanks for your feedback!

Well as you said a slide should be brief. Tamasha has two presentations explaining these rules.

By the way I can add some utility classes to be used for such cases and distributed separately.

As a quick solution use the below div element inside a slide

<div style="overflow-y: scroll;max-height:50vh;">

very long text here ...

</div>

Best wishes

Mohammad

--

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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/d356b227-3c23-40a5-a696-b3404682d73bn%40googlegroups.com.

[Mohammad Rahmani]

On Wed, Feb 3, 2021 at 10:00 PM Jeronimo Minino <jero...@gmail.com> wrote:

Hi Mohammad

Hi Jeronimo,

Thank you for your continued work on Tamasha.

Two comments:

Thank you for your feedback.

1.

No access to projectors this week, but I I tested the longlong tiddler
on my notebook screen (3000x2000px) and on my second screen (1366x768px).

If the font sizes are relative to vh, it surprises me that
on the bigger resolution screen (3000x2000) the text reaches near to the bottom edge,
while on the smaller resolution screen (1366x768px) the text does not grow that large.
I attach the 2 screenshots.

May be @Nico can explain this better, but font size scaled based on height not width!

 

2.

I second TiddlyTweeter's wish for an option to scroll long text on some slides.
I actually have had exactly the use case he mentions:
When showing a long poem in the classroom, scrolling down feels to me
as a more beautiful way to show it as a piece of art, than splitting it into 2 or 3 slides.

In my previous post to TT, I explained how you can simply add user defined classes and control many UI elements.

I recommend using a custom class.

 

--

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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/ec5fd522-02d4-4802-b6c4-a6ea61d02198n%40googlegroups.com.

[Nicolas Petton]

Mohammad Rahmani <mohammad...@gmail.com> writes:

>> If the font sizes are relative to vh, it surprises me that
>> on the bigger resolution screen (3000x2000) the text reaches near to the
>> bottom edge,
>> while on the smaller resolution screen (1366x768px) the text does not grow
>> that large.
>> I attach the 2 screenshots.
>>
>>
> May be @Nico can explain this better, but font size scaled based on height
> not width!

There's still some tweaking to be done, adjusting font sizes and line
heights based on viewport dimensions can be a bit tricky, especially
because ideally you'd want to display the same amount of lines per slide
in "author" (normal) mode and "presentation" (full-screen) mode.

The code in the main branch on GitHub should handle various viewport
dimensions a bit better, but I haven't tried on very large displays like
3000x2000px.

Cheers,
Nico

[Ste]

Thanks Mo, 

I'll have a play with that code tomorrow. 

Ste

[Jeronimo Minino]

Hi Mohammad,

Your "quick solution" with the scrollable div element is just perfect. Thank you very much.

[Mohammad Rahmani]

On Thu, Feb 4, 2021 at 1:20 AM Ste <needco...@gmail.com> wrote:

Thanks Mo, 

I'll have a play with that code tomorrow. 

Ste

Hi Ste,

There is a sample user theme in the demo of Tamasha, you can play with it and customize as you like. Search for demo/sample theme

--

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 view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/f2f6665b-fd5d-4c71-81bf-3c44928ab808n%40googlegroups.com.

[Mohammad Rahmani]

Tamasha is now listed in the KaTex user page

https://katex.org/en/users.html

Best wishes

Mohammad