[tw] A slider which closes itself when clicking elsewhere or closing tiddler

[passingby]

I am trying to make a small quiz for myself in which a question is followed
by its answer hidden in a slider.

I have looked at Stephen Hradek's solution using CSS but I shall be using
my TW on a mobile and hence the hovering thing does not work too well. I
find myself selecting tiddler text again and again while trying to reveal
content. don't want that.
What I want is that content should be revealed upon a click, preferably a
button. And that it should close itself when I close the tiddler so that
next time I open the tiddler again the content should be hidden by default.

This is similar to the tiddler info panel which after opening closes itself
upon a click anywhere else and is also closed by default when the tiddler
is opened again after closing.

Any ideas?

[s***@gmail.com]

Hi,

Post by passingby
What I want is that content should be revealed upon a click, preferably a
button. And that it should close itself when I close the tiddler so that
next time I open the tiddler again the content should be hidden by default.

This is similar to the tiddler info panel which after opening closes itself

Post by passingby
upon a click anywhere else and is also closed by default when the tiddler
is opened again after closing.

Since nobody else has answered, here are two quick "hacks" that might help,
even if they aren't exactly what you requested and are quite certainly not
"polished" enough for a public wiki:

1.) Add the answer to the "Info" panel itself:

<$button>
<$action-listops $tiddler="Display Answer"
$tags="+[append[$:/tags/TiddlerInfo]]"/>
<$action-setfield $tiddler="Display Answer" caption="Answer"/>
<$action-setfield $tiddler="Display Answer" text="{{!!answer}}"/>
<$action-setfield $tiddler="$:/config/TiddlerInfo/Default" text="Display
Answer"/>
<$action-setfield
$tiddler="$:/config/ViewToolbarButtons/Visibility/$:/core/ui/Buttons/info"
text="show"/>
Make Changes
</$button>

After executing this code, you can reveal any content from the "answer"
field of an individual tiddler by clicking its "Info" button. Disadvantage:
The "Answer" tab will appear in Info panels of tiddlers that aren't part of
the quiz, too.

2.) Use a modal to display the
answers: https://tiddlywiki.com/#WidgetMessage%3A%20tm-modal

Using a modal is maybe not the prettiest solution, but simple and
straightforward.

Cheers,

Stef

[Stephan Hradek]

I do not know, how far you followed my exampl, but an easy trick, with
HTML5 enabled browser is:

1. instead of @.answer @ put around the answers

<p contenteditable="true" class="answer">
answerhere
</p>

2. change the "hover" in the CSS to "focus"

Now when you click on the anwer, it will get focus, and will be displayed.

You will be able to edit the answer, but this won't be stored. after
closing and reopening the tiddler, the correct answer will reappear.

['Andreas Hahn' via TiddlyWiki]

Hi,

just to add onto all the tips you have already gotten: The info tab uses
the button popup mechanism to get the behaviour that you want, so an
example would be this (taken from the documentation at [1]):

|<$button popup="$:/SamplePopupState">Open Answer</$button> <$reveal
type="nomatch" text="" state="$:/SamplePopupState"> ! This is the Answer
1+1 = 2 most of the time :o </$reveal>|

/Andreas

[1] https://tiddlywiki.com/#RevealWidget

[s***@gmail.com]

Hi Andreas,

Post by 'Andreas Hahn' via TiddlyWiki
Hi,
just to add onto all the tips you have already gotten: The info tab uses
the button popup mechanism to get the behaviour that you want, so an

This, of course, makes much more sense than my suggestions (at least in
this particular case). For some reason, I hadn't been aware of this feature
of the reveal widget.

Cheers,

Stef

[passingby]

Friends
I am really sorry i got busy and made no progress on the issue. Maybe this
weekend. I shall update if i get something done.
Thank you for your suggestions/

Post by s***@gmail.com
Hi Andreas,

Post by 'Andreas Hahn' via TiddlyWiki
Hi,
just to add onto all the tips you have already gotten: The info tab uses
the button popup mechanism to get the behaviour that you want, so an

This, of course, makes much more sense than my suggestions (at least in
this particular case). For some reason, I hadn't been aware of this feature
of the reveal widget.
Cheers,
Stef

[Steven Schneider]

Another alternative: use the <$appear>
<http://tobibeer.github.io/tw5-plugins/#appear> plugin by tobibeer

Post by passingby
Friends
I am really sorry i got busy and made no progress on the issue. Maybe this
weekend. I shall update if i get something done.
Thank you for your suggestions/

Post by s***@gmail.com
Hi Andreas,

Post by 'Andreas Hahn' via TiddlyWiki
Hi,
just to add onto all the tips you have already gotten: The info tab uses
the button popup mechanism to get the behaviour that you want, so an

This, of course, makes much more sense than my suggestions (at least in
this particular case). For some reason, I hadn't been aware of this feature
of the reveal widget.
Cheers,
Stef

[passingby]

Post by Steven Schneider
Another alternative: use the <$appear>
<http://tobibeer.github.io/tw5-plugins/#appear> plugin by tobibeer

Thank you for know about tobi's plugin. I tried it out and it seems it will
serve the purpose well. Thanks!