MediaWiki:Gadget-spriteEditLoader.js

$( function() {
'use strict';

var i18n = {
	editSprites: 'Edit sprite'
};

/**
 * Add an edit button which loads the sprite editor
 *
 * If spriteaction=edit is in the URL, the editor will be loaded
 * immediately, otherwise it will wait for the button to be clicked.
 */
var editPage = $( '#sprite-editor-message' ).data( 'page' ) || null;
if ( !$( '#spritedoc' ).length && !editPage ) {
	return;
}

var $spriteEditLink = mw.util.addPortletLink( 'p-cactions', mw.util.getUrl() + '?spriteaction=edit', i18n.editSprites, 'ca-spriteedit' );
var $spriteEditTab = $($spriteEditLink).addClass('collapsible').insertAfter('#ca-edit');

var tooltips;
$( '.custom-side-tool' ).mouseenter( function() {
	var topPosition = ( $( this ).offset().top - $( document ).scrollTop() + 20 ) + 'px';
	var leftPosition = ( $( this ).offset().left + 50 ) + 'px';
	var tooltip = $( '<div>', {
		class: 'wds-tooltip is-right',
		css: {
			left: leftPosition,
			top: topPosition
		},
		text: $( this ).data( 'wds-tooltip-name' )
	} );
	$( 'body' ).append( tooltip );
	tooltips = tooltip;
} );
$( '.custom-side-tool' ).mouseleave( function() {
	var a = tooltips;
	tooltips = undefined;
	if ( a ) {
		a.remove();
	}
} );

// Page to sprite edit is not here, so no need to bind events
if ( editPage ) {
	return;
}

var loadSpriteEditor = function() {
	$spriteEditTab.add( '#ca-view' ).toggleClass( 'selected' );
	
	return mw.loader.using( 'ext.gadget.spriteEdit' );
};
if ( location.search.match( '[?&]spriteaction=edit' ) ) {
	loadSpriteEditor();
	return;
}

var $win = $( window );
$spriteEditLink.one( 'click.spriteEditLoader', function( e ) {
	// Initially add the history so it is not delayed waiting
	// for the editor to load. The editor will handle it from now.
	history.pushState( {}, '', this.href );
	
	loadSpriteEditor().then( function() {
		$win.off( '.spriteEditLoader' );
	} );
	
	e.preventDefault();
} );
$spriteEditLinkDropdown.one( 'click.spriteEditLoader', function( e ) {
	// Initially add the history so it is not delayed waiting
	// for the editor to load. The editor will handle it from now.
	history.pushState( {}, '', this.href );
	
	loadSpriteEditor().then( function() {
		$win.off( '.spriteEditLoader' );
	} );
	
	e.preventDefault();
} );

// If the page is reloaded while the editor isn't loaded, navigating
// back to the editor won't work, so an initial navigation check is
// necessary to load the editor, where it will then monitor navigation
$win.on( 'popstate.spriteEditLoader', function() {
	if (
		location.search.match( '[?&]spriteaction=edit' ) &&
		!$( 'html' ).hasClass( 'spriteedit-loaded' )
	) {
		loadSpriteEditor().then( function() {
			$win.off( '.spriteEditLoader' );
		} );
	}
} );

} );