/**
* Hide Vector sidebar
* http://en.wikipedia.org/wiki/User:PleaseStand/Hide_Vector_sidebar
*
* Originally imported from revision 365211954 as of 2010-06-01 from
* [[User:Nihiltres/nothingthree.js]]. It has had some modification from that
* version to isolate it within the script collection and further improve it.
*
* Copyright 2010 Wikipedia user Nihiltres
* Copyright 2010-2012 Wikipedia user PleaseStand
*
* Licensed under the Creative Commons Attribution-Share-Alike 3.0 Unported License and
* the GNU Free Documentation License (unversioned); pick the license(s) of your choice.
*
* http://creativecommons.org/licenses/by-sa/3.0/
* http://www.gnu.org/copyleft/fdl.html
*/
mw.loader.load( '//en.wikipedia.org/w/index.php?title=User:PleaseStand/sidebarToggle.css&action=raw&ctype=text/css', 'text/css' );
(function( $, undefined ) {
"use strict";
/**
* Messages displayed by this script (in English).
* Any translations (see below) replace these at runtime.
*/
var msg = {
toggleTabText: 'Toggle sidebar',
toggleTabTitle: 'Hide or show the sidebar'
};
/**
* Translations for messages displayed by this script.
* To have your translations added, please contact this script's maintainer.
*/
var translations = {
fa: {
toggleTabText: 'تغییر وضعیت نوار سمت راست',
toggleTabTitle: 'مخفی یا نمایش نوار سمت راست',
}
};
/**
* The text direction of the page.
*/
var dir = 'ltr';
/**
* The current (or default) state of the sidebar.
*/
var state = 'collapsed';
/**
* A cache of jQuery objects.
*/
var nodes = {};
/**
* Equivalent CSS property names for RTL pages.
*/
var cssRTLProps = {
'left': 'right',
'margin-left': 'margin-right'
};
/**
* Changes the CSS property name as appropriate for the page's text direction.
* @param prop {string} The CSS property name to be changed.
*/
function flipCSSProp(prop) {
if ( dir === 'rtl' && cssRTLProps[prop] ) {
return cssRTLProps[prop];
}
return prop;
}
/**
* Loads the current state from sessionStorage (preferred) or localStorage.
* If there is no item in storage, this function does nothing.
*/
function loadState() {
state = ( window.sessionStorage && sessionStorage.getItem( 'sidebarToggle' ) ) ||
( window.localStorage && localStorage.getItem( 'sidebarToggle' ) ) ||
state;
}
/**
* Saves the current state in both sessionStorage and localStorage.
*/
function saveState() {
if ( window.sessionStorage ) {
sessionStorage.setItem( 'sidebarToggle', state );
}
if ( window.localStorage ) {
localStorage.setItem( 'sidebarToggle', state );
}
}
/**
* Reacts to a click on the "Toggle sidebar" button.
*/
function toggle() {
if ( state === 'collapsed' ) {
expand( 400 );
} else {
collapse( 400 );
}
saveState();
}
/**
* Collapses the sidebar.
* @param duration {mixed} Animation duration passed to jQuery.
*/
function collapse( duration ) {
var animations = {
mwPanelIE: {},
mwPanelNonIE: {opacity: 0},
notSidebar: {},
leftNavigation: {}
};
animations.mwPanelIE[ flipCSSProp( 'left' ) ] = '-10em';
animations.mwPanelNonIE[ flipCSSProp( 'left' ) ] = '-10em';
animations.notSidebar[ flipCSSProp( 'margin-left' ) ] = 0;
animations.leftNavigation[ flipCSSProp( 'left' ) ] = '1em';
nodes.$mwPanel.animate( animations.mwPanelNonIE, duration, function() {
nodes.$mwPanel.css( 'visibility', 'hidden' );
});
nodes.$notSidebar.animate( animations.notSidebar, duration, function() {
nodes.$content.css( 'background-image', 'none' );
});
nodes.$leftNavigation.animate( animations.leftNavigation, duration);
state = 'collapsed';
}
/**
* Expands the sidebar.
* @param duration {mixed} Animation duration passed to jQuery.
*/
function expand( duration ) {
nodes.$mwPanel.css( 'visibility', '' );
var animations = {
mwPanelIE: {},
mwPanelNonIE: {opacity: 1},
notSidebar: {},
leftNavigation: {}
};
animations.mwPanelIE[ flipCSSProp( 'left' ) ] = '-0.01em';
animations.mwPanelNonIE[ flipCSSProp( 'left' ) ] = 0;
animations.notSidebar[ flipCSSProp( 'margin-left' ) ] = '10em';
animations.leftNavigation[ flipCSSProp( 'left' ) ] = '10em';
nodes.$mwPanel.animate( animations.mwPanelNonIE, duration );
nodes.$content.css( 'background-image', '' );
nodes.$notSidebar.animate( animations.notSidebar, duration );
nodes.$leftNavigation.animate( animations.leftNavigation, duration );
state = 'expanded';
}
/**
* Called when the DOM is ready for manipulation.
*/
function ready() {
// Populate jQuery object cache.
nodes.$mwPanel = $( '#mw-panel' );
nodes.$content = $( '#content' );
nodes.$notSidebar = $( '#content, #mw-head-base, #footer' );
nodes.$leftNavigation = $( '#left-navigation' );
// Show the toggle tab.
$( '<a id="ca-sidebar"></a>' )
.prop( 'accessKey', 'a' )
.prop( 'title', msg.toggleTabTitle )
.text( msg.toggleTabText )
.click( toggle )
.insertBefore( '#p-personal' );
// Respect the saved state.
if ( state === 'collapsed' ) {
collapse( 0 );
}
}
/**
* Initialization code
*/
function main() {
if ( mw.config.get( 'skin' ) !== 'vector' ) {
return;
}
// Load translations and saved state.
dir = document.documentElement.dir;
$.extend( msg, translations[document.documentElement.lang] );
loadState();
$( ready );
}
mw.loader.using( 'jquery.client', main );
})( jQuery );