MediaWiki:Common.js: Difference between revisions

From MediaWiki
Jump to navigationJump to search
Switch TOC toggle to jQuery slideUp/slideDown
Modernize upload preview to use mw.Api (drops dead MW 1.19 live-preview protocol)
 
Line 46: Line 46:
$( document ).ready(tfwiki_hooks);
$( document ).ready(tfwiki_hooks);


/* ==========   Upload preview   ==========
/* ========== Upload preview ==========
   ==========      -BEGIN-      ==========
   Trying mw.Api */
  ========== CODE IS UNREVIEWED ========== */


$( function () {
if ( mw.config.get( 'wgCanonicalSpecialPageName' ) !== 'Upload' ) { return; }


/**
var $desc = $( '#wpUploadDescription' );
* Live preview script for MediaWiki
if ( !$desc.length ) { return; }
*
* 2007-04-25 – Nikerabbit:
*  Worked around text cutoff in mozilla-based browsers
*  Support for categories
*/


var $btn = $( '<input>', { type: 'button', value: 'Preview' } );
var $preview = $( '<div>', { id: 'wikiPreview' } ).hide();
$desc.after( $preview ).after( $btn );


lpIdPreview = 'wikiPreview';
var api = new mw.Api();
lpIdCategories = 'catlinks';
lpIdDiff = 'wikiDiff';


/*
$btn.on( 'click', function () {
* Returns XMLHttpRequest based on browser support or null
var dest = $( '#wpDestFile' ).val() || 'Example.png';
*/
$btn.prop( 'disabled', true );
function openXMLHttpRequest() {
$preview.text( 'Loading…' ).show();
if( window.XMLHttpRequest ) {
return new XMLHttpRequest();
} else if( window.ActiveXObject && navigator.platform != 'MacPPC' ) {
// IE/Mac has an ActiveXObject but it doesn't work.
return new ActiveXObject("Microsoft.XMLHTTP");
} else {
return null;
}
}


/**
api.post( {
* Returns true if could open the request,
action: 'parse',
* false otherwise (eg no browser support).
text: $desc.val(),
*/
title: 'File:' + dest,
function lpDoPreview(text, postUrl) {
contentmodel: 'wikitext',
lpRequest = openXMLHttpRequest();
prop: 'text|categorieshtml',
if( !lpRequest ) return false;
disablelimitreport: 1,
formatversion: 2
} ).then( function ( data ) {
var html = ( data.parse && data.parse.text ) || '';
var cats = ( data.parse && data.parse.categorieshtml ) || '';
$preview.html( html + cats );
}, function ( code, result ) {
$preview.text( 'Preview failed: ' + code +
( result && result.error ? ' — ' + result.error.info : '' ) );
} ).always( function () {
$btn.prop( 'disabled', false );
} );
} );
} );


