মিডিয়াউইকি:Common.js: সংশোধিত সংস্করণের মধ্যে পার্থক্য
সম্পাদনা সারাংশ নেই ট্যাগ: পুনর্বহালকৃত |
সম্পাদনা সারাংশ নেই ট্যাগ: পুনর্বহালকৃত |
||
| ২ নং লাইন: | ২ নং লাইন: | ||
(function() { | (function() { | ||
'use strict'; | 'use strict'; | ||
let isInitialized = false; | |||
function initSearchToggle() { | function initSearchToggle() { | ||
// Prevent multiple initializations | |||
if (isInitialized) return; | |||
// Wait for sticky header to be visible | |||
if (!document.querySelector('.vector-sticky-header-visible')) { | |||
return; | |||
} | |||
// Find the search toggle button | // Find the search toggle button | ||
const searchToggle = document.querySelector('.vector-sticky-header-visible .search-toggle'); | const searchToggle = document.querySelector('.vector-sticky-header-visible .search-toggle'); | ||
| ১০ নং লাইন: | ২০ নং লাইন: | ||
const searchInput = document.querySelector('.vector-sticky-header-visible .cdx-text-input__input'); | const searchInput = document.querySelector('.vector-sticky-header-visible .cdx-text-input__input'); | ||
if (!searchToggle || !searchBox || !searchContainer) return; | if (!searchToggle || !searchBox || !searchContainer) { | ||
return; | |||
} | |||
isInitialized = true; | |||
// Toggle search on icon click | // Toggle search on icon click | ||
searchToggle.addEventListener('click', function(e) { | |||
e.preventDefault(); | e.preventDefault(); | ||
e.stopPropagation(); | e.stopPropagation(); | ||
console.log('Search toggle clicked'); | |||
// Show search container and hide toggle | |||
searchContainer.classList.add('search-active'); | searchContainer.classList.add('search-active'); | ||
searchToggle.classList.add('search-hidden'); | |||
// Focus the input | // Focus the input | ||
| ২৮ নং লাইন: | ৪১ নং লাইন: | ||
setTimeout(function() { | setTimeout(function() { | ||
searchInput.focus(); | searchInput.focus(); | ||
}, | }, 100); | ||
} | } | ||
}); | }); | ||
// Close when clicking outside | // Close when clicking outside | ||
function closeSearch(e) { | |||
if (!searchBox.contains(e.target)) { | if (searchBox && !searchBox.contains(e.target)) { | ||
searchContainer.classList.remove('search-active'); | searchContainer.classList.remove('search-active'); | ||
searchToggle.classList.remove('search-hidden'); | |||
} | } | ||
}); | } | ||
document.addEventListener('click', closeSearch); | |||
// Prevent closing when clicking inside search | // Prevent closing when clicking inside search | ||
| ৪৪ নং লাইন: | ৫৯ নং লাইন: | ||
e.stopPropagation(); | e.stopPropagation(); | ||
}); | }); | ||
console.log('Search toggle initialized'); | |||
} | } | ||
// Run when page loads | // Run when page loads | ||
function init() { | |||
setTimeout(function() { | |||
initSearchToggle(); | |||
}, 1000); | |||
} | |||
if (document.readyState === 'loading') { | if (document.readyState === 'loading') { | ||
document.addEventListener('DOMContentLoaded', | document.addEventListener('DOMContentLoaded', init); | ||
} else { | } else { | ||
init(); | |||
} | } | ||
| ৫৯ নং লাইন: | ৮০ নং লাইন: | ||
window.addEventListener('scroll', function() { | window.addEventListener('scroll', function() { | ||
clearTimeout(scrollTimeout); | clearTimeout(scrollTimeout); | ||
scrollTimeout = setTimeout(initSearchToggle, | scrollTimeout = setTimeout(function() { | ||
if (!isInitialized) { | |||
initSearchToggle(); | |||
} | |||
}, 300); | |||
}); | }); | ||
// Also observe for class changes on body | // Also observe for class changes on body | ||
const observer = new MutationObserver(function() { | const observer = new MutationObserver(function(mutations) { | ||
initSearchToggle | mutations.forEach(function(mutation) { | ||
if (mutation.attributeName === 'class') { | |||
const body = mutation.target; | |||
if (body.classList.contains('vector-sticky-header-visible') && !isInitialized) { | |||
setTimeout(initSearchToggle, 300); | |||
} | |||
} | |||
}); | |||
}); | }); | ||