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

мНет описания правки
мНет описания правки
Строка 1: Строка 1:
;(function($, mw, rs){
;(function($, mw, rs){
if (mw.config.get('wgPageName') !== 'Обсуждение_участника:Pok') return;
    // Only run on specific page
    if (mw.config.get('wgPageName') !== 'Обсуждение_участника:Pok') return;
var DARK_COOKIE = 'darkmode',
STICKY_HEADER_COOKIE = 'stickyheader',
THEME_COOKIE = 'theme',
fixedWidthEnabled = $.cookie('readermode') === 'true',
theme = $.cookie(THEME_COOKIE) || ($.cookie(DARK_COOKIE) === 'true' ? 'dark' : 'light'),
stickySwitch,
closeButton,
settingsPortletLink,
themePopup;


var self = {
    var DARK_COOKIE = 'darkmode',
init: function () {
        STICKY_HEADER_COOKIE = 'stickyheader',
self.createThemeButton();
        THEME_COOKIE = 'theme',
self.createSettingsButton();
        fixedWidthEnabled = $.cookie('readermode') === 'true',
self.createFixedWidthToggle();
        theme = $.cookie(THEME_COOKIE) || ($.cookie(DARK_COOKIE) === 'true' ? 'dark' : 'light'),
if ( $.cookie(THEME_COOKIE) == null ) {
        themePopup;
$.cookie(THEME_COOKIE, theme, {expires: 365, path: '/'});
}
},


createThemeButton: function() {
    var self = {
// Add the theme toggle button inside #user-tools
        init: function () {
themePortletLink = mw.util.addPortletLink(
            self.createThemeButton();
'user-tools',
            self.createSettingsButton();
'',
            self.createFixedWidthToggle();
'pt-theme-toggle',
            // Initialize theme cookie if absent
'Change theme',
            if (!$.cookie(THEME_COOKIE)) {
null,
                $.cookie(THEME_COOKIE, theme, { expires: 365, path: '/' });
'#user-tools'
            }
);
        },
$(themePortletLink).find('a')
.addClass('oo-ui-icon-advanced')
.on('click', function(e) {
e.preventDefault();
if (!themePopup) {
mw.loader.using(['oojs-ui-core','oojs-ui-windows','oojs-ui-widgets']).then(self.buildThemePopup);
} else {
themePopup.toggle();
}
});
},


buildThemePopup: function() {
        /**
var themeSwitch = new OO.ui.ButtonSelectWidget({
        * Create a theme toggle button inside #user-tools
items: [
        */
new OO.ui.ButtonOptionWidget({data: 'light', label: 'Light'}),
        createThemeButton: function() {
new OO.ui.ButtonOptionWidget({data: 'dark', label: 'Dark'})
            var $container = $('#user-tools');
]
            if (!$container.length) return;
});
themeSwitch.selectItemByData(theme);
themeSwitch.on('choose', function() {
theme = themeSwitch.findSelectedItem().getData();
$.cookie(THEME_COOKIE, theme, {expires: 365, path: '/'});
self.applyTheme(theme);
});


themePopup = new OO.ui.PopupWidget({
            var $button = $('<a>', {
$content: themeSwitch.$element,
                href: '#',
$floatableContainer: $(themePortletLink),
                id: 'pt-theme-toggle',
autoClose: true
                title: 'Change theme'
});
            }).addClass('oo-ui-icon-advanced')
$(document.body).append(themePopup.$element);
              .on('click', function(e) {
themePopup.toggle(true);
                  e.preventDefault();
},
                  if (!themePopup) {
                      mw.loader.using(['oojs-ui-core', 'oojs-ui-windows', 'oojs-ui-widgets']).then(self.buildThemePopup);
                  } else {
                      themePopup.toggle();
                  }
              });


applyTheme: function(name) {
            $container.append($button);
$('body').removeClass(function(i, cls) {
        },
return (cls.match(/wgl-theme-\S+/g) || []).join(' ');
});
if (name !== 'light') {
mw.loader.using(['wgl.theme.' + name]).then(function() {
$('body').addClass('wgl-theme-' + name);
});
}
},


toggleFixedWidth: function () {
        /**
fixedWidthEnabled = !fixedWidthEnabled;
        * Build the theme selection popup
if (fixedWidthEnabled) {
        */
$('body').addClass('wgl-fixedWidth');
        buildThemePopup: function() {
mw.loader.load('wg.fixedwidth');
            var themeSwitch = new OO.ui.ButtonSelectWidget({
} else {
                items: [
$('body').removeClass('wgl-fixedWidth');
                    new OO.ui.ButtonOptionWidget({ data: 'light', label: 'Light' }),
}
                    new OO.ui.ButtonOptionWidget({ data: 'dark', label: 'Dark' })
$.cookie('readermode', fixedWidthEnabled, {expires: 365, path: '/'});
                ]
},
            });
            themeSwitch.selectItemByData(theme);
            themeSwitch.on('choose', function() {
                theme = themeSwitch.findSelectedItem().getData();
                $.cookie(THEME_COOKIE, theme, { expires: 365, path: '/' });
                self.applyTheme(theme);
            });


createFixedWidthToggle: function() {
            themePopup = new OO.ui.PopupWidget({
var link = mw.util.addPortletLink('p-personal', '', '', 'pt-fixed-width', 'Toggle fixed-width mode');
                $content: themeSwitch.$element,
$(link).find('a').on('click', function(e) {
                $floatableContainer: $('#pt-theme-toggle'),
e.preventDefault();
                autoClose: true
self.toggleFixedWidth();
            });
});
            $(document.body).append(themePopup.$element);
},
            themePopup.toggle(true);
        },


createSettingsButton: function() {
        /**
settingsPortletLink = mw.util.addPortletLink('p-personal', '', '', 'pt-settings', 'Appearance settings');
        * Apply the selected theme class to <body>
$(settingsPortletLink).find('a').on('click', function(e) {
        */
e.preventDefault();
        applyTheme: function(name) {
mw.loader.using(['oojs-ui-core','oojs-ui-windows','oojs-ui-widgets']).then(self.openSettingsModal);
            $('body').removeClass(function(i, cls) {
});
                return (cls.match(/wgl-theme-\S+/g) || []).join(' ');
},
            });
            if (name !== 'light') {
                mw.loader.using(['wgl.theme.' + name]).then(function() {
                    $('body').addClass('wgl-theme-' + name);
                });
            }
        },


