মিডিয়াউইকি:Common.js: সংশোধিত সংস্করণের মধ্যে পার্থক্য

২২:১০, ৪ জানুয়ারি ২০২৬ তারিখে সংশোধিত সংস্করণ

// MediaWiki Search Collapse for Sticky Header
(function() {
    'use strict';
    
    // Wait for DOM to be ready
    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
    } else {
        init();
    }
    
    function init() {
        // Find the search box in sticky header
        const stickyHeader = document.querySelector('.vector-header--sticky, .vector-sticky-header');
        if (!stickyHeader) return;
        
        const searchBox = stickyHeader.querySelector('.vector-search-box');
        if (!searchBox) return;
        
        const searchInput = searchBox.querySelector('input[type="search"], .cdx-search-input__input');
        const searchForm = searchBox.querySelector('form');
        
        if (!searchInput || !searchForm) return;
        
        // Create toggle button
        const toggleBtn = document.createElement('button');
        toggleBtn.className = 'search-collapse-toggle';
        toggleBtn.innerHTML = '🔍';
        toggleBtn.type = 'button';
        toggleBtn.style.cssText = `
            width: 32px;
            height: 32px;
            background: #f8f9fa;
            border: 1px solid #a2a9b1;
            border-radius: 6px;
            cursor: pointer;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-size: 16px;
        `;
        
        // Initially hide the form
        searchForm.style.display = 'none';
        
        // Insert toggle button
        searchBox.insertBefore(toggleBtn, searchForm);
        
        // Toggle functionality
        toggleBtn.addEventListener('click', function(e) {
            e.stopPropagation();
            searchForm.style.display = 'flex';
            toggleBtn.style.display = 'none';
            searchInput.focus();
        });
        
        // Click outside to close
        document.addEventListener('click', function(e) {
            if (!searchBox.contains(e.target)) {
                searchForm.style.display = 'none';
                toggleBtn.style.display = 'inline-flex';
            }
        });
        
        // Prevent closing when clicking inside search
        searchBox.addEventListener('click', function(e) {
            e.stopPropagation();
        });
    }
    
    // Re-run when header becomes sticky
    const observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
            if (mutation.target.classList.contains('vector-header--sticky') || 
                mutation.target.classList.contains('vector-sticky-header')) {
                init();
            }
        });
    });
    
    // Observe the header
    const header = document.querySelector('.vector-header, header');
    if (header) {
        observer.observe(header, {
            attributes: true,
            attributeFilter: ['class']
        });
    }
})();