lpRequest.onreadystatechange = lpStatusUpdate;
lpRequest.open("POST", postUrl, true);
var postData = 'wpTextbox1=' + encodeURIComponent(text) + '&wpEdittime=Something&wpEditToken=' + encodeURIComponent(mw.user.tokens.get('editToken'));
lpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
lpRequest.send(postData);
return true;
}
function lpStatusUpdate() {
/* We are at some stage of loading */
if (lpRequest.readyState > 0 && lpRequest.readyState < 4) {
notify(i18n(wgLivepreviewMessageLoading));
}
/* Not loaded yet */
if(lpRequest.readyState != 4) {
return;
}
/* We got response, bug it not what we wanted */
if( lpRequest.status != 200 ) {
var keys = new Array();
keys[0] = lpRequest.status;
keys[1] = lpRequest.statusText;
window.alert(i18n(wgLivepreviewMessageError, keys));
lpShowNormalPreview();
return;
}
/* All good */
dismissNotify(i18n(wgLivepreviewMessageReady), 750);
var XMLObject = lpRequest.responseXML.documentElement;
/* Work around Firefox (Gecko?) limitation where it shows only the first 4096
* bytes of data. Ref: http://www.thescripts.com/forum/thread482760.html
*/
XMLObject.normalize();
var previewElement = XMLObject.getElementsByTagName('preview')[0];
var categoryElement = XMLObject.getElementsByTagName('category')[0];
/* Hide the active diff if it exists */
var diff = document.getElementById(lpIdDiff);
if ( diff ) { diff.style.display = 'none'; }
/* Inject preview */
var previewContainer = document.getElementById( lpIdPreview );
if ( previewContainer && previewElement ) {
previewContainer.innerHTML = previewElement.firstChild.data;
previewContainer.style.display = 'block';
} else {
/* Should never happen */
window.alert(i18n(wgLivepreviewMessageFailed));
lpShowNormalPreview();
return;
}
/* Inject categories */
var categoryContainer  = document.getElementById( lpIdCategories );
if ( categoryElement && categoryElement.firstChild ) {
if ( categoryContainer ) {
categoryContainer.innerHTML = categoryElement.firstChild.data;
/* May be hidden */
categoryContainer.style.display = 'block';
} else {
/* Just dump them somewhere */
/* previewContainer.innerHTML += categoryElement.firstChild.data;*/
}
} else {
/* Nothing to show, hide old data */
if ( categoryContainer ) {
categoryContainer.style.display = 'none';
}
}
}
function lpShowNormalPreview() {
var fallback = document.getElementById('wpPreview');
if ( fallback ) { fallback.style.display = 'inline'; }
}
// TODO: move elsewhere
/* Small non-intrusive popup which can be used for example to notify the user
* about completed AJAX action. Supports only one notify at a time.
*/
function notify(message) {
var notifyElement = document.getElementById('mw-js-notify');
if ( !notifyElement ) {
createNotify();
var notifyElement = document.getElementById('mw-js-notify');
}
notifyElement.style.display = 'block';
notifyElement.innerHTML = message;
}
function dismissNotify(message, timeout) {
var notifyElement = document.getElementById('mw-js-notify');
if ( notifyElement ) {
if ( timeout == 0 ) {
notifyElement.style.display = 'none';
} else {
notify(message);
setTimeout("dismissNotify('', 0)", timeout);
}
}
}
function createNotify() {
var div = document.createElement("div");
var txt = '###PLACEHOLDER###'
var txtNode = document.createTextNode(txt);
div.appendChild(txtNode);
div.id = 'mw-js-notify';
// TODO: move styles to css
div.setAttribute('style',
'display: none; position: fixed; bottom: 0px; right: 0px; color: white; background-color: DarkRed; z-index: 5; padding: 0.1em 1em 0.1em 1em; font-size: 120%;');
var body = document.getElementsByTagName('body')[0];
body.appendChild(div);
}
/* Helper function similar to wfMsgReplaceArgs() */
function i18n(message, keys) {
var localMessage = message;
if ( !keys ) { return localMessage; }
for( var i = 0; i < keys.length; i++) {
var myregexp = new RegExp("\$"+(i+1), 'g');
localMessage = localMessage.replace(myregexp, keys[i]);
}
return localMessage;
}
if (mw.config.get('wgCanonicalNamespace') == 'Special' && mw.config.get('wgCanonicalSpecialPageName') == 'Upload'){
$( document ).ready(uploadPreviewInit)
//prepare Mediawiki Live Preview
wgLivepreviewMessageLoading = 'Wait...'
wgLivepreviewMessageReady = 'Done'
//document.write('<script type= "text/javascript" src="/skins/common/preview.js"></script>')
}
function uploadPreviewInit(){
wpUploadDescription = document.getElementById('wpUploadDescription') //global var
var but = document.createElement('input')
but.type = 'button'
but.value='Preview'
but.onclick=uploadPreviewDo
wpUploadDescription.parentNode.insertBefore(but, wpUploadDescription.nextSibling)
}
function uploadPreviewDo(){
if (!window.wikiPreview) //create preview div
    wikiPreview = document.createElement('div')
    wikiPreview.id = 'wikiPreview'
    wpUploadDescription.parentNode.insertBefore(wikiPreview, wpUploadDescription.nextSibling.nextSibling)
lpDoPreview(wpUploadDescription.value, '/w2/index.php?action=submit&live')
}
/* ==========  Upload preview  ==========
  ==========      -End-      ==========
  ========== CODE IS UNREVIEWED ========== */


/* Code for showing/hiding voice actor credits */  
/* Code for showing/hiding voice actor credits */  

Latest revision as of 03:35, 27 May 2026

/* Blatantly based on Wookiepedia's ShowEras */ 
function showTitles(className) { 
     if(typeof(SKIP_ERAS) != 'undefined' && SKIP_ERAS) 
          return; 
 
     var titleDiv = document.getElementById(className); 
 
     if(titleDiv == null || titleDiv == undefined) 
          return; 
 
     var cloneNode = titleDiv.cloneNode(true); 
     var firstHeading = getFirstHeading(); 
     firstHeading.insertBefore(cloneNode, firstHeading.childNodes[0]); 
     cloneNode.style.display = "block"; 
}// END JavaScript title rewrite 
 
