mirror of
https://github.com/rabbibotton/clog.git
synced 2025-12-06 10:40:45 -08:00
default search on enter and start focus on regex
This commit is contained in:
parent
0e306f6f12
commit
4523916e74
2 changed files with 54 additions and 43 deletions
15
tools/panel-search.clog
vendored
15
tools/panel-search.clog
vendored
|
|
@ -1,6 +1,8 @@
|
||||||
<data id="I3929109423" data-in-package="clog-tools" data-custom-slots=""
|
<data id="I3929110633" data-in-package="clog-tools" data-custom-slots=""
|
||||||
data-clog-next-id="6" data-clog-title="panel-search"></data>
|
data-clog-next-id="6" data-clog-title="panel-search"></data>
|
||||||
<div data-clog-type="grid" data-clog-name="result-grid"
|
<form action="#" onsubmit="return false;" data-clog-name="search-form"
|
||||||
|
data-clog-type="form">
|
||||||
|
<div data-clog-type="grid" data-clog-name="result-grid"
|
||||||
style="display: grid; box-sizing: content-box; position: absolute; inset: 5px; grid-template: "a a" 1fr "d d" 28px "b c" 28px / 1fr 80px; gap: 5px;"
|
style="display: grid; box-sizing: content-box; position: absolute; inset: 5px; grid-template: "a a" 1fr "d d" 28px "b c" 28px / 1fr 80px; gap: 5px;"
|
||||||
class=""><select data-clog-type="listbox" size="4"
|
class=""><select data-clog-type="listbox" size="4"
|
||||||
data-clog-name="result-box"
|
data-clog-name="result-box"
|
||||||
|
|
@ -12,10 +14,11 @@
|
||||||
placeholder="directory to search" tabindex="3"><input type="TEXT"
|
placeholder="directory to search" tabindex="3"><input type="TEXT"
|
||||||
value="" data-clog-type="input" data-clog-name="grep-input"
|
value="" data-clog-type="input" data-clog-name="grep-input"
|
||||||
style="box-sizing: content-box; position: static; left: 50px; top: 8px; grid-area: b;"
|
style="box-sizing: content-box; position: static; left: 50px; top: 8px; grid-area: b;"
|
||||||
placeholder="search regex" tabindex="4"><button data-clog-type="button"
|
placeholder="search regex" tabindex="4" data-on-create="(setf (attribute target "autofocus") "true")
|
||||||
|
(focus target)"><input type="submit" value="Search" data-clog-type="input"
|
||||||
data-clog-name="search-button"
|
data-clog-name="search-button"
|
||||||
style="box-sizing: content-box; position: static; height: 22px; grid-area: c;"
|
style="box-sizing: content-box; position: static; height: 22px; grid-area: c;"
|
||||||
data-on-click="(panel-search-on-click panel target)" class=""
|
data-on-click="(panel-search-on-click panel target)" class=""
|
||||||
data-on-create="(setf (attribute target "autofocus") "true")
|
tabindex="1">
|
||||||
(focus target)" tabindex="1">Search</button>
|
</div>
|
||||||
</div>
|
</form>
|
||||||
|
|
@ -3,46 +3,54 @@
|
||||||
(defclass panel-search (clog:clog-panel)
|
(defclass panel-search (clog:clog-panel)
|
||||||
((search-button :reader search-button)
|
((search-button :reader search-button)
|
||||||
(grep-input :reader grep-input) (dir-input :reader dir-input)
|
(grep-input :reader grep-input) (dir-input :reader dir-input)
|
||||||
(result-box :reader result-box) (result-grid :reader result-grid)))
|
(result-box :reader result-box) (result-grid :reader result-grid)
|
||||||
|
(search-form :reader search-form)))
|
||||||
(defun create-panel-search
|
(defun create-panel-search
|
||||||
(clog-obj &key hidden class style html-id (auto-place t))
|
(clog-obj &key hidden class style html-id (auto-place t))
|
||||||
(let ((panel
|
(let ((panel
|
||||||
(change-class
|
(change-class
|
||||||
(clog:create-div clog-obj :content
|
(clog:create-div clog-obj :content
|
||||||
"<div style=\"display: grid; box-sizing: content-box; position: absolute; inset: 5px; grid-template: "a a" 1fr "d d" 28px "b c" 28px / 1fr 80px; gap: 5px;\"
|
"<form action=\"#\" onsubmit=\"return false;\" id=\"CLOGB3929110554\"
|
||||||
class=\"\" id=\"CLOGB3929109399\" data-clog-name=\"result-grid\"><select size=\"4\"
|
data-clog-name=\"search-form\">
|
||||||
|
<div style=\"display: grid; box-sizing: content-box; position: absolute; inset: 5px; grid-template: "a a" 1fr "d d" 28px "b c" 28px / 1fr 80px; gap: 5px;\"
|
||||||
|
class=\"\" id=\"CLOGB3929110555\" data-clog-name=\"result-grid\"><select
|
||||||
|
size=\"4\"
|
||||||
style=\"box-sizing: content-box; position: static; grid-area: a;\"
|
style=\"box-sizing: content-box; position: static; grid-area: a;\"
|
||||||
class=\"w3-small\" tabindex=\"2\" id=\"CLOGB3929109400\"
|
class=\"w3-small\" tabindex=\"2\" id=\"CLOGB3929110556\"
|
||||||
data-clog-name=\"result-box\"></select><input type=\"TEXT\" value=\"\"
|
data-clog-name=\"result-box\"></select><input type=\"TEXT\" value=\"\"
|
||||||
style=\"box-sizing: content-box; position: static; grid-area: d;\"
|
style=\"box-sizing: content-box; position: static; grid-area: d;\"
|
||||||
placeholder=\"directory to search\" tabindex=\"3\" id=\"CLOGB3929109401\"
|
placeholder=\"directory to search\" tabindex=\"3\" id=\"CLOGB3929110557\"
|
||||||
data-clog-name=\"dir-input\"><input type=\"TEXT\" value=\"\"
|
data-clog-name=\"dir-input\"><input type=\"TEXT\" value=\"\"
|
||||||
style=\"box-sizing: content-box; position: static; left: 50px; top: 8px; grid-area: b;\"
|
style=\"box-sizing: content-box; position: static; left: 50px; top: 8px; grid-area: b;\"
|
||||||
placeholder=\"search regex\" tabindex=\"4\" id=\"CLOGB3929109402\"
|
placeholder=\"search regex\" tabindex=\"4\" id=\"CLOGB3929110558\"
|
||||||
data-clog-name=\"grep-input\"><button
|
data-clog-name=\"grep-input\"><input type=\"submit\" value=\"Search\"
|
||||||
style=\"box-sizing: content-box; position: static; height: 22px; grid-area: c;\"
|
style=\"box-sizing: content-box; position: static; height: 22px; grid-area: c;\"
|
||||||
class=\"\" tabindex=\"1\" id=\"CLOGB3929109403\"
|
class=\"\" tabindex=\"1\" id=\"CLOGB3929110559\"
|
||||||
data-clog-name=\"search-button\">Search</button>
|
data-clog-name=\"search-button\">
|
||||||
</div>"
|
</div>
|
||||||
|
</form>"
|
||||||
:hidden hidden :class class :style style :html-id
|
:hidden hidden :class class :style style :html-id
|
||||||
html-id :auto-place auto-place)
|
html-id :auto-place auto-place)
|
||||||
'panel-search)))
|
'panel-search)))
|
||||||
(setf (slot-value panel 'search-button)
|
(setf (slot-value panel 'search-button)
|
||||||
(attach-as-child clog-obj "CLOGB3929109403" :clog-type
|
(attach-as-child clog-obj "CLOGB3929110559" :clog-type
|
||||||
'clog:clog-button :new-id t))
|
'clog:clog-form-element :new-id t))
|
||||||
(setf (slot-value panel 'grep-input)
|
(setf (slot-value panel 'grep-input)
|
||||||
(attach-as-child clog-obj "CLOGB3929109402" :clog-type
|
(attach-as-child clog-obj "CLOGB3929110558" :clog-type
|
||||||
'clog:clog-form-element :new-id t))
|
'clog:clog-form-element :new-id t))
|
||||||
(setf (slot-value panel 'dir-input)
|
(setf (slot-value panel 'dir-input)
|
||||||
(attach-as-child clog-obj "CLOGB3929109401" :clog-type
|
(attach-as-child clog-obj "CLOGB3929110557" :clog-type
|
||||||
'clog:clog-form-element :new-id t))
|
'clog:clog-form-element :new-id t))
|
||||||
(setf (slot-value panel 'result-box)
|
(setf (slot-value panel 'result-box)
|
||||||
(attach-as-child clog-obj "CLOGB3929109400" :clog-type
|
(attach-as-child clog-obj "CLOGB3929110556" :clog-type
|
||||||
'clog:clog-select :new-id t))
|
'clog:clog-select :new-id t))
|
||||||
(setf (slot-value panel 'result-grid)
|
(setf (slot-value panel 'result-grid)
|
||||||
(attach-as-child clog-obj "CLOGB3929109399" :clog-type
|
(attach-as-child clog-obj "CLOGB3929110555" :clog-type
|
||||||
'clog:clog-div :new-id t))
|
'clog:clog-div :new-id t))
|
||||||
(let ((target (search-button panel)))
|
(setf (slot-value panel 'search-form)
|
||||||
|
(attach-as-child clog-obj "CLOGB3929110554" :clog-type
|
||||||
|
'clog:clog-form :new-id t))
|
||||||
|
(let ((target (grep-input panel)))
|
||||||
(declare (ignorable target))
|
(declare (ignorable target))
|
||||||
(setf (attribute target "autofocus") "true")
|
(setf (attribute target "autofocus") "true")
|
||||||
(focus target))
|
(focus target))
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue