Alfie: 1 revision imported

2026-03-19T09:58:34Z

1 revision imported

← Older revision	Revision as of 05:58, 19 March 2026
(No difference)

en>Jon (WMF): Update to Codex markup

2024-01-30T20:40:16Z

Update to Codex markup

New page

/* _____________________________________________________________________________
* | |
* | === WARNING: GLOBAL GADGET FILE === |
* | Changes to this page affect many users. |
* | Please discuss changes on the talk page or on [[WT:Gadget]] before editing. |
* |_____________________________________________________________________________|
*
* Copied from [[meta:User:Brion VIBBER/mobile-sidebar.js]] as of last update (2014-10-13, [[meta:Special:Permalink/10185490]])
* See also https://github.com/brion/MediaWiki-MobileSidebar
*
* Mobile sidebar preview gadget
*
* Quick hack to show how pages look on mobile
* while browsing the desktop site.
*
* Brion Vibber <bvibber@wikimedia.org>
* 2014-10-10
* Cleaned up and enhanced by prtksxna
* Further cleaned up by Brion :D
*/
$(function () {

// Old iPhone size, the minimum we usually see
var width = 320, height = 480;

// @todo possibly make size selectable from some options...
// Note that pixel sizes are deceiving on mobile, as there's often a
// density factor. For instance 480x800 screens at 1.5x would cover
// only 320x533 or so. And let's not even get into the iPhone 6 Plus!

function showSidebar() {
localStorage['mw-mobile-sidebar-state'] = 'show';

var $content = $('#content');

var top = $content.position().top,
page = mw.config.get('wgPageName'),
src = '/wiki/' + encodeURIComponent(page) + '?useformat=mobile',
lang = mw.config.get('wgContentLanguage');

var $container = $('<div>').attr('id', 'mobile-sidebar');

var $mobileLink = $('<a>')
.text( 'Mobile' )
.addClass ( 'mobile_link' )
.attr( 'href', src )
.attr( 'target', '_blank')
.appendTo( $container );

var $egg = $( '<div>' )
.addClass( 'egg' )
.append(
$( '<img>' ).attr( 'src', 'https://upload.wikimedia.org/wikipedia/commons/thumb/8/81/Wikimedia-logo.svg/240px-Wikimedia-logo.svg.png' ),
$( '<p>' ).html( 'If lost please return to <a href="https://meta.wikimedia.org/wiki/User:Brion_VIBBER">Brion Vibber</a>' )
)
.appendTo( $container )
.hide();

// @todo detect scrollbars and compensate width
var $frame = $('<iframe>')
.attr('src', src)
.css('width', width + 'px')
.css('height', height + 'px')
.appendTo($container);

var $close = $('<a>')
.html(' ×')
.addClass('close')
.click( hideSidebar )
.appendTo( $container );

$container.on( 'dblclick', function () {
$egg.toggle();
$mobileLink.toggle();
$close.toggle();
$frame.toggle();
} );

var frame = $frame[0];
$frame.on('load',function () {
// avoid TypeError: null is not an object (evaluating 'frame.contentDocument.querySelector')
if(!frame.contentDocument) return;
// Compensate for scrollbars on browsers that add them
var scrollBarWidth = width - frame.contentDocument.querySelector('body').clientWidth;
if ( scrollBarWidth > 0 ) {
$frame.css( 'width', ( width + scrollBarWidth ) + 'px' );
}
// Handle link navigation within the mobile preview doc
$(frame.contentDocument).on('click', 'a', function (e) {
e.preventDefault();
if ($(this).attr('href') && $(this).attr('href').indexOf('#') !== 0) {
window.location = this.href;
}
});
});

if ( mw.config.get( 'skin' ) === 'vector-2022' && window.innerWidth >= 1800 && document.body.classList.contains( 'vector-feature-limited-width-enabled' ) ) {
// no need to shift content as Vector 2022 limited content width is enabled and active
} else {
$('#content').css('margin-right', '360px');
}
$('#content').after($container);
}

function hideSidebar() {
localStorage['mw-mobile-sidebar-state'] = 'hidden';
$('#mobile-sidebar').remove();
$('#content').css('margin-right', '0');
}

function toggleState() {
if (localStorage['mw-mobile-sidebar-state'] !== 'hidden') {
hideSidebar();
} else {
showSidebar();
}
}

if (mw.config.get('wgAction') == 'view') {

var item = mw.util.addPortletLink( 'p-views', '#', 'Mobile', 'ca-mobile', 'Toggle mobile view sidebar' );
if ( item ) {
item.classList.remove( 'vector-tab-noicon' );
if ( mw.config.get( 'skin' ) === 'vector-2022' ) {
item.querySelector('a').classList.add( 'cdx-button',
'cdx-button--fake-button',
'cdx-button--fake-button--enabled',
'cdx-button--weight-quiet',
'cdx-button--icon-only' );
} else {
item.classList.add( 'icon' );
}
$(item).click( toggleState );
}
if (localStorage['mw-mobile-sidebar-state'] == 'hidden') {
hideSidebar();
} else {
showSidebar();
}
}
});

MediaWiki:Gadget-mobile-sidebar.js - Revision history

Alfie: 1 revision imported

en>Jon (WMF): Update to Codex markup