1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-07-05 03:33:27 +00:00
TiddlyWiki5/plugins/tiddlywiki/dynannotate/examples/simple.tid
yaisog 2340d48844
Add additional searchModes to Dynannotate (#7260)
* Add searchModes: literal, some and words

* Add additional search modes

Description of selection tracker config tiddlers was also changed.

* Update simple.tid

* Improve View Template examples

Transcludes a sample tiddler for demonstration instead of the dynannotate view template code.
Adds an example for usage with $genesis to add state tiddler controlled per-tiddler highlights.

* Make search highlights not case sensitive

* Remove created and modified fields

* Add another example text (Searching in Tiddlywiki)

* Add dynannotate for vercel deployment

This should probably not be merged...

* Create LegacySelectionTracker.tid

* Create SelectionTracker.tid

* Revert putting the SelectionTracker config titles in code blocks

* Replace inline styles with CSS class

* Add class for view template examples

Class name is tc-dynannotate-example-frame.

* Remove some <br> line breaks.

* Remove first example transclusion and fix some tab spacing

* Add class to override control panel table layout

* Add class to settings table

* More tab shenanigans

Great Scott!

* Add explanatory comment to example macro

* Change defaults to match widget behavior

* Make previous macro comment more concise

* Change example to transclude CP tiddler

$:/core/ui/ControlPanel/TiddlerFields

* Delete unnecessary example tiddler
2023-05-06 11:30:21 +01:00

97 lines
4.3 KiB
Plaintext

title: $:/plugins/tiddlywiki/dynannotate/examples/simple
tags: $:/tags/dynannotateExamples
caption: Simple
\define show-example(example)
<$codeblock code=<<__example__>>/>
//''Displays as:''//
$example$
\end
\define search-example-code()
<!--
The inline filters update the displayed codeblock to reflect the choices the user has made in the UI.
The rules pragma is used here to evaluate only these filters, but leave everything else untouched.
The tabs and linebreaks within the parameters to addprefix, though maybe confusing, help with the readability of the codeblock output.
-->
\rules only filteredtranscludeinline
<$dynannotate
search="{{{ [{$:/temp/dynannotate-example/search}!is[blank]else[The human mind]] }}}"{{{ [{$:/temp/dynannotate-example/searchMode}!search::some[literal normal]addprefix[
searchMode="]addsuffix["]] }}}
searchCaseSensitive="{{{ [{$:/temp/dynannotate-example/searchCaseSensitive}!is[blank]else[yes]] }}}"{{{ [{$:/temp/dynannotate-example/searchClass}!is[blank]addprefix[
searchClass="]addsuffix["]] }}}
>
<$transclude tiddler="$:/plugins/tiddlywiki/dynannotate/example-text-1" mode="block"/>
<$transclude tiddler="$:/plugins/tiddlywiki/dynannotate/example-text-2" mode="block"/>
</$dynannotate>
\end
<div class="tc-dynannotation-example-info">
!! Annotations with `target`
We use the `target*` attributes to specify a target string for the annotation and optionally a prefix and suffix for disambiguating multiple occurences.
</div>
<<show-example """<$dynannotate
target="the"
targetPrefix="Yet "
targetSuffix=" speed"
>
<$transclude tiddler="$:/plugins/tiddlywiki/dynannotate/example-text-1" mode="block"/>
</$dynannotate>
""">>
<div class="tc-dynannotation-example-info">
!! Highlights with `search`
We use the `search` attribute to specify a search string for highlighting.
The search type can be set with the `searchMode` and `searchCaseSensitive` attributes.
We can style the highlights with the `searchClass` attribute, which has some predefined values.
</div>
|tc-table-no-border tc-dynannotate-search-parameters|k
|search term |<$edit-text tiddler="$:/temp/dynannotate-example/search" field="text" tag="input" default="The human mind" />|
|search mode |<$select tiddler="$:/temp/dynannotate-example/searchMode" field="text" default="literal"><option value="literal">literal</option><option value="normal">normal</option><option value="regexp">regexp</option><option value="whitespace">whitespace</option><option value="some">some</option><option value="words">words</option></$select> |
|case sensitive |<$checkbox tiddler="$:/temp/dynannotate-example/searchCaseSensitive" field="text" checked="yes" unchecked="no" default="yes"> <$text text={{{ [{$:/temp/dynannotate-example/searchCaseSensitive}!is[blank]else[yes]] }}} /></$checkbox> |
|search class |<$select tiddler="$:/temp/dynannotate-example/searchClass" field="text" default=""><option value="">(none)</option><option value="tc-dynannotation-search-overlay-animated">tc-dynannotation-search-overlay-animated</option><option value="tc-dynannotation-search-overlay-blurred">tc-dynannotation-search-overlay-blurred</option></$select> |
<$dynannotate
search={{{ [{$:/temp/dynannotate-example/search}!is[blank]else[The human mind]] }}}
searchMode={{{ [{$:/temp/dynannotate-example/searchMode}] }}}
searchCaseSensitive={{{ [{$:/temp/dynannotate-example/searchCaseSensitive}!is[blank]else[yes]] }}}
searchClass={{{ [{$:/temp/dynannotate-example/searchClass}] }}}
>
<$transclude tiddler="$:/plugins/tiddlywiki/dynannotate/example-text-1" mode="block"/>
<$transclude tiddler="$:/plugins/tiddlywiki/dynannotate/example-text-2" mode="block"/>
</$dynannotate>
<$wikify name="wikifiedCode" text=<<search-example-code>> mode="block" output="text">
<$codeblock code=<<wikifiedCode>>/>
</$wikify>
<div class="tc-dynannotation-example-info">
!! Using annotation tiddlers
Annotation tiddlers can be used to describe annotations. This example references the following annotation tiddlers:
</div>
<<list-links "[all[shadows+tiddlers]annotate-tiddler[$:/plugins/tiddlywiki/dynannotate/example-text-1]]">>
<<show-example """<$dynannotate
filter="[all[shadows+tiddlers]annotate-tiddler[$:/plugins/tiddlywiki/dynannotate/example-text-1]]"
>
<$transclude tiddler="$:/plugins/tiddlywiki/dynannotate/example-text-1" mode="block"/>
</$dynannotate>
""">>