Keyboard driven input rework (#8678)

* Update tag-picker.tid

* rework kb-driven-input macro to procedures + new syntax

* rework change-input-tab to procedure

* fix

* remove console log :)

* replace defines with procedures

* fix link-dropdown

* fix focus-selector in new-field dropdown

* revert changing the footpring of change-input-tab + make it work as procedure

* update change-input-tab procedure

* refactor change-input-tab procedure and keep tags/Macro tag

* simplify complicated filter

* add tags/Global tag

* remove tags/Global tag

* rename variable
This commit is contained in:
Simon Huber
2024-10-24 14:34:23 +01:00
committed by GitHub
parent 9635e2d8af
commit 8b60cab6a2
10 changed files with 272 additions and 204 deletions
+21 -16
View File
@@ -1,44 +1,49 @@
title: $:/core/ui/EditorToolbar/link-dropdown
\define lingo-base() $:/language/Buttons/Link/
\procedure lingo-base() $:/language/Buttons/Link/
\define add-link-actions()
\procedure add-link-actions()
\whitespace trim
<$action-sendmessage $message="tm-edit-text-operation" $param="make-link" text={{$(linkTiddler)$}} />
<$action-sendmessage $message="tm-edit-text-operation" $param="make-link" text={{{ [<linkTiddler>get[text]] }}} />
<$action-deletetiddler $filter="[<dropdown-state>] [<searchTiddler>] [<linkTiddler>] [<storeTitle>] [<searchListState>]"/>
\end
\define get-focus-selector() [data-tiddler-title="$(cssEscapedTitle)$"] .tc-create-wikitext-link input
\procedure prefix.bracket() [
\procedure suffix.bracket() ]
\define cancel-search-actions-inner()
\function tf.get-focus-selector() [[data-tiddler-title=]addprefix[$(prefix.bracket)$]substitute[]addsuffix<cssEscapedTitle>addsuffix[$(suffix.bracket)$]substitute[]] .tc-create-wikitext-link input :and[join[ ]]
\procedure cancel-search-actions-inner()
<$set name="userInput" value={{{ [<storeTitle>get[text]] }}}><$list filter="[<searchTiddler>get[text]!match<userInput>]" emptyMessage="<$action-deletetiddler $filter='[<searchTiddler>] [<linkTiddler>] [<storeTitle>] [<searchListState>]'/>"><$action-setfield $tiddler=<<searchTiddler>> text=<<userInput>>/><$action-setfield $tiddler=<<refreshTitle>> text="yes"/></$list></$set>
\end
\define cancel-search-actions() <$list filter="[<storeTitle>!has[text]] +[<searchTiddler>!has[text]]" emptyMessage="<<cancel-search-actions-inner>>"><$action-sendmessage $message="tm-edit-text-operation" $param="focus-editor"/></$list>
\procedure cancel-search-actions() <$list filter="[<storeTitle>!has[text]] :and[<searchTiddler>!has[text]]" emptyMessage="<<cancel-search-actions-inner>>"><$action-sendmessage $message="tm-edit-text-operation" $param="focus-editor"/></$list>
\define external-link()
\procedure external-link()
\whitespace trim
<$button class="tc-btn-invisible tc-btn-mini" style="width: auto; display: inline-block; background-colour: inherit;" actions=<<add-link-actions>>>
{{$:/core/images/chevron-right}}
</$button>
\end
\define set-next-input-tab(beforeafter:"after") <$macrocall $name="change-input-tab" stateTitle="$:/state/tab/search-results/sidebar" tag="$:/tags/SearchResults" beforeafter="$beforeafter$" defaultState={{$:/config/SearchResults/Default}} actions="<$action-setfield $tiddler='$:/state/search/currentTab' text=<<nextTab>>/>"/>
\procedure set-next-input-tab() <$transclude $variable="change-input-tab-after" stateTitle="$:/state/tab/search-results/sidebar" tag="$:/tags/SearchResults" defaultState={{$:/config/SearchResults/Default}} actions="<$action-setfield $tiddler='$:/state/search/currentTab' text=<<nextTab>>/>"/>
\define body(config-title)
\procedure set-previous-input-tab() <$transclude $variable="change-input-tab-before" stateTitle="$:/state/tab/search-results/sidebar" tag="$:/tags/SearchResults" defaultState={{$:/config/SearchResults/Default}} actions="<$action-setfield $tiddler='$:/state/search/currentTab' text=<<nextTab>>/>"/>
\procedure body(config-title)
\whitespace trim
''<<lingo Hint>>''
<$vars searchTiddler="""$config-title$/search""" linkTiddler="""$config-title$/link""" linktext="" searchListState=<<qualify "$:/temp/link-search/selected-item">> refreshTitle=<<qualify "$:/temp/link-search/refresh">> storeTitle=<<qualify "$:/temp/link-search/input">>>
<$vars searchTiddler={{{ [<config-title>addsuffix[/search]] }}} linkTiddler={{{ [<config-title>addsuffix[/link]] }}} linktext="" searchListState=<<qualify "$:/temp/link-search/selected-item">> refreshTitle=<<qualify "$:/temp/link-search/refresh">> storeTitle=<<qualify "$:/temp/link-search/input">>>
<$vars linkTiddler=<<searchTiddler>>>
<$keyboard key="((input-tab-right))" actions=<<set-next-input-tab>>>
<$keyboard key="((input-tab-left))" actions=<<set-next-input-tab "before">> class="tc-create-wikitext-link">
<$macrocall $name="keyboard-driven-input" tiddler=<<searchTiddler>> storeTitle=<<storeTitle>>
<$keyboard key="((input-tab-left))" actions=<<set-previous-input-tab>> class="tc-create-wikitext-link">
<$transclude $variable="keyboard-driven-input" tiddler=<<searchTiddler>> storeTitle=<<storeTitle>>
selectionStateTitle=<<searchListState>> refreshTitle=<<refreshTitle>> type="search" filterMinLength="1"
tag="input" focus="true" class="tc-popup-handle" inputCancelActions=<<cancel-search-actions>>
inputAcceptActions=<<add-link-actions>> placeholder={{$:/language/Search/Search}} default=""
configTiddlerFilter="[[$:/state/search/currentTab]!is[missing]get[text]] ~[{$:/config/SearchResults/Default}]" />
configTiddlerFilter="[[$:/state/search/currentTab]!is[missing]get[text]] :else[{$:/config/SearchResults/Default}]" />
</$keyboard>
</$keyboard>
&#32;
@@ -46,7 +51,7 @@ title: $:/core/ui/EditorToolbar/link-dropdown
<<external-link>>
&#32;
<$button class="tc-btn-invisible tc-btn-mini" style="width: auto; display: inline-block; background-colour: inherit;">
<<cancel-search-actions>><$set name="cssEscapedTitle" value={{{ [<storyTiddler>escapecss[]] }}}><$action-sendmessage $message="tm-focus-selector" $param=<<get-focus-selector>>/></$set>
<<cancel-search-actions>><$set name="cssEscapedTitle" value={{{ [<storyTiddler>escapecss[]] }}}><$action-sendmessage $message="tm-focus-selector" $param=<<tf.get-focus-selector>>/></$set>
{{$:/core/images/close-button}}
</$button>
</$reveal>
@@ -56,7 +61,7 @@ title: $:/core/ui/EditorToolbar/link-dropdown
<$linkcatcher actions=<<add-link-actions>> to=<<linkTiddler>>>
<$vars userInput={{{ [<storeTitle>get[text]] }}} configTiddler={{{ [[$:/state/search/currentTab]!is[missing]get[text]] ~[{$:/config/SearchResults/Default}] }}}>
<$vars userInput={{{ [<storeTitle>get[text]] }}} configTiddler={{{ [[$:/state/search/currentTab]!is[missing]get[text]] :else[{$:/config/SearchResults/Default}] }}}>
{{$:/core/ui/SearchResults}}
@@ -70,4 +75,4 @@ title: $:/core/ui/EditorToolbar/link-dropdown
\end
<$macrocall $name="body" config-title=<<qualify "$:/state/Link/">>/>
<$transclude $variable="body" config-title=<<qualify "$:/state/Link/">>/>