|
|
Line 1: |
Line 1: |
| // <source lang="javascript"> | | /* <source lang="javascript"><nowiki> Top of Javascript */ |
| | // Drop down box for the Special character menu in [[MediaWiki:Edittools]] |
| | // will be called from [[MediaWiki:Common.js]]. |
| | // Adapted from: |
| | // http://commons.wikimedia.org/wiki/MediaWiki:Edittools.js |
|
| |
|
| /* | | // Switch for people that don't want it |
| EditTools support: add a selector, change into true buttons, enable for all text input fields
| | if (load_edittools == true) |
| The special characters to insert are defined at [[MediaWiki:Edittools]].
| | { |
| */
| |
|
| |
|
| // Globals: getElementsByClassName, hookEvent, addEvent (from wikibits.js) | | function addCharSubsetMenu() { |
| | var specialchars = document.getElementById('specialchars'); |
| | |
| | if (specialchars) { |
| | var menu = "<select style=\"display:inline\" onChange=\"chooseCharSubset(selectedIndex)\">"; |
| | menu += "<option>Standard</option>"; |
| | menu += "<option>Wiki Syntax</option>"; |
| | menu += "<option>Math</option>"; |
| | menu += "<option>French</option>"; |
| | menu += "<option>German</option>"; |
| | menu += "<option>Italian</option>"; |
| | menu += "<option>Portuguese</option>"; |
| | menu += "<option>Spanish</option>"; |
| | menu += "</select>"; |
| | specialchars.innerHTML = menu + specialchars.innerHTML; |
| | |
| | // Standard-CharSubset |
| | chooseCharSubset(0); |
| | } |
| | } |
| | |
| | // CharSubset selection |
| | function chooseCharSubset(s) { |
| | var l = document.getElementById('specialchars').getElementsByTagName('p'); |
| | for (var i = 0; i < l.length ; i++) { |
| | l[i].style.display = i == s ? 'inline' : 'none'; |
| | // l[i].style.visibility = i == s ? 'visible' : 'hidden'; |
| | } |
| | } |
| | |
| | // Menu insertion |
| | if (window.addEventListener) |
| | window.addEventListener("load", addCharSubsetMenu, false); |
| | else if (window.attachEvent) |
| | window.attachEvent("onload", addCharSubsetMenu); |
|
| |
|
| if ( load_edittools == true ) { // Legacy. Do we really need this?
| | } |
| if ( typeof( EditTools_set_focus ) == 'undefined' ) {
| | /* Bottom of Javascript </nowiki></source>*/ |
| var EditTools_set_focus = true;
| |
| }
| |
| | |
| if ( typeof( EditTools_set_focus_initially ) == 'undefined' ) {
| |
| var EditTools_set_focus_initially = EditTools_set_focus;
| |
| }
| |
| | |
| if ( typeof( EditTools_initial_subset ) == 'undefined' ) {
| |
| var EditTools_initial_subset = 0;
| |
| }
| |
| | |
| var EditTools = {
| |
| createSelector: function() {
| |
| var spec = document.getElementById( 'specialchars' );
| |
| if ( !spec ) {
| |
| return;
| |
| }
| |
| var sb = getElementsByClassName( spec, 'p', 'specialbasic' );
| |
| if ( sb.length <= 1 ) {
| |
| return; // Only care if there is more than one
| |
| }
| |
| | |
| var sel = document.createElement( 'select' );
| |
| sel.style.display = 'inline';
| |
| // sel.setAttribute( 'onchange', 'EditTools.chooseCharSubset( selectedIndex, true );' );
| |
| // Apparently, this doesn't work on IE6. Use an explicit event handling function instead:
| |
| sel.onchange = EditTools.handleOnchange;
| |
| | |
| var initial = EditTools_initial_subset;
| |
| if ( isNaN( initial ) || initial < 0 || initial >= sb.length ) {
| |
| initial = 0;
| |
| }
| |
| | |
| for ( var i = 0; i < sb.length; i++ ) {
| |
| var o = document.createElement( 'option' );
| |
| // Ugh. We have encoded Unicode characters in the names...
| |
| var id = sb[i].id.replace( /.([0-9A-F][0-9A-F])/g, '%$1' ).replace( /_/g, ' ' );
| |
| if ( i == initial ) {
| |
| o.selected = 'selected';
| |
| }
| |
| o.appendChild( document.createTextNode( decodeURIComponent( id ) ) );
| |
| sel.appendChild( o );
| |
| }
| |
| | |
| spec.insertBefore( sel, spec.firstChild );
| |
| | |
| EditTools.chooseCharSubset(
| |
| initial,
| |
| ( wgAction != 'submit' ) &&
| |
| EditTools_set_focus_initially &&
| |
| ( wgCanonicalNamespace != 'Special' || wgCanonicalSpecialPageName != 'Upload' )
| |
| );
| |
| },
| |
| | |
| handleOnchange: function( evt ) {
| |
| var e = evt || window.event; // W3C, IE
| |
| var node = e.target || e.srcElement; // W3C, IE
| |
| | |
| EditTools.chooseCharSubset( node.selectedIndex, true );
| |
| return true;
| |
| },
| |
| | |
| chooseCharSubset: function( selected, set_focus ) {
| |
| var sb = getElementsByClassName( document.getElementById( 'specialchars' ), 'p', 'specialbasic' );
| |
| EditTools.makeButtons( sb[selected] );
| |
| for ( var i = 0; i < sb.length; i++ ) {
| |
| sb[i].style.display = i == selected ? 'inline' : 'none';
| |
| }
| |
| if ( set_focus && EditTools_set_focus ) {
| |
| var txtarea = EditTools.getTextArea();
| |
| if ( txtarea ) {
| |
| txtarea.focus();
| |
| }
| |
| }
| |
| },
| |
| | |
| fixateWidth: function() {
| |
| var edit_bar = document.getElementById( 'specialchars' );
| |
| if ( !edit_bar ) {
| |
| return;
| |
| }
| |
| // Try to fixate the width of that bar, otherwise IE6 may make it wider, which will lead to
| |
| // a table re-layout on the upload form resulting in the right column extending beyond the
| |
| // right edge of the window.
| |
| edit_bar.setAttribute( 'width', '' + ( edit_bar.clientWidth || edit_bar.offsetWidth ) );
| |
| edit_bar.style.maxWidth = '' + ( edit_bar.clientWidth || edit_bar.offsetWidth ) + 'px';
| |
| // If we're inside a table, fixate the containing table cell, too.
| |
| var parent = edit_bar.parentNode;
| |
| while ( parent && parent != document.body && parent.nodeName.toLowerCase() != 'td' ) {
| |
| parent = parent.parentNode;
| |
| }
| |
| if ( parent && parent != document.body ) {
| |
| parent.setAttribute( 'width', '' + ( parent.clientWidth || parent.offsetWidth ) );
| |
| parent.style.maxWidth = '' + ( parent.clientWidth || parent.offsetWidth ) + 'px';
| |
| }
| |
| },
| |
| | |
| makeButtons: function( section ) {
| |
| var edit_bar = section || document.getElementById( 'specialchars' );
| |
| if ( !edit_bar ) {
| |
| return;
| |
| }
| |
| var links = edit_bar.getElementsByTagName( 'a' );
| |
| // 'links' is a *live* collection!
| |
| var b = null;
| |
| while ( links.length ) {
| |
| b = document.createElement( 'input' );
| |
| b.type = 'button';
| |
| b.style.fontSize = '0.9em';
| |
| b.style.paddingLeft = '1px';
| |
| b.style.paddingRight = '1px';
| |
| b.style.marginLeft = '1px';
| |
| b.onclick = links[0].onclick;
| |
| b.value = links[0].firstChild.data;
| |
| var parent = links[0].parentNode;
| |
| parent.replaceChild( b, links[0] ); // This removes links[0] from links!
| |
| b.blur(); // IE6 insists on marking some buttons as having the focus...
| |
| var margin_added = false;
| |
| // Remove text nodes (nodeType == Node.TEXT_NODE, but IE6 doesn't know that...)
| |
| // Insert some spacing where desired.
| |
| while ( b.nextSibling && b.nextSibling.nodeType == 3 ) {
| |
| if ( !margin_added && b.nextSibling.data.search( /\S/ ) >= 0 ) {
| |
| b.style.marginRight = '4px';
| |
| margin_added = true;
| |
| }
| |
| parent.removeChild( b.nextSibling );
| |
| }
| |
| }
| |
| },
| |
| | |
| enableForAllFields: function() {
| |
| if ( typeof( insertTags ) != 'function' ) {
| |
| return;
| |
| }
| |
| // insertTags from the site-wide /skins-1.5/common/edit.js just inserts in the first
| |
| // textarea in the document. Evidently, that's not good if we have multiple textareas.
| |
| // My first idea was to simply add a hidden textarea as the first one, and redefine
| |
| // insertTags such that it copied first the last active textareas contents over to that hidden
| |
| // field, set the cursor or selection there, let the standard insertTags do its thing, and
| |
| // then copy the hidden field's text, cursor position and selection back to the currently
| |
| // active field. Unfortunately, that is just as complex as simply copying the whole code
| |
| // from wikibits to here and let it work on the right text field in the first place.
| |
| var texts = document.getElementsByTagName( 'textarea' );
| |
| for ( var i = 0; i < texts.length; i++ ) {
| |
| $( texts[i] ).focus( EditTools.registerTextField );
| |
| }
| |
| // While we're at it, also enable it for input fields
| |
| texts = document.getElementsByTagName( 'input' );
| |
| for ( var i = 0; i < texts.length; i++ ) {
| |
| if ( texts[i].type == 'text' ) {
| |
| $( texts[i] ).focus( EditTools.registerTextField );
| |
| }
| |
| }
| |
| insertTags = EditTools.insertTags; // Redefine the global insertTags
| |
| },
| |
| | |
| last_active_textfield: null,
| |
| | |
| registerTextField: function( evt ) {
| |
| var e = evt || window.event;
| |
| var node = e.target || e.srcElement;
| |
| if ( !node ) {
| |
| return;
| |
| }
| |
| EditTools.last_active_textfield = node.id;
| |
| return true;
| |
| },
| |
| | |
| getTextArea: function() {
| |
| var txtarea = null;
| |
| if ( EditTools.last_active_textfield && EditTools.last_active_textfield != '' )
| |
| txtarea = document.getElementById( EditTools.last_active_textfield );
| |
| if ( !txtarea ) {
| |
| // Fallback option: old behaviour
| |
| if ( document.editform ) {
| |
| txtarea = document.editform.wpTextbox1;
| |
| } else {
| |
| // Some alternate form? Take the first one we can find
| |
| txtarea = document.getElementsByTagName( 'textarea' );
| |
| if ( txtarea.length > 0 ) {
| |
| txtarea = txtarea[0];
| |
| } else {
| |
| txtarea = null;
| |
| }
| |
| }
| |
| }
| |
| return txtarea;
| |
| },
| |
| | |
| insertTags: function( tagOpen, tagClose, sampleText ) {
| |
| /* Usability initiative compatibility */
| |
| if ( typeof $j != 'undefined' && typeof $j.fn.textSelection != 'undefined' ) {
| |
| $j( '#wpTextbox1' ).textSelection(
| |
| 'encapsulateSelection', { 'pre': tagOpen, 'peri': sampleText, 'post': tagClose }
| |
| );
| |
| return;
| |
| }
| |
| var txtarea = EditTools.getTextArea ();
| |
| if ( !txtarea ) {
| |
| return;
| |
| }
| |
| var selText, isSample = false;
| |
| | |
| function checkSelectedText() {
| |
| if ( !selText ) {
| |
| selText = sampleText;
| |
| isSample = true;
| |
| } else if ( selText.charAt( selText.length - 1 ) == ' ' ) { // Exclude ending space char
| |
| selText = selText.substring( 0, selText.length - 1 );
| |
| tagClose += ' ';
| |
| }
| |
| }
| |
| | |
| if ( document.selection && document.selection.createRange ) { // IE/Opera
| |
| // Save window scroll position
| |
| var winScroll = 0;
| |
| if ( document.documentElement && document.documentElement.scrollTop ) {
| |
| winScroll = document.documentElement.scrollTop;
| |
| } else if ( document.body ) {
| |
| winScroll = document.body.scrollTop;
| |
| }
| |
| // Get current selection
| |
| txtarea.focus();
| |
| var range = document.selection.createRange();
| |
| selText = range.text;
| |
| // Insert tags
| |
| checkSelectedText ();
| |
| range.text = tagOpen + selText + tagClose;
| |
| // Mark sample text as selected
| |
| if ( isSample && range.moveStart ) {
| |
| if ( window.opera ) {
| |
| tagClose = tagClose.replace( /\n/g, '' );
| |
| }
| |
| range.moveStart( 'character', - tagClose.length - selText.length );
| |
| range.moveEnd( 'character', - tagClose.length );
| |
| }
| |
| range.select();
| |
| // Restore window scroll position
| |
| if ( document.documentElement && document.documentElement.scrollTop ) {
| |
| document.documentElement.scrollTop = winScroll;
| |
| } else if ( document.body ) {
| |
| document.body.scrollTop = winScroll;
| |
| }
| |
| } else if ( txtarea.selectionStart || txtarea.selectionStart == '0' ) { // Mozilla
| |
| // Save textarea scroll position
| |
| var textScroll = txtarea.scrollTop;
| |
| // Get current selection
| |
| txtarea.focus();
| |
| var startPos = txtarea.selectionStart;
| |
| var endPos = txtarea.selectionEnd;
| |
| selText = txtarea.value.substring( startPos, endPos );
| |
| // Insert tags
| |
| checkSelectedText();
| |
| txtarea.value = txtarea.value.substring( 0, startPos ) +
| |
| tagOpen + selText + tagClose +
| |
| txtarea.value.substring( endPos );
| |
| // Set new selection
| |
| if ( isSample ) {
| |
| txtarea.selectionStart = startPos + tagOpen.length;
| |
| txtarea.selectionEnd = startPos + tagOpen.length + selText.length;
| |
| } else {
| |
| txtarea.selectionStart = startPos + tagOpen.length + selText.length + tagClose.length;
| |
| txtarea.selectionEnd = txtarea.selectionStart;
| |
| }
| |
| // Restore textarea scroll position
| |
| txtarea.scrollTop = textScroll;
| |
| }
| |
| }, // end insertTags
| |
| | |
| setup: function() {
| |
| EditTools.fixateWidth();
| |
| EditTools.createSelector();
| |
| EditTools.enableForAllFields();
| |
| }
| |
| | |
| } // end EditTools
| |
| | |
| // Do not use addOnloadHook; it runs *before* the onload event fires. At that time, onclick or
| |
| // onfocus handlers may not yet be set up properly.
| |
| hookEvent( 'load', EditTools.setup );
| |
| | |
| } // end if
| |
| | |
| // </source>
| |