Voir la source de MediaWiki:Mobile.js

/* Le Javascript placé ici n'affectera que les utilisateurs du site mobile */


/**
 * Bouton pour afficher/masquer un contenu.
 * Idée de départ : http://encyclopediadramatica.com/MediaWiki:Common.js par WhiteMystery (misterioblanco@gmail.com)
 * Créateur : [[Utilisateur:Misdre]]
 * Licence : WTFPL ou Creative Commons Paternité 2.5 ou suivantes
 * Plus d'informations ici : [[Aide:Afficher et masquer du contenu]]
 */
 
// Attention, les méthodes déclarées dans Mobile.js ne sont pas de portée globale, MobileFrontEnd rajoute un niveau d'encapsulation.

var afficherMasquer  = function(ev) {
	var sourceAction = ev.currentTarget;
	var classeCible = sourceAction.getAttribute("name");
	var typeAction = sourceAction.getAttribute("value");
	var balises = document.getElementsByTagName('*');
	for ( var i = 0; i < balises.length; i++ ) {
		if ( $( balises[i] ).hasClass( classeCible ) ) {
			if ( typeAction == "afficher" ) {
				balises[i].style.display = '';
			}
			else {
				balises[i].style.display = "none";
			}
		}
	}

	var balisesBoutons = document.querySelectorAll('button:not(.masquage)');
	for ( var i = 0; i < balisesBoutons.length; i++ ) {
		var tmp;
		if ( balisesBoutons[i].getAttribute("value") == "afficher" && balisesBoutons[i].getAttribute("name") == classeCible) {
			if ( typeof(balisesBoutons[i].textContent) != "undefined") {
				tmp = balisesBoutons[i].textContent;
				balisesBoutons[i].textContent = balisesBoutons[i].getAttribute("title");
			}
			else {
				tmp = balisesBoutons[i].innerText;
				balisesBoutons[i].innerText = balisesBoutons[i].getAttribute("title");
			}
			balisesBoutons[i].setAttribute("title", tmp);
			balisesBoutons[i].setAttribute("value", "masquer");
		}
		else if ( balisesBoutons[i].getAttribute("value") == "masquer" && balisesBoutons[i].getAttribute("name") == classeCible) {
			if ( typeof(balisesBoutons[i].textContent) != "undefined") {
				tmp = balisesBoutons[i].textContent;
				balisesBoutons[i].textContent = balisesBoutons[i].getAttribute("title");
			}
			else {
				tmp = balisesBoutons[i].innerText;
				balisesBoutons[i].innerText = balisesBoutons[i].getAttribute("title");
			}
			balisesBoutons[i].setAttribute("title", tmp);
			balisesBoutons[i].setAttribute("value", "afficher");
		}
	}
};

function boutonsAfficherMasquer() {
	var balisesBoutons = document.querySelectorAll('button:not(.masquage)');
	var cibles = [];
	var nbPartiesCachees = 0;

	for ( var i = 0; i < balisesBoutons.length; i++ ) {
		// on cherche les boutons afficher-masquer dans la page
		// on trouve un bouton qui servira à afficher une partie cachée
		if ( balisesBoutons[i].getAttribute("value") == "afficher" ) {
			if ( !balisesBoutons[i].hasAttribute("title") || balisesBoutons[i].getAttribute("title") === "" )
				balisesBoutons[i].setAttribute("title", "[Masquer]");
			if ( typeof(balisesBoutons[i].textContent) != "undefined") {
				if ( balisesBoutons[i].textContent === "" )
					balisesBoutons[i].textContent = "[Afficher]";
			}
			else {
				if ( balisesBoutons[i].innerText === "" )
					balisesBoutons[i].innerText = "[Afficher]";
			}
			balisesBoutons[i].addEventListener("click", afficherMasquer);
			balisesBoutons[i].style.display = 'inline-block';
			nbPartiesCachees++;
			cibles[nbPartiesCachees-1] = balisesBoutons[i].getAttribute("name");
		}
		else if ( balisesBoutons[i].getAttribute("value") == "masquer" ) {
			if ( !balisesBoutons[i].hasAttribute("title") || balisesBoutons[i].getAttribute("title") === "" )
				balisesBoutons[i].setAttribute("title", "[Afficher]");
			if ( typeof(balisesBoutons[i].textContent) != "undefined") {
				if ( balisesBoutons[i].textContent === "" )
					balisesBoutons[i].textContent = "[Masquer]";
				}
			else {
				if ( balisesBoutons[i].innerText === "" )
					balisesBoutons[i].innerText = "[Masquer]";
			}
			balisesBoutons[i].addEventListener("click", afficherMasquer);
			balisesBoutons[i].style.display = 'inline-block';
		}
	}	

	// on cache les parties censées être cachées (celles ciblées par un bouton afficher)
	var balises = document.getElementsByTagName('*');
	for ( var i = 0; i < balises.length; i++ ) {
		for( var j = 0; j < cibles.length; j++ ) {
			if ( $( balises[i] ).hasClass( cibles[j] ) ) {
				balises[i].style.display = "none";
				break;
			}
		}
	}
}

jQuery( boutonsAfficherMasquer );

/* Animation de capacité */
jQuery( function(){
	var runAnimationElems = document.querySelectorAll(".run-animation");
	for(var i=0; i<runAnimationElems.length; i++) {
		if(runAnimationElems[i].parentNode.querySelector(".url-animation a")) {
			runAnimationElems[i].addEventListener("click", function() {
				this.innerHTML = "<small>Chargement en cours...</small>";
				this.parentNode.querySelector("a.image img").addEventListener("load", function() {
					this.parentNode.parentNode.querySelector(".run-animation").style.visibility="hidden";
				}),
				this.parentNode.querySelector("a.image").setAttribute("href", "/Fichier:"+this.parentNode.querySelector(".url-animation a").getAttribute("title"));
				this.parentNode.querySelector("a.image img").setAttribute("src", this.parentNode.querySelector(".url-animation a").getAttribute("href"));
			});
		}
	}
});