Button Factory how to?

[TonyM]

Folks,

I have long sort the ability or build tiddlywiki solutions that build tiddlywiki solutions.

Background:

One case in point is building buttons for different purposes.

If you look inside the various core buttons "[prefix[$:/core/ui/Buttons/edit]]"

You can see the following elements

• Button icons
• Caption/description field
• Multiple references to the current Button tiddler eg aria-lable and other transclusions
• References to relevant actions
• Text notes for different views of the button including under more/text mode

I would like to create a tool for creating buttons where I provide the template and required information and I create and update the new tiddler with the various information

Problem:

It is not clear to me how to generate such tiddlers with replaceable values that will be coded as literal or transclusion references from the set of custom values.

Does anyone know of a strategy that would not result in some fairly complex code? I think for example generate the text to copy to clipboard or some other approach?

Regards

Tony

[Mat]

See if this is what you're after: http://buttonfactory.tiddlyspot.com/

I would guess it is the use of "$set ... select=0" that is the secret.

<:-)

[Mohammad]

Mat,

 What you think if we add a little OOP.

See  [[buttons by inheritance]]

--Mohammad

[Mat]

Mohammad wrote:

Mat,

 What you think if we add a little OOP.

I think that would be for Tony to use ;-)

<:-) 

[TonyM]

Thanks Mat,

The example given is way to simple for the number of factors I want to customise. However I can see how I could make a skeleton button that seeks all the other values in some other definition and you just call the skeleton with the definition as a parameter. In effect iterate the same button over and over.

You could think of a template button for say toggling, then you provide it with a parameter and it gets its own settings at run time, the template is a living template.

Regards

Tony

[TonyM]

Mohammad,

I think I get where you are coming from with OOP, But am I wrong thinking we already use TOPD Tiddler Oriented Programing and Data :)

Typically we overlay a tiddler with a viewTemplate, that accesses the current tiddlers values with the template as the code.

Perhaps, away from view templates, eg a button in a view template, We can extend this concept to have a button that we overlay with a configuration tiddler, that defines an instance of that button.

An example would be a button I have just developed, it simply allows the toggling of a field on or off any given tiddler. However I could generalise this to a field toggle button, then apply a configuration tiddler to it to provide the specific instance give a particular fieldname, tooltip, on and Off Buttons, captions and hints. So the button code is the object and it contains its method (wikiText and macros), but an instance is generated by providing the button a configuration tiddler, which can be cloned and define many different buttons all using the same underlying button code.

Wait, I can redefine the way buttons work, all that is necessary is they work when transcluded, however they need to use a standard or they will not be available for inclusion in the control panel etc...

Regrads

Tony

[Mat]

TonyM wrote:

An example would be a button I have just developed, it simply allows the toggling of a [...]

I think it is better to use checkboxes when possible e.g for simple toggling. I assume they tax the system less. Note that they can be styled to appear any way you want.

<:-)

 

[TonyM]

Mat,

I agree in some applications, however have you ever placed a checkbox in the toolbars for View, Edit, Editor or Page controls?

A nicely illustrated button can be much easier to use.

Regards

Tony

[Mat]

TonyM wrote:

have you ever placed a checkbox in the toolbars for View, Edit, Editor or Page controls?

A nicely illustrated button can be much easier to use.

First, I realized my comment that it taxes the system less is probably ridiculous. A better point is about making things work without js for static wikis. 

However, regarding your point about making it appear nice, this is not a problem with a checkbox. Checkboxes can be styled and their labels can show anything (and anywhere). You just hide the actual checkbox. E.g:

<input type="checkbox" id="myCheckbox" style="display:none"/>

<label for="myCheckbox">{{$:/core/images/done-button}}</label>

<:-)

[TonyM]

Mat

This is in html can it work with the checkbox wolidget? Are you proposing something new?

thanks
Tony

[Ton Gerner]

Hi Tony,

I was thinking of macros for making buttons.
In case of a button that calls a tiddler (in many use cases, and in the core the buttons for control panel, tiddler manager and tag manager) it can be done.

As proof of concept I made the following macro:

