User:Jitrixis/mba.js

Note: After saving, you have to bypass your browser's cache to see the changes. Internet Explorer: press Ctrl-F5, Mozilla: hold down Shift while clicking Reload (or press Ctrl-Shift-R), Opera/Konqueror: press F5, Safari: hold down Shift + Alt while clicking Reload, Chrome: hold down Shift while clicking Reload.

Documentation for this user script can be added at User:Jitrixis/mba. This user script seems to have an accompanying .css page at User:Jitrixis/mba.css.

( function ( mw, $ ) {

	/*
	 * Start the application (only if it's a category)
	 */
	if(mw.config.values.wgCanonicalNamespace != "File"){
		return false;
	}
	
	importStylesheet("User:Jitrixis/mba.css");
	
	$( document ).ready( init );
	
	function init(){
		createModal();
		createPortlet();
	}
	
	function createPortlet(){
		var portletId, portletLink;
 
		switch(mw.config.get( 'skin' )){
			case "cologneblue":
				portletId = 'p-pageoptions'; 
				break;
			case "modern":
			case "monobook":
			case "vector":
				portletId = 'p-tb';
				break;
		}
 
		portletLink = mw.util.addPortletLink( portletId, '#', "Musée des Beaux-Arts de Lyon", 't-mbalyon' );
		
		$( portletLink ).click( function () {
			$( 'div#mbalyon' ).dialog( 'open' );
			contentReset();
			return false;
		} );
	}
	
	function createModal(){
		var modalContent = '<div id="mbalyon"></div>"';
		
		var modalExec;
		if ( document.getElementById( 'content' ) ) {
			modalExec = $( modalContent ).appendTo( '#content' );
		} else {
			modalExec = $( modalContent ).appendTo( '#mw_content' );
		}
	
		mw.loader.using( ['jquery.ui'], function () {
			modalExec.dialog( {
				title: 'Musée des Beaux-Arts de Lyon',
				autoOpen: false,
				modal: true,
				width: 900,
				height: 600,
				show: 'blind',
				hide: 'blind',
				buttons: [ {
					text: "Reset",
					click: function () {
						contentReset();
					}
				}, {
					text: "Close",
					click: function () {
						$( this ).dialog( 'close' );
					}
				} ]
			} );
		});
	}
	
	function contentReset(){
		contentSelectTemplate();
	}
	
	function contentSelectTemplate(){
		var html = '<div class="mba-template" id="mba-t-2d"><h2>&OElig;uvre 2D</h2><p>Tableaux sans cadres.</p></div>' +
		'<div class="mba-template" id="mba-t-3d"><h2>&OElig;uvre 3D</h2><p>Tableaux avec cardres, sculptures et objets d\'arts.</p></div>';
		
		$("#mbalyon").empty().html(html);
		
		$("#mba-t-2d").click(function(){
			contentSelect2D();
		});
		
		$("#mba-t-3d").click(function(){
			contentSelect3D();
		});
	}
	
	function contentSelect2D(){
		
	}
	
	function contentSelect3D(){
		
	}

} ( mediaWiki, jQuery ) );