MediaWiki:Common.js

/* Any JavaScript here will be loaded for all users on every page load. */
$(document).ready(function () {
    $.get(mw.util.wikiScript('api'), {
        action: 'query',
        meta: 'userinfo',
        format: 'json'
    }).done(function (data) {
        if (data.query.userinfo.id !== 0) { 
            var username = data.query.userinfo.name;
            var userLink = mw.util.getUrl('User:' + username);
            $('#user-info').html('<a href="' + userLink + '" class="text-white">' + username + '</a>');
        }
    });
});


document.getElementById('offcanvas-toggler').addEventListener('click', function() {
    var sidebar = document.getElementById('offcanvas-menu');
    if (sidebar.classList.contains('show')) {
        sidebar.classList.remove('show');
    } else {
        sidebar.classList.add('show');
    }
});


(function() {
    function toggleSection(header) {
        var submenu = header.nextElementSibling;
        var menuState = JSON.parse(localStorage.getItem('menuState') || '{}');
        var menuKey = header.innerText.trim();
        if (submenu.style.display === "none" || submenu.style.display === "") {
            submenu.style.display = "block";
            menuState[menuKey] = 'block';
        } else {
            submenu.style.display = "none";
            menuState[menuKey] = 'none';
        }
        localStorage.setItem('menuState', JSON.stringify(menuState));
    }

    window.toggleSection = toggleSection; 

    window.onload = function() {
        var menuState = JSON.parse(localStorage.getItem('menuState') || '{}');
        var headers = document.querySelectorAll('.menu-header');
        headers.forEach(function(header, index) {
            var menuKey = header.innerText.trim();
            var submenu = header.nextElementSibling;
            if (menuState.hasOwnProperty(menuKey)) {
                submenu.style.display = menuState[menuKey];
            } else {
                submenu.style.display = 'none';
            }
        });
    };
})();


$(document).ready(function() {
    $('#offcanvas-close').on('click', function() {
        $('#offcanvas-menu').removeClass('show');
    });
});

document.addEventListener('DOMContentLoaded', function() {
    var form = document.querySelector('.namespace-search-form');
    if (form) {
        form.addEventListener('submit', function(e) {
            var input = form.querySelector('#bs-extendedsearch-input');
            if (input) {
                var namespace = mw.config.get('wgCanonicalNamespace');
                if (namespace && namespace.length > 0) {
                    input.value = namespace + ": " + input.value;
                }
            }
        });
    }
});

(function($) {
    'use strict';

    var css = [
        '#suggestion-box {',
        '    position: absolute;',
        '    top: 50px;  /* Adjust position */',
        '    left: 10px;  /* Adjust position */',
        '    border: 1px solid #ccc;',
        '    background-color: #fff;',
        '    z-index: 1000;',
        '}',
        '.suggestion-item {',
        '    padding: 8px;',
        '    cursor: pointer;',
        '}',
        '.suggestion-item:hover {',
        '    background-color: #e0e0e0;',
        '}'
    ].join('\n');
    $('head').append('<style type="text/css">' + css + '</style>');

    $('body').append('<div id="suggestion-box"></div>');

    function showSuggestions() {
        var query = $(this).val();
        if (query.length > 2) {
            var apiUrl = "/api.php?action=opensearch&search=" + encodeURIComponent(query) + "&namespace=0&limit=5&format=json";
            $.getJSON(apiUrl, function(data) {
                var suggestions = data[1];  // The suggestions are in the second element of the returned array
                $('#suggestion-box').empty();  // Clear previous suggestions
                $.each(suggestions, function(index, suggestion) {
                    var item = $('<div class="suggestion-item"></div>').text(suggestion);
                    $('#suggestion-box').append(item);
                });
            }).fail(function(jqxhr, textStatus, error) {
                console.error('Error fetching suggestions:', error);
            });
        }
    }

    $('.search-input').on('input', showSuggestions);

})(jQuery);