MediaWiki:Mobile.js: Difference between revisions

Revision as of 02:05, 13 November 2026

/* Mobile and Desktop VaniSearch Input Replacement */
(function() {
    function replaceSearchForms() {
        // 1. Mobile (Minerva): Replace the entire form with a div so Minerva listeners cannot fire
        var minervaForm = document.querySelector('form.minerva-search-form');
        if (minervaForm) {
            var searchWrap = document.createElement('div');
            searchWrap.className = 'vani-mobile-search-box';

            var cleanInput = document.createElement('input');
            cleanInput.type = 'text';
            cleanInput.name = 'search';
            cleanInput.className = 'vani-clean-search-input';
            cleanInput.placeholder = 'Search Vanipedia';
            cleanInput.autocomplete = 'off';

            var goBtn = document.createElement('button');
            goBtn.type = 'button';
            goBtn.className = 'vani-inline-go';
            goBtn.innerHTML = '🔍';

            function runMobileSearch(e) {
                if (e) {
                    e.preventDefault();
                    e.stopPropagation();
                }
                var val = cleanInput.value.trim();
                if (val !== '') {
                    window.location.href = '/wiki/Special:VaniSearch?search=' + encodeURIComponent(val);
                }
            }

            goBtn.addEventListener('click', runMobileSearch);
            cleanInput.addEventListener('keydown', function(e) {
                e.stopPropagation();
                if (e.key === 'Enter' || e.keyCode === 13) {
                    runMobileSearch(e);
                }
            });

            searchWrap.appendChild(cleanInput);
            searchWrap.appendChild(goBtn);
            minervaForm.parentNode.replaceChild(searchWrap, minervaForm);
        }

        // 2. Desktop (Vector): Route Enter key and add right-side icon
        var desktopForm = document.querySelector('#p-search form, form#searchform');
        if (desktopForm && !desktopForm.classList.contains('minerva-search-form') && !desktopForm.dataset.vaniBound) {
            desktopForm.dataset.vaniBound = 'true';
            desktopForm.setAttribute('action', '/wiki/Special:VaniSearch');

            var dInput = desktopForm.querySelector('input[type="search"], input[name="search"], #searchInput');
            if (dInput) {
                dInput.setAttribute('autocomplete', 'off');
                var wrap = dInput.parentElement;
                if (wrap && !wrap.querySelector('.vani-inline-go')) {
                    wrap.style.position = 'relative';
                    var dBtn = document.createElement('button');
                    dBtn.type = 'button';
                    dBtn.className = 'vani-inline-go';
                    dBtn.innerHTML = '🔍';
                    dBtn.addEventListener('click', function(e) {
                        e.preventDefault();
                        var val = dInput.value.trim();
                        if (val !== '') {
                            window.location.href = '/wiki/Special:VaniSearch?search=' + encodeURIComponent(val);
                        }
                    });
                    wrap.appendChild(dBtn);
                }

                dInput.addEventListener('keydown', function(e) {
                    if (e.key === 'Enter' || e.keyCode === 13) {
                        e.preventDefault();
                        e.stopImmediatePropagation();
                        var val = dInput.value.trim();
                        if (val !== '') {
                            window.location.href = '/wiki/Special:VaniSearch?search=' + encodeURIComponent(val);
                        }
                    }
                }, true);
            }
        }
    }

    if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', replaceSearchForms);
    } else {
        replaceSearchForms();
    }
    setTimeout(replaceSearchForms, 250);
    setTimeout(replaceSearchForms, 800);
})();