mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-06-16 10:29:54 +00:00
Code Issues Releases Wiki Activity

Make filter operater examples live-editable (#6139)

Browse Source 
* Make filter operator examples easily editable

* Add 'Reset' button to filter operator examples

* Only display the reset button when filter has changed

* Introduce '.doc-example input' class rather than re-use tc-advanced-search to make input wider

* Grab focus for the filter text box

* Fix firefox ctrl-z/undo issue by replacing list widget with filter transclusion

* Replace spaced indent with tabs to make it consistent with the other code
This commit is contained in:
btheado 2021-10-25 11:35:57 -04:00 committed by GitHub
parent 3d86d62a6e
commit 989947b99a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
editions/tw5.com/tiddlers/system/doc-styles.tid
View File

@ -110,6 +110,9 @@ td svg {
padding-bottom: 0;
margin-top: 0.2em;
}
.doc-example input {
width: 60%;
}
.doc-example pre:first-child {
margin-top: 0;
}

17
editions/tw5.com/tiddlers/system/operator-macros.tid
View File

@ -5,22 +5,29 @@ tags: $:/tags/Macro
\define .operator-examples(op,text:"Examples") <$link to="$op$ Operator (Examples)">$text$</$link>
\define .operator-example-tryit-actions() <$action-setfield $tiddler=<<.state>> text="show" filter=<<__eg__>>/>
\define .operator-example(n,eg,ie)
<div class="doc-example">
`$eg$`
<$macrocall $name=".if" cond="""$ie$""" then="""<dd>&rarr; $ie$</dd>"""/>
<$list filter="[title<.state-prefix>addsuffix{!!title}addsuffix[/]addsuffix[$n$]]" variable=".state">
<$reveal state=<<.state>> type="nomatch" text="show">
`$eg$`
<$macrocall $name=".if" cond="""$ie$""" then="""<dd>&rarr; $ie$</dd>"""/>
<dl>
<dd><$button set=<<.state>> setTo="show">Try it</$button></dd>
<dd><$button actions=<<.operator-example-tryit-actions>>>Try it</$button></dd>
</dl>
</$reveal>
<$reveal state=<<.state>> type="match" text="show">
<$edit-text tiddler=<<.state>> field="filter" tag="input" type=search focus="true"/>
<dl>
<dd><$button set=<<.state>> setTo="">Hide</$button></dd>
<dd>
<$button set=<<.state>> setTo="">Hide</$button>
<$reveal stateTitle=<<.state>> stateField="filter" type="nomatch" text=<<__eg__>>>
<$button actions=<<.operator-example-tryit-actions>>>Reset</$button>
</$reveal>
</dd>
</dl>
<blockquote class="doc-example-result">
<ul><$list filter="""$eg$""" emptyMessage="(empty)">
<ul><$list filter={{{[<.state>get[filter]]}}} emptyMessage="(empty)">
<li><$link><$view field="title"/></$link></li>
</$list></ul>
</blockquote>