Questions for enabling/disabling-button for plugin tobibeer.github.io/tw5-plugins/#preview

[Surya]

Hello all,

I would like to have a button on my wiki with which I can enable/disable the Preview-Tiddler-Links from http://tobibeer.github.io/tw5-plugins/#preview.
So that, when deactivated, on the whole wiki there is no more preview of links. And, when activated, there is my normal setting of previewing links.

I have a solution with a checkbox:

<$checkbox tiddler="$:/config/Plugins/Disabled/$:/plugins/tobibeer/preview" field="text" checked="yes" unchecked="no" default="no"> Disable Preview?</$checkbox>

That works. But:

1.) I have to save and reload the wiki to have the effect working.
So it is useless for the visitors of my public wiki.
How can I enable/disable it with only 1 click without having to save & reload the wiki?

2.) I would like to have a button with an image in it for that.
This should be only ONE button which reflects the two states.
When the plugin is enabled, the button turns green and shows the image.
When the plugin is disabled, the button shows the image but with a red cross above it (I think, I would make another image for that state).


How can I make that?
Any ideas for that???

Thanks, Surya!

[Jed Carty]

Plugins that include javascript can't be toggled without reloading the wiki so I don't think that a button like you want to use can be done without modifying the plugin itself.

[Evolena]

Instead of disabling the whole plugin, you could try to modify the "exclude" filter configuration ($:/plugins/tobibeer/preview/defaults/exclude by adding/removing [all[tiddlers]]) or the classes for which there is no preview ($:/plugins/tobibeer/preview/defaults/not by adding/removing tc-story-river or even tc-body for example).

[Surya]

Hi Evolena,

ahh, great :-)
I did it now with (and the tag $:/tags/TopRightBar):

<div class="tooltip">
<$checkbox tiddler="$:/plugins/tobibeer/preview/defaults/exclude" field="text" checked="[all[tiddlers]]" unchecked="[is[system]] [all[shadows]] [!has[text]]" default="[is[system]] [all[shadows]] [!has[text]]"></$checkbox><span class="tooltiptext"> Preview Deaktivieren?</span>
</div>

and it works perfect- without saving/reloading :-))


Now I'd like to make the state more visible for others.
Means: I would like to have a button for this.
It should show "Preview?" and should turn green, when the preview is enabled and should turn red, when preview is disabled.
Maybe it has to have a checkbox inside it- clicking the button means clicking the checkbox?
Or is it better to make it without checkbox inside, but sending messages?
If sending messages is better, how should I write that?
It should be only ONE button.

Do you know what I try to explain?

But now for the first: A great thank you!!
Surya

[Jed Carty]

I think that the best way to do that is to make a button that looks like a checkbox like this:

<$button class='tc-btn-invisible tooltip'>
<$reveal type='match' state='$:/plugins/tobibeer/preview/defaults/exclude' text='[all[tiddlers]]'>
<input type='checkbox'/><span class="tooltiptext"> Preview Deaktivieren?</span>
<$action-setfield $tiddler='$:/plugins/tobibeer/preview/defaults/exclude' text='[is[system]] [all[shadows]] [!has[text]]'/>
</$reveal>
<$reveal type='nomatch' state='$:/plugins/tobibeer/preview/defaults/exclude' text='[all[tiddlers]]'>
<input type='checkbox' checked/><span class="tooltiptext"> Preview Deaktivieren?</span>
<$action-setfield $tiddler='$:/plugins/tobibeer/preview/defaults/exclude' text='[all[tiddlers]]'/>
</$reveal>
</$button>

The two reveal widgets change what the button does depending on the state. This is how you make something like a checkbox that can do more than just the normal checkbox actions. You can put a div inside it and style the div to make change more about it also.

[Surya]

Hello Jed,

thanks for your suggestion :-)
I made it now with this:

<$button class='tc-btn-invisible tooltip'>
<$reveal type='match' state='$:/plugins/tobibeer/preview/defaults/exclude' text='[all[tiddlers]]'>

@@background:orange;<input type='checkbox' checked/><span class="tooltiptext">No Preview?</span>@@

<$action-setfield $tiddler='$:/plugins/tobibeer/preview/defaults/exclude' text='[is[system]] [all[shadows]] [!has[text]]'/>
</$reveal>

<$reveal type='nomatch' state='$:/plugins/tobibeer/preview/defaults/exclude' text='[all[tiddlers]]'>

@@background:lightgreen;<input type='checkbox'/><span class="tooltiptext">No Preview?</span>@@

<$action-setfield $tiddler='$:/plugins/tobibeer/preview/defaults/exclude' text='[all[tiddlers]]'/>
</$reveal>
</$button>

That's better now than before, because it shows more visible the state.
I changed the states, because checking should mean disabling.
I couldn't manage to change the color with div style. So I tried it with @@background@@.
It works, but doesn't look really nice...
And also the "No Preview?" is still only shown by mouse-over the tooltip. I think, it's not possible to show "No Preview?" inside the box.
Because of that I still would like more to have a button which shows the text "No Preview?".

Is it possible?
Surya