Jump to content

User:Jdlrobson/vector-max-width-toggle.js

From Wikipedia, the free encyclopedia
This is an old revision of this page, as edited by Jdlrobson (talk | contribs) at 22:40, 23 October 2021. The present address (URL) is a permanent link to this revision, which may differ significantly from the current revision.
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
/**
 * Usage instructions: mw.loader.getScript('https://en.wikipedia.org/w/index.php?title=User:Jdlrobson/vector-max-width-toggle.js&action=raw&ctype=text/javascript');
 */
$(function(){
    var lastValue;
    try {
        lastValue = localStorage.getItem('max-width-on') || '0';
    } catch (e) {
        lastValue = '0';
    }

    if (lastValue === '1') {
        $(document.body).toggleClass('skin-vector-max-width');
    }


    var originalMaxWidth = $('.mw-content-container').css('max-width')

    var $switcher = $('<div style="position:absolute;right:0;top:0;background-image: url(/media/wikipedia/commons/2/28/Font_Awesome_5_solid_window-maximize.svg);width: 40px;height: 40px;background-size: 20px;background-position: top right;background-repeat: no-repeat;"></div>')
        .on('click', function() {
            $(document.body).toggleClass('skin-vector-max-width');
            localStorage.setItem('max-width-on', lastValue === '0' ? '1' : '0');
            var currentMaxWidth = $('.mw-content-container').css('max-width')
            $('.mw-content-container').css('max-width', currentMaxWidth === 'none' ? originalMaxWidth : 'none')
        } ).prependTo('#content');

    $('#content').css('position', 'relative');

    // no click mode
    $('.vector-menu-checkbox').on('mouseover', function ( ev ) {

        $('.vector-menu-checkbox').prop('checked', false);
         ev.target.checked = true;
    });

    $('.vector-menu:not(.vector-menu-dropdown)').on('mouseover', function () {
        $('.vector-menu-checkbox').prop('checked', false);
    });
});