MediaWiki:IPadSidbarSlider.js
Jump to navigation
Jump to search
Note: After saving, you have to bypass your browser's cache to see the changes. Internet Explorer: press Ctrl-F5, Mozilla: hold down Shift while clicking Reload (or press Ctrl-Shift-R), Opera/Konqueror: press F5, Safari: hold down Shift + Alt while clicking Reload, Chrome: hold down Shift while clicking Reload.
Documentation for this user script can be added at MediaWiki:IPadSidbarSlider. |
/**
* iPad Sidebar Slider
* Created on June 16th, 2010
*
* see also: MediaWiki:Adjust4iPad.js, https://phabricator.wikimedia.org/T16501
* TODO: support RTL-Languages, provide as a gadget
*
* @rev 16 (2017-10-07)
* @author Krinkle
*/
$(function () {
// Dont ignore non-iPads (yet)
// if (navigator.userAgent.match(/iPad/i) == null) return;
window.iPadSidebarCustomOut = function () {
$('#mw-panel').animate({
width: 'hide'
});
$('#left-navigation').animate({
'left': '1em'
});
$('#content,#footer').animate({
'marginLeft': '1em'
});
};
window.iPadSidebarCustomIn = function () {
$('#mw-panel').animate({
width: 'show'
});
$('#left-navigation').animate({
'left': '10em'
});
$('#content,#footer').animate({
'marginLeft': '10em'
});
};
//Initalize
$('#mw-panel').hide();
$('#left-navigation').css('left', '1em');
$('#content,#footer').css('marginLeft', '1em');
$('body').append('<div id="kr-panel-toggle" style="width:28px;height:28px;background:white url(//upload.wikimedia.org/wikipedia/commons/thumb/e/e2/Nuvola_single_chevron_right.svg/21px-Nuvola_single_chevron_right.svg.png) center no-repeat;border:2px solid #f3f3f3;position:fixed;left:-5px;top:30%;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px"></div>');
$('#kr-panel-toggle').on('mouseenter', function () {
$(this).css('cursor', 'pointer');
}).on('mouseleave', function () {
$(this).css('cursor', 'default');
});
$('#kr-panel-toggle').on('click', function () {
if ($(this).hasClass('go-out')) {
iPadSidebarCustomOut();
$(this).removeClass('go-out').addClass('go-in').animate({
'left': '-5px'
}).css('background-image', 'url(//upload.wikimedia.org/wikipedia/commons/thumb/e/ee/1rightarrow_blue.svg/21px-1rightarrow_blue.svg.png)');
} else {
iPadSidebarCustomIn();
$(this).removeClass('go-in').addClass('go-out').animate({
'left': '9em'
}).css('background-image', 'url(//upload.wikimedia.org/wikipedia/commons/thumb/d/d6/1leftarrow_blue.svg/21px-1leftarrow_blue.svg.png)');
}
});
});