MediaWiki:Chameleon.js

Note: After publishing, you may have to bypass your browser's cache to see the changes.

Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
Opera: Press Ctrl-F5.

const mq = window.matchMedia("(max-width: 1105px)");

$('a.ca-history').html('History').addClass('mr-2');

(function($, mw) {

	$('<div>')
		.addClass('back-top')
		.html('<i class="fas fa-chevron-up"></i>')
		.appendTo('.bodyContent')
		.bind({
			click: function(e) {
				e.preventDefault();
				$('html, body').animate({
					scrollTop: "0"
				});
			}
		});

	$(window).scroll(function() {
		if ($(this).scrollTop()) {
			$('.back-top').css('visibility', 'visible');
		} else {
			$('.back-top').css('visibility', 'hidden');
		}
	});

})(jQuery, mw);

/**
 * Offset the target heading on the height of the fixed elements.
 */
! function(window) {
	'use strict';

	// Update this function so it returns the height of your fixed headers
	function fixedHeaderOffset() {
		if (mq.matches) {
			return 100;
		} else {
			return 50;
		}
	}

	// Run on first scroll (in case the user loaded a page with a hash in the url)
	window.addEventListener('scroll', onScroll);

	function onScroll() {
		window.removeEventListener('scroll', onScroll);
		scrollUpToCompensateForFixedHeader();
	}

	// Run on hash change (user clicked on anchor link)
	if ('onhashchange' in window) {
		window.addEventListener('hashchange', scrollUpToCompensateForFixedHeader);
	}

	function scrollUpToCompensateForFixedHeader() {
		var hash,
			target,
			offset;

		// Get hash, e.g. #mathematics
		hash = window.location.hash;
		if (hash.length < 2) {
			return;
		}

		// Get :target, e.g. &lt;h2 id="mathematics"&gt;...&lt;/h2&gt;
		target = document.getElementById(hash.slice(1));
		if (target === null) {
			return;
		}

		// Get distance of :target from top of viewport. If it's near zero, we assume
		// that the user was just scrolled to the :target.
		if (target.getBoundingClientRect().top < 2) {
			window.scrollBy(0, -fixedHeaderOffset());
		}
	}

}(window);