MediaWiki:Gadget-nuxedtoolkit.js

/* ---------------------------------------------------------------------------------------------- *\
	Nux edit toolbar toolikit
	czyli dodawanie własnych przycisków do toolbara (nowego i starego)

    Copyright:  ©2009-2021 Maciej Jaros (pl:User:Nux, en:User:Nux)
      License:  MIT or CC-BY
                http://creativecommons.org/licenses/by/3.0/pl/
	
	//
	// Typical usage
	//
	if ((typeof nuxedtoolkit)!='object')
	{
		importScript('User:Nux/nuxedtoolkit.js');
	}
	mw.hook('userjs.nuxedtoolkit.done').add(function () {
		$(myScriptInit);
	});
	
	function myScriptInit() {
		nuxedtoolkit.prepare();
		var group_el = nuxedtoolkit.addGroup();
		var icons = {
			// with blue background
			oldbar : '//upload.wikimedia.org/wikipedia/commons/2/2e/Button_something.png',
			// plain no background, SVG advised
			newbar : '//commons.wikimedia.org/w/thumb.php?f=Some_icon.svg&w=22'
		}
		nuxedtoolkit.addBtn(group_el, 'my_action()', icons)
	}
\* ---------------------------------------------------------------------------------------------- */
//  wersja:
	var tmp_VERSION = '2.1.0';  // = nuxedtoolkit.version = nuxedtoolkit.ver
// ---------------------------------------------------------------------------------------------- //

//
// Object
//
nuxedtoolkit = {};
nuxedtoolkit.version = nuxedtoolkit.ver = tmp_VERSION;

//
// Lang
//
nuxedtoolkit.lang = {
  'Gadgets_section_label' : {pl:"Gadżety", en:"Gadgets"}
};

/**
 * Check if old toolbar is used. 
 */
nuxedtoolkit.isOldToolbar = function (toolbarElement) {
	var mwWikiEditorPreferences = mw.config.get('wgWikiEditorPreferences');
	// compatibility with old vars
	if (mwWikiEditorPreferences === null) {
		mwWikiEditorPreferences = undefined;
	}
	// new versions of toolbar always gives a false positive on old toolbar so check if it will be present...
	// (or at least so it did...)
	if (
		(toolbarElement && typeof(mwWikiEditorPreferences)=='undefined') 
		|| (typeof(mwWikiEditorPreferences)!='undefined' && typeof(mwWikiEditorPreferences.toolbar)=='undefined') 
		|| (typeof(mwWikiEditorPreferences)!='undefined' && typeof(mwWikiEditorPreferences.toolbar)!='undefined' && !mwWikiEditorPreferences.toolbar.enable)
		)
	{
		return true;
	}
	return false;
};

/* =====================================================
	Function: nuxedtoolkit.prepare()

	Prepare toolbar element
	
	returns tollbar element object (the one to which one should add groups and buttons)
   ===================================================== */
nuxedtoolkit.prepare = function ()
{
	// check if not already called
	if (nuxedtoolkit.is_prepared)
	{
		return nuxedtoolkit.el;
	}
	nuxedtoolkit.is_prepared = true;
	nuxedtoolkit.is_old_toolbar = false;
	// find or create tollbar element // doesn't work now...
	var el;
	var frm_el=document.getElementById('editform');
/*
	var els = frm_el.getElementsByTagName('div');
	for (var i=0; i<els.length; i++)
	{
		if (els[i].className == 'wikiEditor-ui-top')
		{
			el = els[i];
			break;
		}
	}
*/
	if (!el)
	{
		el=document.getElementById('toolbar');
		// check if we have the toolbar already
		nuxedtoolkit.is_old_toolbar = nuxedtoolkit.isOldToolbar(el);
		// extra preps for new toolbar
		if (!nuxedtoolkit.is_old_toolbar)
		{
			// seem not to be available anymore
			//importStylesheetURI (mw.config.get('wgServer') + '/w/extensions/UsabilityInitiative/css/combined.min.css?3');
 
			var el1, el2;
 
			el1 = document.createElement('div');
			//el1.className = 'wikiEditor-ui';	// not working well with wikEd (appending styles instead)
			el1.style.cssText = 'background-color:#F3F3F3; border:1px solid silver; border-style: solid solid none;  clear:both; float:left; line-height:1em; position:relative; width:100%; box-sizing: border-box;';
			var sum_el = document.getElementById('wpSummaryLabel');
			var txa_el = document.getElementById('wpTextbox1');
			if (sum_el.offsetTop<txa_el.offsetTop && document.getElementById('wpSummary').parentNode === frm_el)
			{
				frm_el.insertBefore(el1,document.getElementById('wpSummary').nextSibling);
			}
			else
			{
				frm_el.insertBefore(el1,frm_el.firstChild);
			}
 	 	 	// will be shown in hookEvent if not moved to gadgets section
 	 	 	if (nuxedtoolkit.isToBeAttemptedToBeMovedToNew)
			{
				nuxedtoolkit.el_top = el1;
				nuxedtoolkit.el_top.style.display = 'none';
			}

			el2 = document.createElement('div');
			el2.className = 'wikiEditor-ui-top';
			el2.style.cssText = 'border-style: none;';
			el1.appendChild(el2);
			el1=el2;
 
			el2 = document.createElement('div');
			el2.className = 'wikiEditor-ui-toolbar';
			el1.appendChild(el2);
			el1=el2;
 
			el = document.createElement('div');
			el.className = 'toolbar section section-main';
			el.style.cssText = 'width: 100%; height: 32px;';
			el1.appendChild(el);
 
			el2 = document.createElement('div');
			el2.style.cssText = 'clear:both';
			el1.appendChild(el2);
		}
	}
	// save tollbar element object (the one to which one should add groups and buttons)
	nuxedtoolkit.el = el;
 
	return nuxedtoolkit.el;
};

