Skip to content

Commit 542a91a

Browse files
authored
Be less aggressive in maintaining focus on search box (#4395)
* Be less aggressive in maintaining focus on search box * Also focus when clear clicked
1 parent 7ce07b9 commit 542a91a

File tree

1 file changed

+16
-8
lines changed

1 file changed

+16
-8
lines changed

_templates/searchbox.html

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -157,10 +157,20 @@
157157
resizeTarget();
158158
}
159159

160+
function search_focus() {
161+
const input_field = document.getElementById("pfmod-input-0");
162+
if (input_field) {
163+
requestAnimationFrame(() => input_field.focus());
164+
}
165+
}
166+
167+
160168
function hideTargets() {
161169
if (target.style.display !== "none") {
162170
target.style.display = "none";
163171
document.removeEventListener('click', clickCallback);
172+
// keep focus on search box after clicking on search result
173+
search_focus();
164174
}
165175
}
166176

@@ -200,14 +210,12 @@
200210
}
201211
});
202212
}
203-
const input_field = document.getElementById("pfmod-input-0");
204-
if (input_field) {
205-
input_field.focus({preventScroll: true});
206-
input_field.addEventListener("blur", () => {
207-
requestAnimationFrame(() => {
208-
input_field.focus({preventScroll: true});
209-
});
210-
})
213+
// focus the search field on page load.
214+
search_focus();
215+
// focus when clicking on clear button
216+
const clears = document.getElementsByClassName("pagefind-modular-list-clear");
217+
for (let i = 0; i !== clears.length; i++) {
218+
clears[i].addEventListener("click", search_focus);
211219
}
212220
});
213221
</script>

0 commit comments

Comments
 (0)