MediaWiki:Gadget-CollapsibleSidebar.js

(function($, mw) {
	$(function() {
		var commonImgUrl = 'https://zybkcn.com/images';
		var localImgUrl = 'https://zh.wikipedia.org/static/images/mobile/copyright/wikipedia-wordmark-';
		var imgLogoLang = ['ca', 'cs', 'cy', 'el', 'en', 'et', 'hi', 'hy', 'ja', 'ka', 'la', 'ru', 'szl', 'th', 'uk', 'uz', 'zh'].indexOf(mw.config.get('wgContentLanguage')) > -1 ? mw.config.get('wgContentLanguage') : 'en';
		var img = {
					logo: localImgUrl + imgLogoLang + '.svg',
					logo_zh_hans: localImgUrl + 'zh-hans.svg',
					next: commonImgUrl + '/9/95/Icons8_flat_next.svg',
					prev: commonImgUrl + '/b/bd/Icons8_flat_previous.svg/15px-Icons8_flat_previous.svg.png'
				};
		var isMobile = /(?:Android|iPad|iPhone|Mobile)/i.test(navigator.userAgent);
		var gadgetName = 'ext.gadget.CollapsibleSidebar';
		var sidebarHidden = false;
		var sidebarGadgetLoaded = false;

		function hideSidebar() {
			sidebarHidden = true;
			$('#sidebarCollapse').attr('src', img.next);
			updatePos();
			$('#content').css('margin-left', '1em');
			$('#footer').css('margin-left', '1em');
			if (mw.config.get('wgNoticeProject') !== 'wikipedia') $('#left-navigation').css('margin-left', '1em');
			$('#mw-panel').hide();
			$('#sliderCollapseLogo').show();
			mw.storage.set(gadgetName, 'hide')
		}

		function showSidebar() {
			sidebarHidden = false;
			$('#sidebarCollapse').attr('src', img.prev);
			updatePos();
			$('#content').css('margin-left', '');
			$('#footer').css('margin-left', '');
			if (mw.config.get('wgNoticeProject') !== 'wikipedia') $('#left-navigation').css('margin-left', '');
			$('#mw-panel').show();
			$('#sliderCollapseLogo').hide();
			mw.storage.set(gadgetName, 'show')
		}

		function updatePosHelper(arr) {
			var divList = ['#sidebarCollapse', '#sliderCollapseLogo'];
			for (var i = 0; i < arr.length; i++) {
				if (arr[i] === null) continue;
				var bDiv = divList[i];
				var bLeft = $(bDiv).css('left');
				var bSize = arr[i];
				if (bLeft !== bSize) $(bDiv).css('left', bSize)
			}
		}

		function updatePos() {
			var bWidth = 0;
			if (isMobile) {
				bWidth = window.outerWidth > 0 ? window.outerWidth : $('body').width
			} else {
				bWidth = window.innerWidth > 0 ? window.innerWidth : $('body').width
			}
			if (bWidth >= 982) {
				updatePosHelper(sidebarHidden ? ['0.3em', '3em'] : ['10.3em', null])
			} else {
				updatePosHelper(sidebarHidden ? ['0.3em', '2.5em'] : ['9.3em', null])
			}
		}

		function sidebarHiddenProc() {
			sidebarGadgetLoaded = true;

			var sidebarCollapse = $('<img>').attr({
				'id': 'sidebarCollapse',
				'src': img.prev
			}).css({
				'user-select': 'none',
				'position': 'fixed',
				'width': '0.8em',
				'top': '5.625em',
				'cursor': 'pointer',
				'padding': '0.3em',
				'border-radius': '50px',
				'border': '1px solid #a7d7f9',
				'background': '#fff'
			}).attr('draggable', 'false');

			var $mwLogo = $('.mw-wiki-logo');
			var newLink = $mwLogo.clone(false).empty().removeAttr('class').attr({
				'id': 'sidebarCollapseLink',
				'title': $mwLogo.attr('title')
			});

			if (mw.config.get('wgNoticeProject') === 'wikipedia') {
				var imgLogo = mw.config.get('wgContentLanguage') === 'zh' ? ['zh-cn', 'zh-hans', 'zh-my', 'zh-sg'].indexOf(mw.config.get('wgUserLanguage')) > -1 ? img.logo_zh_hans : img.logo : img.logo;
				$('<img>').attr({
					'id': 'sliderCollapseLogo',
					'src': imgLogo
				}).css({
					'display': 'none',
					'position': 'absolute',
					'top': '3.375em',
					'cursor': 'pointer',
					'width': '6em'
				}).appendTo(newLink);
			}

			sidebarCollapse.appendTo('#mw-navigation');
			newLink.appendTo('#mw-navigation');

			if (mw.storage.get(gadgetName) === 'hide') hideSidebar();
			updatePos();

			$(window).resize(function() {
				updatePos()
			});

			$('#sidebarCollapse').mouseover(function() {
				$(this).css('background', 'rgb(223, 245, 255)')
			}).mouseout(function() {
				$(this).css('background', 'white')
			}).click(function() {
				sidebarHidden ? showSidebar() : hideSidebar()
			})
		}

		function sidebarHiddenInit() {
			if (!$('body').hasClass('skin-vector-legacy')) return;
			if (['bo', 'dz'].indexOf(mw.config.get('wgContentLanguage')) > -1 || $('body').hasClass('rtl')) return;
			if ($('#mw-navigation').length === 0) {
				var obs = new MutationObserver(function(mutations, observer) {
					if (sidebarGadgetLoaded) return;
					for (var i = 0; i < mutations.length; i++) {
						for (var j = 0; j < mutations[i].addedNodes.length; j++) {
							if (mutations[i].addedNodes[j].id === 'mw-navigation') {
								sidebarHiddenProc();
								break;
							}
						}
					}
				});
				obs.observe(document.documentElement || document.body, {
					childList: true
				})
				return
			}
			sidebarHiddenProc()
		}
		sidebarHiddenInit()
	})
})(jQuery, mw);