Space Station 14 Вики

MediaWiki:Common.js: различия между версиями

Интерактивная навигация по истории
← Предыдущая правкаСледующая правка →
мНет описания правки
мНет описания правки
Строка 1275: Строка 1275:
// wiki import end
// wiki import end


(function($, mw) {
;(function($, mw) {
     const COOKIE = 'ss14_wikiTheme';
     mw.loader.using('ext.gadget.theme').then(function() {
        const { loadTheme, initThemeMenu } = mw.themeUtils;


    function loadTheme() {
        function createSettingsDropdown(currentTheme) {
        return $.cookie(COOKIE) || 'normal';
            const $dropdown = $('<div>', { class: 'theme-dropdown' });
    }
            const $details = $('<details>', { id: 'theme-preferences-details', class: 'theme-dropdown-details' });
            const $summary = $('<summary>', { class: 'theme-dropdown-summary', 'data-tooltip-initialized': 'true' })
                .append($('<span>', { class: 'theme-icon theme-icon-settings' }));
            $details.append($summary);


    function saveTheme(theme) {
            const $window = $('<div>', { id: 'theme-preferences', class: 'theme-window' }).hide();
        $.cookie(COOKIE, theme, { expires: 365, path: '/' });
            const $header = $('<div>', {
    }
                id: 'theme-preferences__header',
                class: 'theme-window__header',
                text: 'Параметры'
            });
            $window.append($header);


    function applyTheme(theme) {
             const $content = $('<div>', {
        var $body = $(document.body);
                 id: 'theme-preferences__content',
        var existing = ($body.attr('class') || '').split(/\s+/).filter(function(c) {
                 class: 'theme-window__content'
            return c.indexOf('wgl-theme-') === 0;
        });
        if (existing.length) {
            $body.removeClass(existing.join(' '));
        }
        $body.addClass('wgl-theme-' + theme);
        mw.hook('wgl.themeChanged').fire(theme);
    }
 
    function initThemeMenu($container, currentTheme) {
        currentTheme = currentTheme || loadTheme();
 
        var $portlet = $('<div>', {
            class: 'mw-portlet mw-portlet-skin-client-prefs-skin-theme theme-menu',
            id: 'skin-client-prefs-skin-theme'
        });
        $portlet.append(
            $('<div>', { class: 'theme-menu__heading', text: 'Тема' }),
            $('<div>', { class: 'theme-menu__content' })
        );
 
        var $form = $('<form>');
        var options = [
             { key: 'light',  label: 'Светлая (beta)' },
            { key: 'normal', label: 'Стандартная' },
            { key: 'dark',  label: 'Тёмная' },
            { key: 'ss14',  label: 'Space Station 14' }
        ];
        options.forEach(function(opt) {
            var $wr = $('<div>', { class: 'theme-client-prefs-radio' });
            var $inp = $('<input>', {
                type:    'radio',
                name:    'theme-selection',
                 id:     'theme-value-' + opt.key,
                 value:  opt.key,
                checked: opt.key === currentTheme
            });
            var $lbl = $('<label>', {
                for:  'theme-value-' + opt.key,
                text:  opt.label
             });
             });
             $wr.append($inp, $lbl);
             $window.append($content);
            $form.append($wr);
        });


        $portlet.find('.theme-menu__content').append(
             initThemeMenu($content, currentTheme);
             $('<ul>', { class: 'theme-menu__content-list' }).append(
                $('<li>', { class: 'mw-list-item mw-list-item-js' }).append($form)
            )
        );
        $container.append($portlet);


        $form.on('change', 'input[name="theme-selection"]', function() {
            $dropdown.append($details, $window);
             var newTheme = $(this).val();
             $('#user-tools').append($dropdown);
            saveTheme(newTheme);
            applyTheme(newTheme);
        });
    }


    function createSettingsDropdown(currentTheme) {
            const $cover = $('#menus-cover');
        var $dropdown = $('<div>', { class: 'theme-dropdown' });
        var $details = $('<details>', { id: 'theme-preferences-details', class: 'theme-dropdown-details' });
        var $summary = $('<summary>', { class: 'theme-dropdown-summary', 'data-tooltip-initialized': 'true' })
            .append($('<span>', { class: 'theme-icon theme-icon-settings' }));
        $details.append($summary);


        var $window = $('<div>', { id: 'theme-preferences', class: 'theme-window' }).hide();
            $details.on('toggle', function() {
        var $header = $('<div>', { id: 'theme-preferences__header', class: 'theme-window__header', text: 'Параметры' });
                const isOpen = $(this).prop('open');
        $window.append($header);
                $window.toggle(isOpen);


        var $content = $('<div>', { id: 'theme-preferences__content', class: 'theme-window__content' });
                if ($cover.length) {
        $window.append($content);
                    $cover.css('display', isOpen ? 'block' : 'none');
                }
            });


        initThemeMenu($content, currentTheme);
            $(document).on('click', function(e) {
                const isClickInside = $(e.target).closest('.theme-window, .theme-dropdown-summary').length > 0;
                if (!isClickInside && $details.prop('open')) {
                    $details.removeAttr('open');
                    if ($cover.length) {
                        $cover.css('display', 'none');
                    }
                }
            });
        }


         $dropdown.append($details, $window);
         function init() {
        $('#user-tools').append($dropdown);
            const theme = loadTheme();
            createSettingsDropdown(theme);
        }


         var $cover = $('#menus-cover');
         $(function() {
        $details.on('toggle', function() {
             setTimeout(init, 200);
             var open = $(this).prop('open');
            $window.toggle(open);
            if ($cover.length) {
                $cover.css('display', open ? 'block' : 'none');
            }
        });
        $(document).on('click', function(e) {
            var inside = $(e.target).closest('.theme-window, .theme-dropdown-summary').length;
            if (!inside && $details.prop('open')) {
                $details.removeAttr('open');
                if ($cover.length) { $cover.hide(); }
            }
         });
         });
    }
    mw.themeUtils = {
        loadTheme: loadTheme,
        applyTheme: applyTheme,
        initThemeMenu: initThemeMenu,
        createSettingsDropdown: createSettingsDropdown
    };
    $(function() {
        var theme = loadTheme();
        applyTheme(theme);
        createSettingsDropdown(theme);
     });
     });
})(jQuery, mediaWiki);
}(jQuery, mediaWiki));
Источник — https://station14.ru/wiki/MediaWiki:Common.js