/* =====================================================
	Function: nuxedtoolkit.addGroup([group_id])

	Add Group element
	
	returns created group element (id is optional)
   ===================================================== */
nuxedtoolkit.addGroup = function (group_id)
{
	var gr_el;
	// create
	if (!nuxedtoolkit.is_old_toolbar)
	{
		gr_el=document.createElement('div');
		//gr_el.style.cssText = "border-left: 0px none; border-right: 1px solid #ddd; padding-right: 7px; margin-right:0";
		gr_el.className = "group";
	}
	else
	{
		gr_el=document.createElement('span');
	}
	// group id
	if (group_id!==undefined)
	{
		gr_el.id = group_id;
	}
	// insert
	nuxedtoolkit.el.appendChild(gr_el);
	
	return gr_el;
};
/* =====================================================
	Function: nuxedtoolkit.addBtn (gr_el, action, icons, [btn_attrs])

	Add button element
	
	* gr_el - preferably created with .addGroup
	* action - must be a string with an action
	* icons - must have newbar and oldbar icon
	* btn_attrs is optional, typically you can add
	id, title and alt attribute to your button
	any other that would fit in <img> element should be OK
   ===================================================== */
//
// prepare toolbar element
nuxedtoolkit.addBtn = function (gr_el, action, icons, btn_attrs)
{
	if (btn_attrs===undefined)
	{
		btn_attrs = {};
	}
	
	// create button
	if (!nuxedtoolkit.is_old_toolbar)
	{
		// element
		//var nel = document.createElement('input');
		var nel = document.createElement('img');
		
		// create attributes
		btn_attrs['src']=icons.newbar;
		btn_attrs['class']= (btn_attrs['class']===undefined) ? 'tool' : btn_attrs['class']+' tool';
		btn_attrs['style']= (btn_attrs['style']===undefined) ? 'cursor:pointer;' : btn_attrs['style']+';cursor:pointer';
		//btn_attrs['onclick']=action;
		//btn_attrs['type']="image"
		for (var attr in btn_attrs)
		{
			if (attr=='style')
			{
				nel.style.cssText = btn_attrs[attr];
			}
			else
			{
				var natr = document.createAttribute(attr);
				natr.nodeValue = btn_attrs[attr];
				nel.setAttributeNode(natr);
			}
		}
		
		// add button
		nel.onclick = new Function(action);
		gr_el.appendChild(nel);
	}
	else
	{
		// element
		var nel = document.createElement('a');

		// create attributes
		btn_attrs['src']=icons.oldbar;
		var attrs_html = '';
		for (var attr in btn_attrs)
		{
			attrs_html += ' '+attr+'="'+btn_attrs[attr]+'"';
		}

		// add button
		nel.href = 'javascript:'+action;
		nel.innerHTML=
			'<img style="cursor:pointer;" '+attrs_html+' border="0" height="22" width="23" />'
		;
		gr_el.appendChild(nel);
	}
};

// ----------------------------------------------------
// Move whole toolbar to a section of the New Toolbar
//
nuxedtoolkit.moveToNew = function()
{
	var nbar = document.getElementById('wikiEditor-ui-toolbar');
	if (!nbar || typeof(nuxedtoolkit.el)!='object')
	{
	 	if (nuxedtoolkit.el_top) nuxedtoolkit.el_top.style.display = 'block';	// show old nuxedtoolkit wrapper
		return;
	}
	if (nuxedtoolkit.isGadgetsSecCreated)	// prevent multiple runs
	{
		return;
	}
	nuxedtoolkit.isGadgetsSecCreated = true;
	$( '#wpTextbox1' ).wikiEditor( 'addToToolbar', {
		'sections': {
			'gadgets': {
				'type': 'toolbar',
				'label': (mw.config.get('wgUserLanguage')=='pl' ? nuxedtoolkit.lang.Gadgets_section_label.pl : nuxedtoolkit.lang.Gadgets_section_label.en)
			}
		}
	} );

	//var gadgets_sec = getElementsByClassName(nbar, "div", "section-gadgets")[0];
	var gadgets_sec = $('div.section-gadgets', nbar)[0];

	// reset style
	nuxedtoolkit.el.style.cssText='';
	nuxedtoolkit.el.className='';
	// hide old nuxedtoolkit wrapper // was not shown by default
	//nuxedtoolkit.el.parentNode.parentNode.parentNode.style.display = 'none';
	// move nuxedtoolkit to proper place
	gadgets_sec.appendChild(nuxedtoolkit.el);

	/**/
	// fix the new toolbar bug
	setTimeout(function(){
		if (gadgets_sec.clientHeight>2)
		{
			gadgets_sec.parentNode.style.height = (gadgets_sec.clientHeight+1) + 'px';
		}
	}, 1000);
	/**/
};
nuxedtoolkit.isAlreadyHooked = false;	// prevent double hook for moveToNew
if ( typeof $ != 'undefined' && typeof $.fn.wikiEditor != 'undefined' 
	&& !nuxedtoolkit.isAlreadyHooked)
{
	nuxedtoolkit.isToBeAttemptedToBeMovedToNew = true;
	nuxedtoolkit.isAlreadyHooked = true;
	nuxedtoolkit.isGadgetsSecCreated = false;
	$(window).on('load', nuxedtoolkit.moveToNew);
}
else
{
	nuxedtoolkit.isToBeAttemptedToBeMovedToNew = false;
}

// fire event/hook
if (typeof nuxedtoolkit_hookFired == 'undefined') {
	nuxedtoolkit_hookFired = true;
	mw.hook('userjs.nuxedtoolkit.done').fire(nuxedtoolkit);
}