mirror of
https://github.com/Jermolene/TiddlyWiki5
synced 2024-12-24 00:50:28 +00:00
Make AdvancedSearch/Filter navigatable by keyboard (#4932)
* Make AdvancedSearch/Filter keyboard-driven * Adapt keyboard-driven-input macro for use with... ... AdvancedSearch/Filter Tab * Adjust Filter dropdown for kb-driven AdvancedSearch/Filter * Adjust Clear Button for kb-driven AdvancedSearch/Filter * Adjust Delete Button for kb-driven AdvancedSearch/Filter * Adjust Export Button for kb-driven AdvancedSearch/Filter * Update clear.tid * Avoid editing the wron tiddler * Make cancel-search-actions a bit more sophisticated * Update Filter.tid * Update Filter.tid * Update Filter.tid * Update keyboard-driven-input.tid * Update dropdown.tid * Update dropdown.tid * Update Filter.tid * Update clear.tid * Update delete.tid * Update dropdown.tid * Update export.tid * Update clear.tid * Update Shadows.tid * Update Standard.tid * Update Shadows.tid * Update System.tid * Update Filter.tid * Update keyboard-driven-input.tid
This commit is contained in:
parent
e7245a709c
commit
26ade60e93
@ -4,13 +4,23 @@ caption: {{$:/language/Search/Filter/Caption}}
|
||||
|
||||
\define lingo-base() $:/language/Search/
|
||||
\define set-next-input-tab(beforeafter:"after") <$macrocall $name="change-input-tab" stateTitle="$:/state/tab/advanced-search-results" tag="$:/tags/AdvancedSearch" beforeafter="$beforeafter$" defaultState="$:/core/ui/AdvancedSearch/System" actions="""<$action-setfield $tiddler="$:/state/advancedsearch/currentTab" text=<<nextTab>>/>"""/>
|
||||
<$linkcatcher to="$:/temp/advancedsearch">
|
||||
|
||||
\define cancel-search-actions() <$set name="userInput" value={{{ [<__storeTitle__>get[text]] }}}><$list filter="[<__tiddler__>get[text]match<userInput>]" emptyMessage="""<$action-setfield $tiddler=<<__tiddler__>> text=<<userInput>>/><$action-setfield $tiddler=<<__refreshTitle__>> text="yes"/>"""><$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" /></$list></$set>
|
||||
|
||||
\define input-accept-actions() <$action-navigate $to={{{ [<__tiddler__>get[text]] }}}/>
|
||||
|
||||
\define input-accept-variant-actions() <$list filter="[<__tiddler__>get[text]minlength[1]]"><$action-sendmessage $message="tm-edit-tiddler" $param={{{ [<__tiddler__>get[text]] }}}/></$list>
|
||||
|
||||
<<lingo Filter/Hint>>
|
||||
|
||||
<div class="tc-search tc-advanced-search">
|
||||
<$keyboard key="((input-tab-right))" actions=<<set-next-input-tab>>>
|
||||
<$keyboard key="((input-tab-left))" actions=<<set-next-input-tab "before">>>
|
||||
<$edit-text tiddler="$:/temp/advancedsearch" type="search" tag="input" focus={{$:/config/Search/AutoFocus}}/>
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch/input" storeTitle="$:/temp/advancedsearch"
|
||||
refreshTitle="$:/temp/advancedsearch/refresh" selectionStateTitle="$:/temp/advancedsearch/selected-item" type="search"
|
||||
tag="input" focus={{$:/config/Search/AutoFocus}} configTiddlerFilter="[[$:/temp/advancedsearch]]" firstSearchFilterField="text"
|
||||
inputAcceptActions=<<input-accept-actions>> inputAcceptVariantActions=<<input-accept-variant-actions>>
|
||||
inputCancelActions=<<cancel-search-actions>>/>
|
||||
</$keyboard>
|
||||
</$keyboard>
|
||||
<$list filter="[all[shadows+tiddlers]tag[$:/tags/AdvancedSearch/FilterButton]!has[draft.of]]"><$transclude/></$list>
|
||||
@ -20,7 +30,11 @@ caption: {{$:/language/Search/Filter/Caption}}
|
||||
<$set name="resultCount" value="""<$count filter={{$:/temp/advancedsearch}}/>""">
|
||||
<div class="tc-search-results">
|
||||
<<lingo Filter/Matches>>
|
||||
<$list filter={{$:/temp/advancedsearch}} template="$:/core/ui/ListItemTemplate"/>
|
||||
<$list filter={{$:/temp/advancedsearch}}>
|
||||
<span class={{{[<currentTiddler>addsuffix[-primaryList]] -[[$:/temp/advancedsearch/selected-item]get[text]] +[then[]else[tc-list-item-selected]] }}}>
|
||||
<$transclude tiddler="$:/core/ui/ListItemTemplate"/>
|
||||
</span>
|
||||
</$list>
|
||||
</div>
|
||||
</$set>
|
||||
</$reveal>
|
||||
|
@ -3,7 +3,8 @@ tags: $:/tags/AdvancedSearch/FilterButton
|
||||
|
||||
<$reveal state="$:/temp/advancedsearch" type="nomatch" text="">
|
||||
<$button class="tc-btn-invisible">
|
||||
<$action-setfield $tiddler="$:/temp/advancedsearch" $field="text" $value=""/>
|
||||
<$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" />
|
||||
<$action-sendmessage $message="tm-focus-selector" $param=""".tc-advanced-search input""" />
|
||||
{{$:/core/images/close-button}}
|
||||
</$button>
|
||||
</$reveal>
|
||||
|
@ -9,7 +9,7 @@ tags: $:/tags/AdvancedSearch/FilterButton
|
||||
|
||||
<$reveal state=<<qualify "$:/state/filterDropdown">> type="popup" position="belowleft" animate="yes">
|
||||
<$set name="tv-show-missing-links" value="yes">
|
||||
<$linkcatcher to="$:/temp/advancedsearch">
|
||||
<$linkcatcher actions="""<$action-setfield $tiddler="$:/temp/advancedsearch" text=<<navigateTo>>/><$action-setfield $tiddler="$:/temp/advancedsearch/input" text=<<navigateTo>>/><$action-setfield $tiddler="$:/temp/advancedsearch/refresh" text="yes"/><$action-sendmessage $message="tm-focus-selector" $param='.tc-advanced-search input' />""">
|
||||
<div class="tc-block-dropdown-wrapper">
|
||||
<div class="tc-block-dropdown tc-edit-type-dropdown">
|
||||
<$list filter="[all[shadows+tiddlers]tag[$:/tags/Filter]]"><$link to={{!!filter}}><$transclude field="description"/></$link>
|
||||
|
@ -7,7 +7,7 @@ first-search-filter: [all[shadows]search<userInput>sort[title]limit[250]] -[[$:/
|
||||
|
||||
\define set-next-input-tab(beforeafter:"after") <$macrocall $name="change-input-tab" stateTitle="$:/state/tab/advanced-search-results" tag="$:/tags/AdvancedSearch" beforeafter="$beforeafter$" defaultState="$:/core/ui/AdvancedSearch/System" actions="""<$action-setfield $tiddler="$:/state/advancedsearch/currentTab" text=<<nextTab>>/>"""/>
|
||||
|
||||
\define cancel-search-actions() <$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" />
|
||||
\define cancel-search-actions() <$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" /><$action-sendmessage $message="tm-focus-selector" $param=""".tc-advanced-search input"""/>
|
||||
|
||||
\define input-accept-actions() <$action-navigate $to={{{ [<__tiddler__>get[text]] }}}/>
|
||||
|
||||
@ -18,7 +18,7 @@ first-search-filter: [all[shadows]search<userInput>sort[title]limit[250]] -[[$:/
|
||||
<div class="tc-search">
|
||||
<$keyboard key="((input-tab-right))" actions=<<set-next-input-tab>>>
|
||||
<$keyboard key="((input-tab-left))" actions=<<set-next-input-tab "before">>>
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch" storeTitle="$:/temp/advancedsearch/input"
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch/input" storeTitle="$:/temp/advancedsearch"
|
||||
refreshTitle="$:/temp/advancedsearch/refresh" selectionStateTitle="$:/temp/advancedsearch/selected-item" type="search"
|
||||
tag="input" focus={{$:/config/Search/AutoFocus}} configTiddlerFilter="[[$:/core/ui/AdvancedSearch/Shadows]]"
|
||||
inputCancelActions=<<cancel-search-actions>> inputAcceptActions=<<input-accept-actions>>
|
||||
@ -33,17 +33,17 @@ first-search-filter: [all[shadows]search<userInput>sort[title]limit[250]] -[[$:/
|
||||
</$reveal>
|
||||
</div>
|
||||
|
||||
<$reveal state="$:/temp/advancedsearch/input" type="nomatch" text="">
|
||||
<$reveal state="$:/temp/advancedsearch" type="nomatch" text="">
|
||||
|
||||
<$list filter="[{$:/temp/advancedsearch/input}minlength{$:/config/Search/MinLength}limit[1]]" emptyMessage="""<div class="tc-search-results">{{$:/language/Search/Search/TooShort}}</div>""" variable="listItem">
|
||||
<$list filter="[{$:/temp/advancedsearch}minlength{$:/config/Search/MinLength}limit[1]]" emptyMessage="""<div class="tc-search-results">{{$:/language/Search/Search/TooShort}}</div>""" variable="listItem">
|
||||
|
||||
<$set name="resultCount" value="""<$count filter="[all[shadows]search{$:/temp/advancedsearch/input}] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]]"/>""">
|
||||
<$set name="resultCount" value="""<$count filter="[all[shadows]search{$:/temp/advancedsearch}] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]]"/>""">
|
||||
|
||||
<div class="tc-search-results">
|
||||
|
||||
<<lingo Shadows/Matches>>
|
||||
|
||||
<$list filter="[all[shadows]search{$:/temp/advancedsearch/input}sort[title]limit[250]] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]]">
|
||||
<$list filter="[all[shadows]search{$:/temp/advancedsearch}sort[title]limit[250]] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]]">
|
||||
<span class={{{[<currentTiddler>addsuffix[-primaryList]] -[[$:/temp/advancedsearch/selected-item]get[text]] +[then[]else[tc-list-item-selected]] }}}>
|
||||
<$transclude tiddler="$:/core/ui/ListItemTemplate"/>
|
||||
</span>
|
||||
@ -57,6 +57,6 @@ first-search-filter: [all[shadows]search<userInput>sort[title]limit[250]] -[[$:/
|
||||
|
||||
</$reveal>
|
||||
|
||||
<$reveal state="$:/temp/advancedsearch/input" type="match" text="">
|
||||
<$reveal state="$:/temp/advancedsearch" type="match" text="">
|
||||
|
||||
</$reveal>
|
||||
|
@ -7,7 +7,7 @@ caption: {{$:/language/Search/Standard/Caption}}
|
||||
|
||||
\define next-search-tab(beforeafter:"after") <$macrocall $name="change-input-tab" stateTitle="$:/state/tab/search-results/advancedsearch" tag="$:/tags/SearchResults" beforeafter="$beforeafter$" defaultState={{$:/config/SearchResults/Default}} actions="""<$action-setfield $tiddler="$:/state/advancedsearch/standard/currentTab" text=<<nextTab>>/>"""/>
|
||||
|
||||
\define cancel-search-actions() <$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" />
|
||||
\define cancel-search-actions() <$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" /><$action-sendmessage $message="tm-focus-selector" $param=""".tc-advanced-search input"""/>
|
||||
|
||||
\define input-accept-actions() <$action-navigate $to={{{ [<__tiddler__>get[text]] }}}/>
|
||||
|
||||
@ -20,7 +20,7 @@ caption: {{$:/language/Search/Standard/Caption}}
|
||||
<$keyboard key="((input-tab-left))" actions=<<set-next-input-tab "before">>>
|
||||
<$keyboard key="shift-alt-Right" actions=<<next-search-tab>>>
|
||||
<$keyboard key="shift-alt-Left" actions=<<next-search-tab "before">>>
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch" storeTitle="$:/temp/advancedsearch/input"
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch/input" storeTitle="$:/temp/advancedsearch"
|
||||
refreshTitle="$:/temp/advancedsearch/refresh" selectionStateTitle="$:/temp/advancedsearch/selected-item" type="search"
|
||||
tag="input" focus={{$:/config/Search/AutoFocus}} inputCancelActions=<<cancel-search-actions>>
|
||||
inputAcceptActions=<<input-accept-actions>> inputAcceptVariantActions=<<input-accept-variant-actions>>
|
||||
@ -30,7 +30,7 @@ caption: {{$:/language/Search/Standard/Caption}}
|
||||
</$keyboard>
|
||||
</$keyboard>
|
||||
</$keyboard>
|
||||
<$reveal state="$:/temp/advancedsearch/input" type="nomatch" text="">
|
||||
<$reveal state="$:/temp/advancedsearch" type="nomatch" text="">
|
||||
<$button class="tc-btn-invisible">
|
||||
<<cancel-search-actions>>
|
||||
{{$:/core/images/close-button}}
|
||||
@ -38,9 +38,9 @@ caption: {{$:/language/Search/Standard/Caption}}
|
||||
</$reveal>
|
||||
</div>
|
||||
|
||||
<$reveal state="$:/temp/advancedsearch/input" type="nomatch" text="">
|
||||
<$list filter="[{$:/temp/advancedsearch/input}minlength{$:/config/Search/MinLength}limit[1]]" emptyMessage="""<div class="tc-search-results">{{$:/language/Search/Search/TooShort}}</div>""" variable="listItem">
|
||||
<$vars userInput={{{ [[$:/temp/advancedsearch/input]get[text]] }}} configTiddler={{{ [[$:/state/search/currentTab]!is[missing]get[text]] ~[{$:/config/SearchResults/Default}] }}} searchListState="$:/temp/advancedsearch/selected-item">
|
||||
<$reveal state="$:/temp/advancedsearch" type="nomatch" text="">
|
||||
<$list filter="[{$:/temp/advancedsearch}minlength{$:/config/Search/MinLength}limit[1]]" emptyMessage="""<div class="tc-search-results">{{$:/language/Search/Search/TooShort}}</div>""" variable="listItem">
|
||||
<$vars userInput={{{ [[$:/temp/advancedsearch]get[text]] }}} configTiddler={{{ [[$:/state/search/currentTab]!is[missing]get[text]] ~[{$:/config/SearchResults/Default}] }}} searchListState="$:/temp/advancedsearch/selected-item">
|
||||
<$list filter="[all[shadows+tiddlers]tag[$:/tags/SearchResults]!has[draft.of]butfirst[]limit[1]]" emptyMessage="""
|
||||
<$list filter="[all[shadows+tiddlers]tag[$:/tags/SearchResults]!has[draft.of]]">
|
||||
<$transclude/>
|
||||
|
@ -6,7 +6,7 @@ first-search-filter: [is[system]search<userInput>sort[title]limit[250]] -[[$:/te
|
||||
\define lingo-base() $:/language/Search/
|
||||
\define set-next-input-tab(beforeafter:"after",stateTitle,tag,defaultState,currentTabTiddler) <$macrocall $name="change-input-tab" stateTitle="$:/state/tab/advanced-search-results" tag="$:/tags/AdvancedSearch" beforeafter="$beforeafter$" defaultState="$:/core/ui/AdvancedSearch/System" actions="""<$action-setfield $tiddler="$:/state/advancedsearch/currentTab" text=<<nextTab>>/>"""/>
|
||||
|
||||
\define cancel-search-actions() <$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" />
|
||||
\define cancel-search-actions() <$action-deletetiddler $filter="[[$:/temp/advancedsearch]] [[$:/temp/advancedsearch/input]] [[$:/temp/advancedsearch/selected-item]]" /><$action-sendmessage $message="tm-focus-selector" $param=""".tc-advanced-search input"""/>
|
||||
|
||||
\define input-accept-actions() <$action-navigate $to={{{ [<__tiddler__>get[text]] }}}/>
|
||||
|
||||
@ -17,7 +17,7 @@ first-search-filter: [is[system]search<userInput>sort[title]limit[250]] -[[$:/te
|
||||
<div class="tc-search">
|
||||
<$keyboard key="((input-tab-right))" actions=<<set-next-input-tab>>>
|
||||
<$keyboard key="((input-tab-left))" actions=<<set-next-input-tab "before">>>
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch" storeTitle="$:/temp/advancedsearch/input"
|
||||
<$macrocall $name="keyboard-driven-input" tiddler="$:/temp/advancedsearch/input" storeTitle="$:/temp/advancedsearch"
|
||||
refreshTitle="$:/temp/advancedsearch/refresh" selectionStateTitle="$:/temp/advancedsearch/selected-item"
|
||||
type="search" tag="input" focus={{$:/config/Search/AutoFocus}} configTiddlerFilter="[[$:/core/ui/AdvancedSearch/System]]"
|
||||
inputCancelActions=<<cancel-search-actions>> inputAcceptActions=<<input-accept-actions>>
|
||||
@ -32,17 +32,17 @@ first-search-filter: [is[system]search<userInput>sort[title]limit[250]] -[[$:/te
|
||||
</$reveal>
|
||||
</div>
|
||||
|
||||
<$reveal state="$:/temp/advancedsearch/input" type="nomatch" text="">
|
||||
<$reveal state="$:/temp/advancedsearch" type="nomatch" text="">
|
||||
|
||||
<$list filter="[{$:/temp/advancedsearch/input}minlength{$:/config/Search/MinLength}limit[1]]" emptyMessage="""<div class="tc-search-results">{{$:/language/Search/Search/TooShort}}</div>""" variable="listItem">
|
||||
<$list filter="[{$:/temp/advancedsearch}minlength{$:/config/Search/MinLength}limit[1]]" emptyMessage="""<div class="tc-search-results">{{$:/language/Search/Search/TooShort}}</div>""" variable="listItem">
|
||||
|
||||
<$set name="resultCount" value="""<$count filter="[is[system]search{$:/temp/advancedsearch/input}] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]] -[[$:/temp/advancedsearch/selected-item]]"/>""">
|
||||
<$set name="resultCount" value="""<$count filter="[is[system]search{$:/temp/advancedsearch}] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]] -[[$:/temp/advancedsearch/selected-item]]"/>""">
|
||||
|
||||
<div class="tc-search-results">
|
||||
|
||||
<<lingo System/Matches>>
|
||||
|
||||
<$list filter="[is[system]search{$:/temp/advancedsearch/input}sort[title]limit[250]] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]] -[[$:/temp/advancedsearch/selected-item]]">
|
||||
<$list filter="[is[system]search{$:/temp/advancedsearch}sort[title]limit[250]] -[[$:/temp/advancedsearch]] -[[$:/temp/advancedsearch/input]] -[[$:/temp/advancedsearch/selected-item]]">
|
||||
<span class={{{[<currentTiddler>addsuffix[-primaryList]] -[[$:/temp/advancedsearch/selected-item]get[text]] +[then[]else[tc-list-item-selected]] }}}>
|
||||
<$transclude tiddler="$:/core/ui/ListItemTemplate"/>
|
||||
</span>
|
||||
|
@ -25,10 +25,10 @@ $actions$
|
||||
<$list filter="[<__storeTitle__>get[text]minlength<__filterMinLength__>] [<__filterMinLength__>match[0]] +[limit[1]]" variable="ignore">
|
||||
<$vars userInput={{{ [<__storeTitle__>get[text]] }}} selectedItem={{{ [<__selectionStateTitle__>get[text]] }}}>
|
||||
<$set name="configTiddler" value={{{ [subfilter<__configTiddlerFilter__>] }}}>
|
||||
<$vars primaryListFilter={{{ [<configTiddler>get[first-search-filter]] }}} secondaryListFilter={{{ [<configTiddler>get[second-search-filter]] }}}>
|
||||
<$vars primaryListFilter={{{ [<configTiddler>get<__firstSearchFilterField__>] }}} secondaryListFilter={{{ [<configTiddler>get<__secondSearchFilterField__>] }}}>
|
||||
<$set name="filteredList" filter="[subfilter<primaryListFilter>addsuffix[-primaryList]] =[subfilter<secondaryListFilter>addsuffix[-secondaryList]]">
|
||||
<$set name="nextItem" value={{{ [enlist<filteredList>$afterOrBefore$<selectedItem>] ~[enlist<filteredList>$reverse$nth[1]] }}}>
|
||||
<$list filter="[<nextItem>minlength[1]]">
|
||||
<$list filter="[<nextItem>minlength[1]]" variable="ignore">
|
||||
<$action-setfield $tiddler=<<__selectionStateTitle__>> text=<<nextItem>>/>
|
||||
<$list filter="[<__index__>match[]]">
|
||||
<$action-setfield $tiddler=<<__tiddler__>> $field=<<__field__>> $value={{{ [<nextItem>] +[splitregexp[(?:.(?!-))+$]] }}}/>
|
||||
@ -46,7 +46,8 @@ $actions$
|
||||
</$list>
|
||||
\end
|
||||
|
||||
\define keyboard-driven-input(tiddler,storeTitle,field:"text",index:"",tag:"input",type,focus:"",inputAcceptActions,inputAcceptVariantActions,inputCancelActions,placeholder:"",default:"",class,focusPopup,rows,minHeight,tabindex,size,autoHeight,filterMinLength:"0",refreshTitle,selectionStateTitle,cancelPopups:"",configTiddlerFilter)
|
||||
\define keyboard-driven-input(tiddler,storeTitle,field:"text",index:"",tag:"input",type,focus:"",inputAcceptActions,inputAcceptVariantActions,inputCancelActions,placeholder:"",default:"",class,focusPopup,rows,minHeight,tabindex,size,autoHeight,filterMinLength:"0",refreshTitle,selectionStateTitle,cancelPopups:"",configTiddlerFilter,firstSearchFilterField:"first-search-filter",secondSearchFilterField:"second-search-filter")
|
||||
\whitespace trim
|
||||
<$keyboard key="((input-accept))" actions=<<__inputAcceptActions__>>>
|
||||
<$keyboard key="((input-accept-variant))" actions=<<__inputAcceptVariantActions__>>>
|
||||
<$keyboard key="((input-up))" actions=<<input-next-actions "before" "reverse[]">>>
|
||||
|
Loading…
Reference in New Issue
Block a user