fix: don't close search if children have focus, closes #13004

This commit is contained in:
Barış Soner Uşaklı
2024-12-23 16:28:53 -05:00
parent 5b2dfd740c
commit 1cb7bb6a72
2 changed files with 12 additions and 11 deletions

View File

@@ -28,9 +28,9 @@ define('search', [
const toggleVisibility = searchFields.hasClass('hidden'); const toggleVisibility = searchFields.hasClass('hidden');
if (toggleVisibility) { if (toggleVisibility) {
searchInput.off('blur').on('blur', function dismissSearch() { searchFields.off('focusout').on('focusout', function dismissSearch() {
setTimeout(function () { setTimeout(function () {
if (!searchInput.is(':focus')) { if (!searchFields.find(':focus').length) {
searchFields.addClass('hidden'); searchFields.addClass('hidden');
searchButton.removeClass('hidden'); searchButton.removeClass('hidden');
} }
@@ -177,30 +177,33 @@ define('search', [
doSearch(); doSearch();
}, 500)); }, 500));
let mousedownOnResults = false;
quickSearchResults.on('mousedown', '.quick-search-results > *', function () { quickSearchResults.on('mousedown', '.quick-search-results > *', function () {
$(window).one('mouseup', function () { $(window).one('mouseup', function () {
quickSearchResults.addClass('hidden'); quickSearchResults.addClass('hidden');
}); });
mousedownOnResults = true;
}); });
inputEl.on('blur', function () {
const inputParent = inputEl.parent();
const resultParent = quickSearchResults.parent();
inputParent.on('focusout', hideResults);
resultParent.on('focusout', hideResults);
function hideResults() {
setTimeout(function () { setTimeout(function () {
if (!inputEl.is(':focus') && !mousedownOnResults && !quickSearchResults.hasClass('hidden')) { if (!inputParent.find(':focus').length && !resultParent.find(':focus').length && !quickSearchResults.hasClass('hidden')) {
quickSearchResults.addClass('hidden'); quickSearchResults.addClass('hidden');
} }
}, 200); }, 200);
}); }
let ajaxified = false; let ajaxified = false;
hooks.on('action:ajaxify.end', function () { hooks.on('action:ajaxify.end', function () {
if (!ajaxify.isCold()) { if (!ajaxify.isCold()) {
ajaxified = true; ajaxified = true;
} }
quickSearchResults.addClass('hidden');
}); });
inputEl.on('focus', function () { inputEl.on('focus', function () {
mousedownOnResults = false;
const query = inputEl.val(); const query = inputEl.val();
oldValue = query; oldValue = query;
if (query && quickSearchResults.find('#quick-search-results').children().length) { if (query && quickSearchResults.find('#quick-search-results').children().length) {

View File

@@ -1,6 +1,4 @@
<div class="tool-modal d-flex"> <div class="tool-modal d-flex">
<div class="card shadow"> <div class="card shadow">
<h5 class="card-header">[[topic:thread-tools.merge-topics]]</h5> <h5 class="card-header">[[topic:thread-tools.merge-topics]]</h5>
<div class="card-body"> <div class="card-body">
@@ -13,7 +11,7 @@
<span class="input-group-text"><i class="fa fa-search"></i></span> <span class="input-group-text"><i class="fa fa-search"></i></span>
</div> </div>
<div class="quick-search-container dropdown-menu d-block p-2 hidden"> <div class="quick-search-container dropdown-menu d-block p-2 hidden w-100">
<div class="text-center loading-indicator"><i class="fa fa-spinner fa-spin"></i></div> <div class="text-center loading-indicator"><i class="fa fa-spinner fa-spin"></i></div>
<div class="quick-search-results-container"></div> <div class="quick-search-results-container"></div>
</div> </div>