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

Интерактивная навигация по истории

← Предыдущая правка Следующая правка →

@@ Строка 1274: / Строка 1274: @@
 } );
 // wiki import end
+;(function($, mw){
+    const COOKIE = 'ss14_wikiTheme';
+    function loadTheme() {
+        return $.cookie(COOKIE) || 'normal';
+    }
+    function saveTheme(theme) {
+        $.cookie(COOKIE, theme, { expires: 365, path: '/' });
+    }
+    function applyTheme(theme) {
+        $('body')
+            .removeClass('wgl-theme-normal wgl-theme-light wgl-theme-dark')
+            .addClass(`wgl-theme-${theme}`);
+        mw.hook('wgl.themeChanged').fire(theme);
+    }
+    function initThemeMenu($container) {
+        const currentTheme = loadTheme();
+        const $portlet = $('<div>', {
+            class: 'mw-portlet mw-portlet-skin-client-prefs-skin-theme mw-portlet-js theme-menu',
+            id: 'skin-client-prefs-skin-theme'
+        });
+        $portlet.append(
+            $('<div>', { class: 'theme-menu__heading', text: 'Тема' }),
+            $('<div>', { class: 'theme-menu__content' })
+        );
+        const $form = $('<form>');
+        [
+            { key: 'light',  label: 'Светлая (beta)' },
+            { key: 'normal', label: 'Стандартная' },
+            { key: 'dark',   label: 'Тёмная' }
+        ].forEach(opt => {
+            const $wr = $('<div>', { class: 'theme-client-prefs-radio' });
+            const $inp = $('<input>', {
+                type: 'radio',
+                name: 'theme-selection',
+                id:   `theme-value-${opt.key}`,
+                value: opt.key,
+                checked: opt.key === currentTheme
+            });
+            const $lbl = $('<label>', {
+                for:  `theme-value-${opt.key}`,
+                text: opt.label
+            });
+            $wr.append($inp, $lbl);
+            $form.append($wr);
+        });
+        $portlet.find('.theme-menu__content').append(
+            $('<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() {
+            const newTheme = $(this).val();
+            saveTheme(newTheme);
+            applyTheme(newTheme);
+        });
+    }
+    mw.themeUtils = mw.themeUtils || {};
+    mw.themeUtils.initThemeMenu = initThemeMenu;
+}(jQuery, mediaWiki));
+;(function($, mw){
+    const { loadTheme, initThemeMenu } = mw.themeUtils;
+    function createSettingsDropdown(currentTheme) {
+        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);
+        const $window = $('<div>', { id: 'theme-preferences', class: 'theme-window' }).hide();
+        const $header = $('<div>', {
+            id: 'theme-preferences__header',
+            class: 'theme-window__header',
+            text: 'Параметры'
+        });
+        $window.append($header);
+        const $content = $('<div>', {
+            id: 'theme-preferences__content',
+            class: 'theme-window__content'
+        });
+        $window.append($content);
+        initThemeMenu($content, currentTheme);
+        $dropdown.append($details, $window);
+        $('#user-tools').prepend($dropdown);
+        $details.on('toggle', function() {
+            $(this).prop('open') ? $window.show() : $window.hide();
+        });
+    }
+    function init() {
+        if (mw.config.get('wgPageName') !== 'Обсуждение_участника:Pok') return;
+        const theme = loadTheme();
+        createSettingsDropdown(theme);
+    }
+    $(init);
+}(jQuery, mediaWiki));