1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-09 11:29:58 +00:00
TiddlyWiki5/editions/tw5.com/tiddlers/widgets/RangeWidget Example.tid
jeremy@jermolene.com 6e93770459 Update RangeWidget and RadioWidget examples from #5158
@pmario we avoid using the details element because it doesn't remember its state across refreshes. It's not something that we should encourage people to use if they don't understand the limitations.

I also simplified the radio widget example because putting all the options on one line with a vertical bar separator is not a common way to display radio buttons.
2021-03-07 10:23:14 +00:00

54 lines
1.7 KiB
Plaintext

created: 20201130191618831
modified: 20210307102027763
tags: RangeWidget
title: RangeWidget Example
type: text/vnd.tiddlywiki
\define getText() $(text)$ - value: $(value)$ - changed: $(actionValueHasChanged)$
\define range-log(text:"", value:"", tiddler:"$:/temp/range/log")
<$vars text="""$text$""" value="""$value$""" >
<$action-setfield $tiddler="""$tiddler$""" $index=<<now "0hh-0mm-0ss:0XXX">> $value=<<getText>>/>
</$vars>
\end
\define clear-range-log(tiddler:"$:/temp/range/log")
<$action-setfield $tiddler="""$tiddler$""" text="{}" show=show/>
\end
\define logTiddler()$:/temp/range/log
\define clearLogButton()<$button actions=<<clear-range-log>>>Clear Log</$button>
\define actionsStop()
<$macrocall $name="range-log" text=" actionsStop" value=<<actionValue>> />
\end
\define actionsStart()
<$macrocall $name="range-log" text=" actionsStart" value=<<actionValue>> />
\end
\define actions()
<$macrocall $name="range-log" text="actions" value=<<actionValue>> />
\end
!! Using Actions
<$range tiddler="$:/temp/range/1__" min="-1" max="10" default="1" increment="1"
actionsStart=<<actionsStart>> actionsStop=<<actionsStop>> actions=<<actions>>/> {{$:/temp/range/1__}}
<$range tiddler="$:/temp/range/__2" min="0" max="1" default=".01" increment=".01"
actionsStart=<<actionsStart>> actionsStop=<<actionsStop>> actions=<<actions>> /> {{$:/temp/range/__2}}
<$checkbox tiddler=<<logTiddler>> field="show" checked="show" unchecked="hide"> Show log</$checkbox> <<clearLogButton>>
<$reveal stateTitle=<<logTiddler>> stateField="show" type="match" text="show">
<$transclude tiddler=<<logTiddler>> />
</$reveal>
---
The wikitext of this example is shown below:
<$codeblock code={{RangeWidget Example!!text}}/>