Difference between revisions of "MediaWiki:Common.js"

Line 36: Line 36:
 
var $e = function (tag, text, classes, id) {
 
var $e = function (tag, text, classes, id) {
 
var d = document.createElement(tag);
 
var d = document.createElement(tag);
 +
var cl = d.classList;
 
if (classes !== undefined) {
 
if (classes !== undefined) {
d.classList.add(...classes);
+
classes.forEach( (c) => cl.add(c) );
 
}
 
}
 
if(id) {
 
if(id) {
Line 45: Line 46:
 
return d;
 
return d;
 
};
 
};
 +
// Function to streamline getElementById
 +
var $i = function (id, top) {
 +
if(top === undefined) {
 +
top = document;
 +
}
 +
return top.getElementById(id);
 +
};
 +
// Function to streamline querySelector
 +
var $q = function (query, top) {
 +
if(top === undefined) {
 +
top = document;
 +
}
 +
return top.querySelector(query);
 +
};
 +
// Function to streamline querySelectorAll
 +
var $a = function (query, top) {
 +
if(top === undefined) {
 +
top = document;
 +
}
 +
return top.querySelectorAll(query);
 +
};
 +
// Function to look up a CSS variable (not needed)
 +
/*var $v = function (variable) {
 +
return window.getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
 +
};*/
 +
// Function to set CSS variables
 
var $sv = function (variable, value) {
 
var $sv = function (variable, value) {
 
document.documentElement.style.setProperty(variable, value);
 
document.documentElement.style.setProperty(variable, value);
 
};
 
};

Revision as of 05:28, 28 November 2019

//
// TEXT SWAP-OUT ANIMATION
//
// Swappers have these two attributes.
var nexus = $( "input[data-swapper][data-swap-interval]" );
if(nexus.length) {
	// Check each swapper separately.
	nexus.each(function() {
		// Define variables inside here to hold stuff for the setInterval loop.
		var nex = $(this);
		var overlord = $( "#swap-override" );  // A checkbox to pause ALL swapping on a page
		var inverter = $( "#swap-inverter" );  // A checkbox to invert ALL animations (check to animate)
		var ident = nex.attr( "data-swapper" );     // Name
		var rep = nex.attr( "data-swap-interval" ); // Duration (in milliseconds)
		setInterval(function(){
			var x = nex.prop( "checked" );
			if(!overlord.prop( "checked" ) &&	(inverter.prop( "checked" ) ? x : !x) ) { // Pause when checked
				$( "[data-swap-nexus=" + ident + "]" ).each(function() {
					// Rotate out the text!
					var swap = $(this).attr( "data-swap" ).split( " " ),
					newText = swap.shift();
					swap.push( newText );
					$(this).text(newText).attr( "data-swap" , swap.join( " " ));
				});
			}
		}, rep);
	});
}


//
// OVERRIDE LINK TITLES (in certain circumstances)
//
$( "span[title][data-title-override] a[title]" ).removeAttr( "title" );

var $e = function (tag, text, classes, id) {
	var d = document.createElement(tag);
	var cl = d.classList;
	if (classes !== undefined) {
		classes.forEach( (c) => cl.add(c) );
	}
	if(id) {
		d.id = id;
	}
	d.textContent = (text || "");
	return d;
};
// Function to streamline getElementById
var $i = function (id, top) {
	if(top === undefined) {
		top = document;
	}
	return top.getElementById(id);
};
// Function to streamline querySelector
var $q = function (query, top) {
	if(top === undefined) {
		top = document;
	}
	return top.querySelector(query);
};
// Function to streamline querySelectorAll
var $a = function (query, top) {
	if(top === undefined) {
		top = document;
	}
	return top.querySelectorAll(query);
};
// Function to look up a CSS variable (not needed)
/*var $v = function (variable) {
	return window.getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
};*/
// Function to set CSS variables
var $sv = function (variable, value) {
	document.documentElement.style.setProperty(variable, value);
};