diff --git a/editions/tw5.com/tiddlers/testcases/RevealWidget/AccordionSlider.tid b/editions/tw5.com/tiddlers/testcases/RevealWidget/AccordionSlider.tid new file mode 100644 index 000000000..27361b335 --- /dev/null +++ b/editions/tw5.com/tiddlers/testcases/RevealWidget/AccordionSlider.tid @@ -0,0 +1,30 @@ +created: 20240721163229297 +description: Reveal widget for accordion or slider functionality +modified: 20240721172211283 +tags: $:/tags/wiki-test-spec +title: TestCases/RevealWidget/AccordionSlider +type: text/vnd.tiddlywiki-multiple + +title: Narrative + +Two distinct buttons toggle the state of the tiddler value. Two reveal widgets. The first displays the button to show the content. The second displays both the content and the button to hide the content. ++ +title: Output + +<$reveal type="nomatch" state="$:/state/SampleReveal2" text="show"> + +<$button set="$:/state/SampleReveal2" setTo="show">Show me + + +<$reveal type="match" state="$:/state/SampleReveal2" text="show"> + +<$button set="$:/state/SampleReveal2" setTo="hide">Hide me + +! This is the revealed content +And this is some text + + ++ +title: ExpectedResult + +

\ No newline at end of file diff --git a/editions/tw5.com/tiddlers/testcases/RevealWidget/Popup.tid b/editions/tw5.com/tiddlers/testcases/RevealWidget/Popup.tid new file mode 100644 index 000000000..3defafd48 --- /dev/null +++ b/editions/tw5.com/tiddlers/testcases/RevealWidget/Popup.tid @@ -0,0 +1,27 @@ +created: 20240721163229297 +description: Reveal widget for popup content +modified: 20240721172211283 +tags: $:/tags/wiki-test-spec +title: TestCases/RevealWidget/Popup +type: text/vnd.tiddlywiki-multiple + +title: Narrative + +When the button is clicked, the tiddler specified by the popup attribute is filled with the click coordinates. The reveal widget uses these coordinates to position the popup content. ++ +title: Output + +<$button popup="$:/SamplePopupState">Pop me up! + +<$reveal type="popup" state="$:/SamplePopupState"> +
+ +! This is the popup +And this is some text + +
+ ++ +title: ExpectedResult + +

\ No newline at end of file diff --git a/editions/tw5.com/tiddlers/testcases/RevealWidget/SimpleReveal.tid b/editions/tw5.com/tiddlers/testcases/RevealWidget/SimpleReveal.tid new file mode 100644 index 000000000..b73eaa83f --- /dev/null +++ b/editions/tw5.com/tiddlers/testcases/RevealWidget/SimpleReveal.tid @@ -0,0 +1,27 @@ +created: 20240721163229297 +description: Simple content reveal +modified: 20240721172211283 +tags: $:/tags/wiki-test-spec +title: TestCases/RevealWidget/SimpleReveal +type: text/vnd.tiddlywiki-multiple + +title: Narrative + +Two distinct buttons toggle the state of the tiddler value. The reveal widget displays its content for one of the two states. ++ +title: Output + +<$button set="$:/state/SampleReveal1" setTo="show">Show me +<$button set="$:/state/SampleReveal1" setTo="hide">Hide me + +<$reveal type="match" state="$:/state/SampleReveal1" text="show"> + +! This is the revealed content +And this is some text + + ++ +title: ExpectedResult + +

+

\ No newline at end of file diff --git a/editions/tw5.com/tiddlers/testcases/RevealWidget/TextReference.tid b/editions/tw5.com/tiddlers/testcases/RevealWidget/TextReference.tid new file mode 100644 index 000000000..e21230033 --- /dev/null +++ b/editions/tw5.com/tiddlers/testcases/RevealWidget/TextReference.tid @@ -0,0 +1,23 @@ +created: 20240721163229297 +description: Reveal widget text references +modified: 20240721174826529 +tags: $:/tags/wiki-test-spec +title: TestCases/RevealWidget/TextReference +type: text/vnd.tiddlywiki-multiple + +title: Narrative + +The state attribute of the reveal widget can use the text reference syntax to refer to a specific field. In this example if the field ``jeremy`` contains the text ``tiddlywiki``, then the reveal widget's content will be displayed. ++ +title: Output +jeremy: tiddlywiki + +<$reveal type="match" state="!!jeremy" text="tiddlywiki"> +~TiddlyWiki! + ++ +title: ExpectedResult + +

+TiddlyWiki! +

\ No newline at end of file diff --git a/editions/tw5.com/tiddlers/widgets/RevealWidget.tid b/editions/tw5.com/tiddlers/widgets/RevealWidget.tid index de445e08d..37df94c1e 100644 --- a/editions/tw5.com/tiddlers/widgets/RevealWidget.tid +++ b/editions/tw5.com/tiddlers/widgets/RevealWidget.tid @@ -1,7 +1,7 @@ caption: reveal created: 20131024141900000 jeremy: tiddlywiki -modified: 20230803052644851 +modified: 20240721175716320 tags: Widgets title: RevealWidget type: text/vnd.tiddlywiki @@ -47,57 +47,10 @@ This is useful for edge-cases where titles may contain characters that are used ! Examples -!! Simple content reveal +<> -Here's a simple example of showing and hiding content with buttons: +<> -<Show me -<$button set="$:/state/SampleReveal1" setTo="hide">Hide me +<> -<$reveal type="match" state="$:/state/SampleReveal1" text="show"> - -! This is the revealed content -And this is some text - -'>> - -!! Accordion or Slider - -An "accordion" or "slider" is a button that can be used to toggle the display of associated content. - -< - -<$button set="$:/state/SampleReveal2" setTo="show">Show me - - -<$reveal type="match" state="$:/state/SampleReveal2" text="show"> - -<$button set="$:/state/SampleReveal2" setTo="hide">Hide me - -! This is the revealed content -And this is some text - -'>> - -!! Popup - -Here is a simple example of a popup built with the RevealWidget: - -<Pop me up! - -<$reveal type="popup" state="$:/SamplePopupState"> -
- -! This is the popup -And this is some text - -
-'>> - -!! How to use text references with field content - -Here is a simple example how to use text references with field content to control the RevealWidget. If the field ``jeremy`` is populated with text ``tiddlywiki``, a message will be displayed. - -< -~TiddlyWiki! -'>> +<> \ No newline at end of file