wikimedia/mediawiki-skins-Vector
1
0
Fork 0
mirror of https://gerrit.wikimedia.org/r/mediawiki/skins/Vector.git synced 2024-12-01 02:37:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge "Revert "Sidebar: Collapses at lower resolutions""

Browse source
This commit is contained in:
jenkins-bot 2022-09-10 00:34:13 +00:00 committed by Gerrit Code Review
parent 2f25456534 475c237a5e
commit 77877254da
1 changed files with 2 additions and 57 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

59
resources/skins.vector.js/sidebarPersistence.js
View file

@ -11,18 +11,6 @@ var /** @type {MwApi} */api,
SIDEBAR_CHECKBOX_ID = 'mw-sidebar-checkbox', SIDEBAR_CHECKBOX_ID = 'mw-sidebar-checkbox',
SIDEBAR_PREFERENCE_NAME = 'VectorSidebarVisible'; SIDEBAR_PREFERENCE_NAME = 'VectorSidebarVisible';
/**
* Checks if persistent is enabled at current time.
* When a user is using a browser with a screen resolution of < 1000 it is assumed
* that it is preferred that the sidebar remains closed across page views, as otherwise
* it gets in the way of reading. More context at T316191.
*
* @return {boolean}
*/
function isPersistentEnabled() {
return window.innerWidth >= 1000;
}
/** /**
* Execute a debounced API request to save the sidebar user preference. * Execute a debounced API request to save the sidebar user preference.
* The request is meant to fire 1000 milliseconds after the last click on * The request is meant to fire 1000 milliseconds after the last click on
@ -58,60 +46,17 @@ function saveSidebarState( checkbox ) {
*/ */
function bindSidebarClickEvent( checkbox, button ) { function bindSidebarClickEvent( checkbox, button ) {
if ( checkbox instanceof HTMLInputElement && button ) { if ( checkbox instanceof HTMLInputElement && button ) {
var handler = saveSidebarState( checkbox ); checkbox.addEventListener( 'input', saveSidebarState( checkbox ) );
checkbox.addEventListener( 'input', function () {
if ( isPersistentEnabled() ) {
handler();
}
} );
}
}
/**
* Collapses the sidebar if screen resolution too small.
*
* @param {HTMLInputElement} checkbox
*/
function collapseSidebar( checkbox ) {
if ( checkbox.checked ) {
checkbox.checked = false;
saveSidebarState( checkbox )();
} }
} }
function init() { function init() {
var checkbox = /** @type {HTMLInputElement|null} */ ( var checkbox = window.document.getElementById( SIDEBAR_CHECKBOX_ID ),
window.document.getElementById( SIDEBAR_CHECKBOX_ID )
),
button = window.document.getElementById( SIDEBAR_BUTTON_ID ); button = window.document.getElementById( SIDEBAR_BUTTON_ID );
if ( mw.config.get( 'wgUserName' ) && !mw.config.get( 'wgVectorDisableSidebarPersistence' ) ) { if ( mw.config.get( 'wgUserName' ) && !mw.config.get( 'wgVectorDisableSidebarPersistence' ) ) {
bindSidebarClickEvent( checkbox, button ); bindSidebarClickEvent( checkbox, button );
} }
// If the user has resized their window, an open sidebar will be taking up lots of space
// so we should disable it.
// When this happens the user must expand it again manually, to avoid conflicts with multiple
// open windows (for example when an editor is viewing 2 articles side by side).
if ( checkbox ) {
var mediaQuery = window.matchMedia( '(max-width: 1000px)' );
var onMediaQueryChange = function ( /** @type {MediaQueryListEvent} */ event ) {
if ( event.matches ) {
// @ts-ignore we checked it already.
collapseSidebar( checkbox );
}
};
if ( mediaQuery.matches ) {
collapseSidebar( checkbox );
}
if ( mediaQuery.addEventListener ) {
mediaQuery.addEventListener( 'change', onMediaQueryChange );
} else {
// Before Safari 14, MediaQueryList is based on EventTarget,
// so you must use addListener() and removeListener() to observe media query lists.
mediaQuery.addListener( onMediaQueryChange );
}
}
} }
module.exports = { module.exports = {