default search on enter and start focus on regex

This commit is contained in:
David Botton 2024-07-04 15:42:36 -04:00
parent 0e306f6f12
commit 4523916e74
2 changed files with 54 additions and 43 deletions

View file

@ -1,5 +1,7 @@
<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>
<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: &quot;a a&quot; 1fr &quot;d d&quot; 28px &quot;b c&quot; 28px / 1fr 80px; gap: 5px;"
class=""><select data-clog-type="listbox" size="4"
@ -12,10 +14,11 @@
placeholder="directory to search" tabindex="3"><input type="TEXT"
value="" data-clog-type="input" data-clog-name="grep-input"
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 &quot;autofocus&quot;) &quot;true&quot;)
(focus target)"><input type="submit" value="Search" data-clog-type="input"
data-clog-name="search-button"
style="box-sizing: content-box; position: static; height: 22px; grid-area: c;"
data-on-click="(panel-search-on-click panel target)" class=""
data-on-create="(setf (attribute target &quot;autofocus&quot;) &quot;true&quot;)
(focus target)" tabindex="1">Search</button>
tabindex="1">
</div>
</form>

View file

@ -3,46 +3,54 @@
(defclass panel-search (clog:clog-panel)
((search-button :reader search-button)
(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
(clog-obj &key hidden class style html-id (auto-place t))
(let ((panel
(change-class
(clog:create-div clog-obj :content
"<div style=\"display: grid; box-sizing: content-box; position: absolute; inset: 5px; grid-template: &quot;a a&quot; 1fr &quot;d d&quot; 28px &quot;b c&quot; 28px / 1fr 80px; gap: 5px;\"
class=\"\" id=\"CLOGB3929109399\" data-clog-name=\"result-grid\"><select size=\"4\"
"<form action=\"#\" onsubmit=\"return false;\" id=\"CLOGB3929110554\"
data-clog-name=\"search-form\">
<div style=\"display: grid; box-sizing: content-box; position: absolute; inset: 5px; grid-template: &quot;a a&quot; 1fr &quot;d d&quot; 28px &quot;b c&quot; 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;\"
class=\"w3-small\" tabindex=\"2\" id=\"CLOGB3929109400\"
class=\"w3-small\" tabindex=\"2\" id=\"CLOGB3929110556\"
data-clog-name=\"result-box\"></select><input type=\"TEXT\" value=\"\"
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=\"\"
style=\"box-sizing: content-box; position: static; left: 50px; top: 8px; grid-area: b;\"
placeholder=\"search regex\" tabindex=\"4\" id=\"CLOGB3929109402\"
data-clog-name=\"grep-input\"><button
placeholder=\"search regex\" tabindex=\"4\" id=\"CLOGB3929110558\"
data-clog-name=\"grep-input\"><input type=\"submit\" value=\"Search\"
style=\"box-sizing: content-box; position: static; height: 22px; grid-area: c;\"
class=\"\" tabindex=\"1\" id=\"CLOGB3929109403\"
data-clog-name=\"search-button\">Search</button>
</div>"
class=\"\" tabindex=\"1\" id=\"CLOGB3929110559\"
data-clog-name=\"search-button\">
</div>
</form>"
:hidden hidden :class class :style style :html-id
html-id :auto-place auto-place)
'panel-search)))
(setf (slot-value panel 'search-button)
(attach-as-child clog-obj "CLOGB3929109403" :clog-type
'clog:clog-button :new-id t))
(attach-as-child clog-obj "CLOGB3929110559" :clog-type
'clog:clog-form-element :new-id t))
(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))
(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))
(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))
(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))
(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))
(setf (attribute target "autofocus") "true")
(focus target))