function getFirstHeading(){ 
     //var a = getElementsByClassName(document.getElementById('content'), 'h1', 'firstHeading'); 
     var a = document.getElementById('content').getElementsByTagName('h1');
     return a[0]; 
}

/* Code for hiding segments */
function hide_block(id) {
     document.getElementById(id).style.display = "inline";
     document.getElementById(id + "-link").style.display = "none";
}

function replace_hides() {
     //var hide_blocks = getElementsByClassName(document, "div", "hide");
     var hide_blocks = document.getElementsByClassName('hide');
     for (var i=0;i<hide_blocks.length;i++) { 
          var hide_link = document.createElement("div"); 
          hide_link.innerHTML = "<a href='javascript:hide_block(\"" + hide_blocks[i].getAttribute("id") + "\");' id='" + hide_blocks[i].getAttribute("id") + "-link'><i>Show hidden content.</i></a>";          
          //hide_link.innerHTML = "<a href='javascript:hide_block("" + hide_blocks[i].getAttribute("id") + "");' id='" + hide_blocks[i].getAttribute("id") + "-link'><i>Show hidden content.</i></a>"; 
          hide_blocks[i].parentNode.insertBefore(hide_link, hide_blocks[i]);
          hide_blocks[i].style.display = "none";
     }
}

function tfwiki_hooks() {
     showTitles('title-factionicons');
     replace_hides();
}

$( document ).ready(tfwiki_hooks);

/* ========== Upload preview ==========
   Trying mw.Api */

$( function () {
	if ( mw.config.get( 'wgCanonicalSpecialPageName' ) !== 'Upload' ) { return; }

	var $desc = $( '#wpUploadDescription' );
	if ( !$desc.length ) { return; }

	var $btn = $( '<input>', { type: 'button', value: 'Preview' } );
	var $preview = $( '<div>', { id: 'wikiPreview' } ).hide();
	$desc.after( $preview ).after( $btn );

	var api = new mw.Api();

	$btn.on( 'click', function () {
		var dest = $( '#wpDestFile' ).val() || 'Example.png';
		$btn.prop( 'disabled', true );
		$preview.text( 'Loading…' ).show();

		api.post( {
			action: 'parse',
			text: $desc.val(),
			title: 'File:' + dest,
			contentmodel: 'wikitext',
			prop: 'text|categorieshtml',
			disablelimitreport: 1,
			formatversion: 2
		} ).then( function ( data ) {
			var html = ( data.parse && data.parse.text ) || '';
			var cats = ( data.parse && data.parse.categorieshtml ) || '';
			$preview.html( html + cats );
		}, function ( code, result ) {
			$preview.text( 'Preview failed: ' + code +
				( result && result.error ? ' — ' + result.error.info : '' ) );
		} ).always( function () {
			$btn.prop( 'disabled', false );
		} );
	} );
} );


/* Code for showing/hiding voice actor credits */ 

function showcredits(num) {
	var spantohide=document.getElementById("ocreditl"+num)
	spantohide.style.display="none";
	var spantoshow=document.getElementById("ocredit"+num)
	spantoshow.style.display="inline";
}

function hidecredits(num) {
	var spantohide=document.getElementById("ocreditl"+num);
	spantohide.style.display="inline";
	var spantoshow=document.getElementById("ocredit"+num);
	spantoshow.style.display="none";
}

function init_voiceactors(){
	var list = document.getElementsByTagName("span");
	for (var ii = 0; ii < list.length; ii++) {
		if(list[ii].className=="ocreditspan") {
            list[ii].innerHTML="<span id=\"ocreditl"+ii+"\"><a href=\"#\" onclick=\"showcredits("+ii+"); return false;\">more&raquo;</a></span><span id=\"ocredit"+ii+"\" style=\"display: none\">"+list[ii].innerHTML+" <a href=\"#\" onclick=\"hidecredits("+ii+"); return false;\">&laquo;less</a></span>";
		}
	}
}

$( document ).ready( init_voiceactors);

/* End of code for showing/hiding voice actor credits */
/* === TOC collapse/expand animation === */
$( document ).ready( function () {
	var $ul = $( '#toc > ul' );
	var $checkbox = $( '#toc .toctogglecheckbox' );
	if ( !$ul.length || !$checkbox.length ) { return; }

	if ( $checkbox.prop( 'checked' ) ) { $ul.hide(); }

	$checkbox.on( 'change', function () {
		if ( $checkbox.prop( 'checked' ) ) {
			$ul.stop( true, false ).slideUp( 250 );
		} else {
			$ul.stop( true, false ).slideDown( 250 );
		}
	} );
} );