\define buttonto(tiddler,image,description,caption,tag)
<$button to="$tiddler$" tooltip="$tooltip$" class=<<tv-config-toolbar-class>>>
<$action-setfield $field="caption" $value="{{$image$}} $caption$"/>
<$action-setfield $field="description" $value="$description$"/>
<$action-setfield $field="tags" $value="$tag$"/>
<$list filter="[<tv-config-toolbar-icons>match[yes]]">
{{$image$}}
</$list>
<$list filter="[<tv-config-toolbar-text>match[yes]]">
<$text text="$caption$"/>
</$list>
</$button>
\end

To 'recreate' the Control panel button, create a tiddler containing:

<<buttonto $:/ControlPanel $:/core/images/options-button "Open control panel" "control panel" "$:/tags/ViewToolbar">>

When clicking the button (cogwheel in this created tiddler)

1. the tiddler will be tagged with $:/tags/ViewToolbar
2. the caption and description fields will be created
3. a control panel button will be added to the tiddler controls
4. in Control panel > Appearance > Toolbars > View toolbar an extra control panel button with checkbox will be added

With given macro tiddler manager and tag manager can be `recreated` as well.
Many user buttons that call a tiddler with certain functionality in it can be created with this macro.

Notes for this proof of concept

1. You need to click the button in the button tiddler once to add tag, caption and description field; thereafter th real button will be available
2. After that the 3 action-setfield widgets will be activated with each button click while there is no need for it anymore

So it needs some polishing but in principle it works.

Cheers,

Ton

[TonyM]

Ton,

Great proof of concept. I can work with this. I can put in a test to see if buttonto's tiddler already has the $:/tags/ViewToolbar tag and hide the additional set up actions.

I can see how to build on this. Not sure why I did not envision this approach.

I like how the tiddler to create the button also becomes the button. 

I want this to allow actions such create field or have two buttons in a toggle, and additional actions etc.. so as you say further thought is necessary.

Thank you

Tony

[TonyM]

Ton,

A Quick post script, something very odd occurs on using this button on tiddlywiki.com

User beware - this is a proof of concept only

Tony

On Friday, January 31, 2020 at 5:27:12 AM UTC+11, Ton Gerner wrote:

[Ton Gerner]

Hi Tony,

A Quick post script, something very odd occurs on using this button on tiddlywiki.com

User beware - this is a proof of concept only

Can you describe what occurs?

I just tested it at tiddlywiki.com and all seems normal.

Anyway, if you set in Control panel > Settings > Tiddler Info Panel Mode to 'Tiddler info panel stays open until explicitly closed', you can open the info panel of the button tiddler.

At the first click at the button, made with the macro, you can see the fields and tag appear.

Cheers,

Ton

[TonyM]

Ton.

I was extending your method, and am using your basic model, however I have moved to the template based button, one selects from a set of functionally different buttons, then customises it to a specific need. The reason is I want the resulting buttons to be stand alone, perhaps with the exception of any Icons they need.

Eg Buttons to 

• Toggle Tag
• Toggle anything
• Navigate to tiddler name
• Click to action

I am now thinking of

• Config tiddler toggling
• Traffic Lights
• Multi-state cycle eg step through 5 tag values

Perhaps first I will invite  challenge here, What button would someone like and see if I can make it from my factory. If it works I may start a dedicated thread.

Thanks for your inspiration?

What do you think?

Tony

[Ton Gerner]

Hi Tony,

> A Quick post script, something very odd occurs on using this button on tiddlywiki.com

Did you mean my 'original' button?

I was extending your method, and am using your basic model, however I have moved to the template based button, one selects from a set of functionally different buttons, then customises it to a specific need.

or with your own experiments?  If yes, what 'odd behaviour' did you see?

• Toggle Tag
• Toggle anything
• Navigate to tiddler name
• Click to action

I am now thinking of

• Config tiddler toggling
• Traffic Lights
• Multi-state cycle eg step through 5 tag values

Perhaps first I will invite  challenge here, What button would someone like and see if I can make it from my factory. If it works I may start a dedicated thread.

If I look at the buttons I made myself - mainly for the top toolbar - then are 2 main categories:

1. Buttons that open a tiddler with a certain functionality. I call it 'button to' buttons
2. Buttons that toggle a certain setting or tag

May be start a query about type of buttons needed.

Thanks for your inspiration.

 You're welcome.

Cheers,

Ton

[TonyM]

Ton,