openSettingsModal: function() {
        /**
var stickySwitch = new OO.ui.ToggleSwitchWidget({value: $.cookie(STICKY_HEADER_COOKIE)==='true'});
        * Toggle fixed-width mode
stickySwitch.on('change', function() {
        */
$.cookie(STICKY_HEADER_COOKIE, stickySwitch.getValue(), {expires:365, path:'/'});
        toggleFixedWidth: function () {
});
            fixedWidthEnabled = !fixedWidthEnabled;
            if (fixedWidthEnabled) {
                $('body').addClass('wgl-fixedWidth');
                mw.loader.load('wg.fixedwidth');
            } else {
                $('body').removeClass('wgl-fixedWidth');
            }
            $.cookie('readermode', fixedWidthEnabled, { expires: 365, path: '/' });
        },


var closeBtn = new OO.ui.ButtonInputWidget({label: 'Close', flags: 'destructive'});
        /**
        * Create toggle link for fixed-width in personal portlet
var $content = $('<div>').append(
        */
$('<h3>').text('Sticky header'),
        createFixedWidthToggle: function() {
stickySwitch.$element,
            var link = mw.util.addPortletLink('p-personal', '#', '', 'pt-fixed-width', 'Toggle fixed-width mode');
closeBtn.$element
            $(link).on('click', function(e) {
);
                e.preventDefault();
                self.toggleFixedWidth();
            });
        },


rs.createOOUIWindow('settings', 'Appearance settings', {size:'medium'}, function(modal){
        /**
modal.$body.append($content);
        * Create Appearance Settings button in personal portlet
closeBtn.on('click', function(){ window.OOUIWindowManager.closeWindow(modal); });
        */
}, true);
        createSettingsButton: function() {
}
            var link = mw.util.addPortletLink('p-personal', '#', '', 'pt-settings', 'Appearance settings');
};
            $(link).on('click', function(e) {
                e.preventDefault();
                mw.loader.using(['oojs-ui-core', 'oojs-ui-windows', 'oojs-ui-widgets']).then(self.openSettingsModal);
            });
        },


mw.loader.using(['ext.gadget.rsw-util'], function(){
        /**
$(self.init);
        * Open modal for appearance settings (sticky header)
});
        */
        openSettingsModal: function() {
            var stickySwitch = new OO.ui.ToggleSwitchWidget({ value: $.cookie(STICKY_HEADER_COOKIE) === 'true' });
            stickySwitch.on('change', function() {
                $.cookie(STICKY_HEADER_COOKIE, stickySwitch.getValue(), { expires: 365, path: '/' });
            });
 
            var closeBtn = new OO.ui.ButtonInputWidget({ label: 'Close', flags: 'destructive' });
            var $content = $('<div>').append(
                $('<h3>').text('Sticky header'),
                stickySwitch.$element,
                closeBtn.$element
            );
 
            rs.createOOUIWindow('settings', 'Appearance settings', { size: 'medium' }, function(modal) {
                modal.$body.append($content);
                closeBtn.on('click', function() { window.OOUIWindowManager.closeWindow(modal); });
            }, true);
        }
    };
 
    // Initialize on DOM ready
    mw.loader.using(['ext.gadget.rsw-util'], function(){ $(self.init); });


}(jQuery, mediaWiki, rswiki));
}(jQuery, mediaWiki, rswiki));