1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-11-15 22:34:51 +00:00

Introduce step about tags

This commit is contained in:
Jeremy Ruston 2023-10-12 18:10:12 +01:00
parent 906cb8f92b
commit 9b6570f420
9 changed files with 152 additions and 1 deletions

View File

@ -0,0 +1,106 @@
title: $:/plugins/tiddlywiki/tour/simplified-tiddler-with-tags
\whitespace trim
\define tag-pill-styles()
background-color:$(backgroundColor)$;
fill:$(foregroundColor)$;
color:$(foregroundColor)$;
\end
\procedure tag-pill-label(prefix)
<$text text={{{ [<currentTiddler>removeprefix<prefix>] }}}/>
\end
\procedure tag-pill-label-link(prefix)
<div>
<$link>
<$transclude $variable="tag-pill-label" prefix=<<prefix>>/>
</$link>
</div>
\end
<!-- This has no whitespace trim to avoid modifying $actions$. Closing tags omitted for brevity. -->
\define tag-pill-inner(tag,icon,colour,fallbackTarget,colourA,colourB,element-tag,element-attributes,actions,prefix)
\whitespace trim
<$let
foregroundColor=<<contrastcolour target:"""$colour$""" fallbackTarget:"""$fallbackTarget$""" colourA:"""$colourA$""" colourB:"""$colourB$""">>
backgroundColor=<<__colour__>>
>
<$element-tag$
$element-attributes$
class="tc-tag-label tc-btn-invisible"
style=<<tag-pill-styles>>
>
<<__actions__>>
<$transclude tiddler=<<__icon__>>/>
<$let currentTiddler=<<__tag__>>>
<$transclude $variable="tag-pill-label" prefix=<<__prefix__>>/>
</$let>
</$element-tag$>
</$let>
\end
\define tag-pill-body(tag,icon,colour,palette,element-tag,element-attributes,actions,prefix)
<$transclude $variable="tag-pill-inner"
tag=<<__tag__>>
icon=<<__icon__>>
colour=<<__colour__>>
fallbackTarget={{$palette$##tag-background}}
colourA={{$palette$##foreground}}
colourB={{$palette$##background}}
element-tag=<<__element-tag__>>
element-attributes=<<__element-attributes__>>
actions=<<__actions__>>
prefix=<<__prefix__>>
/>
\end
\procedure simplified-tag(prefix)
<span class="tc-tag-list-item" data-tag-title=<<currentTiddler>>>
<$set name="transclusion" value=<<currentTiddler>>>
<$transclude $variable="tag-pill-body"
tag=<<currentTiddler>>
icon={{{ [<currentTiddler>] :cascade[all[shadows+tiddlers]tag[$:/tags/TiddlerIconFilter]!is[draft]get[text]] }}}
colour={{{ [<currentTiddler>] :cascade[all[shadows+tiddlers]tag[$:/tags/TiddlerColourFilter]!is[draft]get[text]] }}}
palette={{$:/palette}}
element-tag="$button"
element-attributes="""popup=<<qualify "$:/state/popup/tag">> dragFilter="[all[current]tagging[]]" tag='span'"""
prefix=<<prefix>>
/>
<$reveal state=<<qualify "$:/state/popup/tag">> type="popup" position="below" animate="yes" class="tc-drop-down">
<$set name="tv-show-missing-links" value="yes">
<$transclude $variable="tag-pill-label-link" prefix=<<prefix>>/>
</$set>
<hr>
<$list filter="[all[shadows+tiddlers]tag<currentTiddler>]">
<$transclude $variable="tag-pill-label-link" prefix=<<prefix>>/>
</$list>
</$reveal>
</$set>
</span>
\end
<$let storyTiddler=<<currentTiddler>>>
<div class="tc-tiddler-frame tc-tiddler-view-frame tc-tiddler-exists tc-tiddler-shadow " role="article">
<div class="tc-tiddler-title">
<div class="tc-titlebar">
<span class="tc-tiddler-controls">
<$list filter="[<tour-simplified-tiddler-close-button>match[yes]]" variable="ignore">
{{||$:/core/ui/Buttons/close}}
</$list>
</span>
<span>
<h2 class="tc-title"><$view field="caption"/></h2>
</span>
</div>
</div>
<div class="tc-tags-wrapper">
<$list filter="[all[current]tags[]sort[title]]" storyview="pop">
<<simplified-tag "$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/">>
</$list>
</div>
<div class="tc-tiddler-body">
<$transclude field="text" mode="block"/>
</div>
</div>
</$let>

View File

@ -0,0 +1,4 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Gas Giant
caption: Gas Giant
A gas giant is a large planet that has a solid core, but a very thick atmosphere. This means that most of the planet is made up of gas. These planets are very large.

View File

@ -1,4 +1,5 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Jupiter
caption: Jupiter
tags: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Planet [[$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Gas Giant]]
Jupiter is the largest planet in the Solar System. It is the fifth planet from the Sun. Jupiter is a gas giant because it is so large and made of gas. The other gas giants in the Solar System are [[Saturn|$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Saturn]], Uranus, and Neptune.

View File

@ -0,0 +1,5 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Mars
caption: Mars
tags: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Planet [[$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Rocky]]
Mars is the fourth planet from the Sun in the Solar System and the second-smallest planet. Mars is a terrestrial planet with polar ice caps of frozen water and carbon dioxide. It has the largest volcano in the Solar System, and some very large impact craters. Mars is named after the mythological Roman god of war because it appears of red color.

View File

@ -0,0 +1,4 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Planet
caption: Planet
A planet is a large object such as Venus or Earth that orbits a star. Planets are smaller than stars, and they do not make light. Jupiter is the biggest planet in the Solar System, while the smallest planet in the Solar System is Mercury.

View File

@ -0,0 +1,4 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Rocky
caption: Rocky
Rocky planets have a core, a mantle, and a crust. They are a bit like a boiled egg: the central yolk is the core; the white albumin is the mantle; and the shell is the crust. The crust of a terrestrial planet is thin, with the core and the mantle taking up the vast bulk, sometimes with a very large core, sometimes much smaller. Terrestrial planets have metallic cores of mostly iron, with rocky mantles and crusts.

View File

@ -1,4 +1,5 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Saturn
caption: Saturn
tags: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Planet [[$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Gas Giant]]
Saturn is the sixth planet from the Sun located in the Solar System. It is the second largest planet in the Solar System, after Jupiter. Saturn is one of the four gas giant planets in the Solar System, along with [[Jupiter|$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Jupiter]], Uranus, and Neptune.

View File

@ -0,0 +1,26 @@
title: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/tags
caption: Tagging tiddlers
tags: $:/tags/Tour/IntroductionToTiddlyWiki
display-mode: fullscreen
enter-actions: <$action-setfield $tiddler="$:/temp/Tour/DemoStoryList" list="$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Mars"/>
condition: [[$:/temp/Tour/DemoStoryList]contains[$:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/tiddlers/Saturn]]
Tiddlers may be categorised with one or more descriptive keywords or phrases called "tags". Tags can be used to search and navigate between tiddlers.
Click on a tag to display a menu with:
* A link to the tiddler with the same title as the tag
* A list of links to the other tiddlers with the same tag
Use the tag dropdown to open the tiddler Saturn.
<$navigator story="$:/temp/Tour/DemoStoryList" history="$:/temp/Tour/DemoHistoryList" openLinkFromInsideRiver="below">
<$list
filter="[list[$:/temp/Tour/DemoStoryList]]"
history="$:/temp/Tour/DemoHistoryList"
template="$:/plugins/tiddlywiki/tour/simplified-tiddler-with-tags"
storyview="classic"
/>
</$navigator>

View File

@ -1,2 +1,2 @@
title: $:/tags/Tour/IntroductionToTiddlyWiki
list: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/welcome $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/tiddlers $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/links $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/closing-tiddlers $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/end-of-fullscreen $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/open-control-panel $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/close-control-panel $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/search $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/recent $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/create-tiddler $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/finished
list: $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/welcome $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/tiddlers $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/links $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/tags $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/closing-tiddlers $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/end-of-fullscreen $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/open-control-panel $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/close-control-panel $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/search $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/recent $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/create-tiddler $:/plugins/tiddlywiki/tour/introduction-to-tiddlywiki/steps/finished