Thanks for your feedback. I suspect I broke something not your example was broken, I can't reproduce it now.

This may be a "flight of fancy" but I have started to realise anything can be designed from its interface. 

Many of my home grown solutions involve a button, but now I see If a Build a button in which to design a solution its quicker and simpler, especially If I have templates.

Its another level of abstraction 

Can the whole of tiddlywiki's possiblities start with a button?

1. Buttons that open a tiddler with a certain functionality. I call it 'button to' buttons

1. Buttons that toggle a certain setting or tag on a tiddler
2. Buttons that toggle a certain setting or tag GLOBALY
3. Buttons that toggle a macro or plugins operation
4. Buttons that Trigger a macro or plugins operation
5. Buttons that trigger anything
6. Buttons that trigger a modified version of a core button or function
7. Buttons that contain a set of buttons (like the more buttons)
8. Buttons that operate on text (editor toolbar buttons)
9. Buttons that open links, tabs, windows, iframes, dialogues, modals, notify
10. Buttons that log something in another tiddler
11. Buttons that create a tiddler from a template

Thanks Muse

tony

. 

[Ton Gerner]

Hi Tony,

On Saturday, February 1, 2020 at 6:53:23 AM UTC+1, TonyM wrote:

Ton,

Thanks for your feedback. I suspect I broke something not your example was broken, I can't reproduce it now.

This may be a "flight of fancy" but I have started to realise anything can be designed from its interface. 

Many of my home grown solutions involve a button, but now I see If a Build a button in which to design a solution its quicker and simpler, especially If I have templates.

Its another level of abstraction 

Can the whole of tiddlywiki's possiblities start with a button?

Yeah, lots of things in TiddlyWiki are triggered by button widgets as we can see here.

1. Buttons that open a tiddler with a certain functionality. I call it 'button to' buttons
2. Buttons that toggle a certain setting or tag on a tiddler
3. Buttons that toggle a certain setting or tag GLOBALY
4. Buttons that toggle a macro or plugins operation
5. Buttons that Trigger a macro or plugins operation
6. Buttons that trigger anything
7. Buttons that trigger a modified version of a core button or function
8. Buttons that contain a set of buttons (like the more buttons)
9. Buttons that operate on text (editor toolbar buttons)
10. Buttons that open links, tabs, windows, iframes, dialogues, modals, notify
11. Buttons that log something in another tiddler
12. Buttons that create a tiddler from a template

That is a lot of buttons; you need to know what can be combined in making them.

When I have more time I 'll have a better look at all the core buttons.

I upgraded my macro to:

\define buttonto(tiddler,image,description,caption,tag)
<$button to="$tiddler$" tooltip="$description$" class=<<tv-config-toolbar-class>>>
<$list filter="[all[current]!has[caption]]">

<$action-setfield $field="caption" $value="{{$image$}} $caption$"/>
<$action-setfield $field="description" $value="$description$"/>
<$action-setfield $field="tags" $value="$tag$"/>

</$list>

<$list filter="[<tv-config-toolbar-icons>match[yes]]">
{{$image$}}
</

$list>

<$list filter="[<tv-config-toolbar-text>match[yes]]">
<$text text="$caption$"/>
</$list>
</$button>
\end

So after the first click (when a tag and fields are created) the action widgets will not be active anymore.
And I corrected the tooltip which uses the text in the description field (the naming in buttons is rather confusing with caption, description, tooltip, hint, text).

Cheers,

Ton

[Ton Gerner]

Hi,

Updated macro with triple quotes (thanks Mat):

\define buttonto(tiddler,image,description,caption,tag)
<$button to="$tiddler$" tooltip="$description$" class=<<tv-config-toolbar-class>>>
<$list filter="[all[current]!has[caption]]">
<$action-setfield $field="caption" $value="""{{$image$}} $caption$"""/>
<$action-setfield $field="description" $value="""$description$"""/>
<$action-setfield $field="tags" $value="""$tag$"""/>
</$list>
<$list filter="[<tv-config-toolbar-icons>match[yes]]">
{{$image$}}
</$list>
<$list filter="[<tv-config-toolbar-text>match[yes]]">
<$text text="$caption$"/>
</$list>
</$button>
\end

Usage:

<<buttonto
tiddler
image
description
caption
tag
>>

Cheers,

Ton