MediaWiki:Gadget-scrollUpButton.js

Матеріал з Terraria Wiki
Перейти до навігації Перейти до пошуку

Увага: Після публікування слід очистити кеш браузера, щоб побачити зміни.

  • Firefox / Safari: тримайте Shift, коли натискаєте Оновити, або натисніть Ctrl-F5 чи Ctrl-Shift-R (⌘-R на Apple Mac)
  • Google Chrome: натисніть Ctrl-Shift-R (⌘-Shift-R на Apple Mac)
  • Internet Explorer / Edge: тримайте Ctrl, коли натискаєте Оновити, або натисніть Ctrl-F5
  • Opera: натисніть Ctrl-F5
var l10n = (function(){
	var $text = {
		navbuttontitle: {
			en: 'Return to Top',
			uk: 'Повернутися Нагору',
		},
		buttontitle: {
			en: 'Return to Top',
			uk: 'Повернутися Нагору',
		},
	};
	var $lang = mw.config.get( 'wgUserLanguage' ) || 'en';
	return function(key){
		return $text[key] && ($text[key][$lang] || $text[key].en) || '';
	};
})();

var navButton = (
	'<nav id="p-toTop" class="vector-menu mw-portlet vector-menu-portal portal">' + 
		'<h3 class="vector-menu-heading ">' + 
			'<span class="vector-menu-heading-label">' + l10n('navbuttontitle') + '</span>' + 
		'</h3>' + 
	'</nav>'
	);

function toTop() {
	$('html').animate( {scrollTop:0}, 500 );
}

$(document).ready( function() {

	// add nav button
	$('#mw-panel').append($(navButton));
	$('#p-toTop h3').click( toTop )

	// add bottom button
	$('body').append(
		$('<span></span>')
			.attr({
				id: 'b-toTop',
				class: 'to-top-hiden',
				title: l10n('buttontitle')
			}).click( toTop )
		);

	// toggle button visibility for different widths
	var isVisible = true;
	function checkVisibility() {
		if ( (window.innerWidth >= 1367) != isVisible ) { // value from https://terraria.wiki.gg/wiki/MediaWiki:Common.css : @media screen and (min-width: 1367px) {
			isVisible = !isVisible;
			$('#p-toTop, #b-toTop').toggleClass('to-top-hiden');
		}
	}
	checkVisibility()
	// when screen resized
	new ResizeObserver( checkVisibility ).observe( $('#content')[0] );

	// when nav panel changed -> if toTop button isn't at the end -> move toTop button to the end
	new MutationObserver( function() {
		if ( $('#mw-panel > *').last().attr('id') != 'p-toTop' ) {
			$('#mw-panel #p-toTop').remove();
			$('#mw-panel').append( isVisible ? navButton : $(navButton).toggleClass('to-top-hiden') );
			$('#p-toTop h3').click( toTop )
		}
	}).observe( $('#mw-panel')[0], {
		subtree: true,
		childList: true
	});

});