Difference between revisions of "MediaWiki:Common.js"

Revision as of 18:01, 19 February 2012

/* Any JavaScript here will be loaded for all users on every page load. */

/***************************************
 * Name: hasClass
 * Description: Checks if a element has a specified class name.  Uses regular expressions and caching for better performance.
 * Maintainers (Wikipedia): [[User:Mike Dillon]], [[User:R. Koot]], [[User:SG]]
 * Source: Wikipedia Common.js, imported 2/1/10
 * Additional Notes: This is a utility method used in other methods.
 */
 
var hasClass = (function () {
    var reCache = {};
    return function (element, className) {
        return (reCache[className] ? reCache[className] : (reCache[className] = new RegExp("(?:\\s|^)" + className + "(?:\\s|$)"))).test(element.className);
    };
})();
 
/***********************************************************
 *  Name: collapseTable
 *  Description: Collapses a single table, showing only the header.
 *  Maintainers: (Wikipedia) [[User:R. Koot]], (Dragon Quest Wiki) [[User:FlyingRagnar]]
 *  Source: Wikipedia Common.js, imported 2/1/10
 *  Additional Notes: This is the primary method used to collapse navigational templates.
 *  This code has been updated to use the jQuery toggle() function.  Various effects were tested, but due
 *  to the fact that multiple <tr>s are being toggled, they did not look good.  As a result, it does just a basic toggle
 *  with no effects.
 */
mw.loader.load( 'jquery.effects.core' );
var autoCollapse = 2;
var collapseCaption = "hide";
var expandCaption = "show";
function collapseTable( tableIndex )
{
    var Button = document.getElementById( "collapseButton" + tableIndex );
    var Table = document.getElementById( "collapsibleTable" + tableIndex );
 
    if ( !Table || !Button ) {
        return false;
    }
    
    var targt = "#collapsibleTable" + tableIndex + " tr";
    $( targt + ":first-child").addClass("master");    
    $( targt + ":not(.master)").toggle();
 
    if ( Button.firstChild.data == collapseCaption ) {
        Button.firstChild.data = expandCaption;
    } else {
        Button.firstChild.data = collapseCaption;
    }
}

/***********************************************************
 *  Name: createTableCollapseButtons
 *  Description: Runs at page load, finds each table with class collapsible and inserts the necessary 
 *  elements to make the table have collapsible functionality.  The actual collapsing is then handled
 *  by the collapseTable function.
 *  Maintainers: (Wikipedia) [[User:R. Koot]], (Dragon Quest Wiki) [[User:FlyingRagnar]]
 *  Source: Wikipedia Common.js, imported 2/1/10
 *  Additional Notes: This method sets up the collapsing functionality. Dragon Quest wiki does not currently use the 'innercollapse', 'outercollapse', or 'autocollapse'  
 *  functionality. It is generally preferred to allow tables to size themselves rather than specify a fixed width.
 *  Usage: Create a table and give it the class "collapsible".  Ensure that the table has a header row.  Add the class
 *  "collapsed" if you wish the table to be collapsed on page load.
 */
function createTableCollapseButtons()
{
    var tableIndex = 0;
    var NavigationBoxes = new Object();
    var Tables = document.getElementsByTagName( "table" );
 
    for ( var i = 0; i < Tables.length; i++ ) {
        if ( hasClass( Tables[i], "collapsible" ) ) {
 
            // only add button and increment count if there is a header row to work with
            var HeaderRow = Tables[i].getElementsByTagName( "tr" )[0];
            if (!HeaderRow) continue;
            var Header = HeaderRow.getElementsByTagName( "th" )[0];
            if (!Header) continue;
 
            NavigationBoxes[ tableIndex ] = Tables[i];
            Tables[i].setAttribute( "id", "collapsibleTable" + tableIndex );
 
            var Button     = document.createElement( "span" );
            var ButtonLink = document.createElement( "a" );
            var ButtonText = document.createTextNode( collapseCaption );
 
            Button.className = "collapseButton";  //Styles are declared in Common.css

            ButtonLink.style.color = Header.style.color;
            ButtonLink.setAttribute( "id", "collapseButton" + tableIndex );
            ButtonLink.setAttribute( "href", "javascript:collapseTable(" + tableIndex + ");" );
            ButtonLink.appendChild( ButtonText );

            // fix width of table to be the same when shown or hidden (IE only)
            // Tables[i].style.width = Tables[i].offsetWidth;
 
            Button.appendChild( document.createTextNode( "[" ) );
            Button.appendChild( ButtonLink );
            Button.appendChild( document.createTextNode( "]" ) );
 
            Header.insertBefore( Button, Header.childNodes[0] );
            tableIndex++;
        }
    }
 
    for ( var i = 0;  i < tableIndex; i++ ) {
        if ( hasClass( NavigationBoxes[i], "collapsed" ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], "autocollapse" ) ) ) {
            collapseTable( i );
        } 
        else if ( hasClass( NavigationBoxes[i], "innercollapse" ) ) {
            var element = NavigationBoxes[i];
            while (element = element.parentNode) {
                if ( hasClass( element, "outercollapse" ) ) {
                    collapseTable ( i );
                    break;
                }
            }
        }
    }
}
 
addOnloadHook( createTableCollapseButtons );

/***********************************************************
 *  Name: collapseSpoiler
 *  Description: Toggles a spoiler for display on a page.
 *  Maintainers: [[User:FlyingRagnar]]
 *  Additional Notes: Similar to collapseTable, this function toggles spoilers
 *  for display.  The jQuery blind effect is used when they are toggled.
 */
mw.loader.load( 'jquery.effects.blind' );
mw.loader.load( 'jquery.ui.button' );
var collapseSpoilerCaption = "Hide spoilers";
var expandSpoilerCaption = "Show spoilers";
function collapseSpoiler( spoilerIndex )
{
    var Button = document.getElementById( "collapseSpoilerButton" + spoilerIndex );
    var Div = document.getElementById( "collapsibleSpoiler" + spoilerIndex );
 
    if ( !Div || !Button ) {
        return false;
    }
    
    var options = {};
    var targt = "#collapsibleSpoiler" + spoilerIndex;    
    $( targt ).toggle("blind", options, 500);

    if ( Button.firstChild.innerHTML == collapseSpoilerCaption ) {
        Button.firstChild.innerHTML = expandSpoilerCaption;
    } else {
        Button.firstChild.innerHTML = collapseSpoilerCaption;
    }
}

/***********************************************************
 *  Name: createSpoilerCollapseButtons
 *  Description: Runs on page load, adds functionality to toggle spoilers
 *  Maintainers: [[User:FlyingRagnar]]
 *  Additional Notes: Works very similar to createTableCollapseButtons.  
 *  Uses a jQuery button to trigger the toggle of spoilers.  All spoilers
 *  are hidden by default when a page loads.
 */ 
function createSpoilerCollapseButtons()
{
    var spoilerIndex = 0;
    var Spoilers = document.getElementsByTagName( "div" );

    // These methods don't work in IE
    //var SpoilerHeaders = document.getElementsByClassName( "spoilerstart" );
    //var Spoilers = document.getElementsByClassName( "spoiler" );
 
    for ( var i = 0; i < Spoilers.length; i++ ) {
         if ( hasClass( Spoilers[i], "spoiler" ) ) {
            Spoilers[i].setAttribute( "id", "collapsibleSpoiler" + spoilerIndex );
            spoilerIndex++;
         } else if ( hasClass ( Spoilers[i], "spoilerstart" ) ) {
            var Button     = document.createElement( "button" );
            var ButtonText = document.createTextNode( collapseSpoilerCaption );
 
            Button.setAttribute( "id", "collapseSpoilerButton" + spoilerIndex );
            Button.setAttribute( "onclick", "collapseSpoiler(" + spoilerIndex + ");" );
            Button.appendChild( ButtonText );
            
            // fix width of table to be the same when shown or hidden (IE only)
            // Tables[i].style.width = Tables[i].offsetWidth;
                        
            Spoilers[i].insertBefore( Button, Spoilers[i].childNodes[0] );
            $( "button", ".spoilerstart" ).button();
            // Apparently button() is not supported on IE7 or earlier.  Oh well.
            
          }
    }
 
    for ( var i = 0;  i < spoilerIndex; i++ ) {
            collapseSpoiler( i );
    }
}
 
addOnloadHook( createSpoilerCollapseButtons );

/***********************************************************
 *  Name: createJQueryTabs
 *  Description: Runs at page load, inserts jQuery tabs into a page wherever a <div> with class "tabs" is found.
 *  Maintainers: [[User:FlyingRagnar]]
 *  Additional Notes: This function effectively replaces the Tabber extension which was 
 *  previously used to insert tabs into a page.  The template [[Template:VersionTabs]] is
 *  the primary method to use when inserting jQuery tabs into a page.  It is tightly 
 *  coupled to this function.
 */
mw.loader.load( 'jquery.ui.tabs' );
function createJQueryTabs()
{
    var tabGroup = 0;
    var Tabs = document.getElementsByTagName( "div" );
 
    for ( var i = 0; i < Tabs.length; i++ ) {
        if ( hasClass( Tabs[i], "tabs" ) ) {
 
            Tabs[i].setAttribute("id", "tabs" + tabGroup);

            var children = Tabs[i].childNodes;
            var h = 0;
            for( var j = 0; j < children.length; j++ ) {
               if ( children[j].nodeName == "UL" ) {
                  var Tlinks = children[j].getElementsByTagName( "a" );
                  for( var k = h; k < Tlinks.length; k++ ) {
                     Tlinks[k].setAttribute("href", "#tabs" + tabGroup + "-" + (k+1)); 
                  }
               } else if ( children[j].nodeName == "DIV" ) {
                  children[j].setAttribute("id", "tabs" + tabGroup + "-" + (h+1));
                  h++; 
               }
            }
            // apply the jQuery code to take effect
            jQuery( "#tabs" + tabGroup ).tabs({ /*event: "mouseover"*/ });
            tabGroup++;
        }
    }
}
jQuery( createJQueryTabs );

mw.loader.load( 'jquery.ui.accordion' );
function accordionVideos()
{
   jQuery( "#accordion" ).accordion({ collapsible: true, active: false });
}
jQuery( accordionVideos );

mw.loader.load( 'jquery.clickmenu' );
function activateClickMenu()
{
  $( "#list" ).clickMenu();
}
jQuery( activateClickMenu );

mw.loader.load('ext.datatables');
function activateDataTables()
{
  $( "#datatable" ).dataTable();
}
jQuery( activateDataTables );


// --------------------------------------------------------
// addPurge
// adds a "purge" tab (after "watch")
// --------------------------------------------------------
addOnloadHook(function () {
    if (wgAction != 'edit' && wgCanonicalNamespace != 'Special' && wgAction != 'history' && wgAction != 'delete' && wgAction != 'watch' && wgAction 
    != 'unwatch' && wgAction != 'protect' && wgAction != 'markpatrolled' && wgAction != 'rollback' && document.URL.indexOf('diff=') <= 0
    && document.URL.indexOf('oldid=') <=0)
    { var hist; var url;
    if (!(hist = document.getElementById('ca-history') )) return;
    if (!(url = hist.getElementsByTagName('a')[0] )) return;
    if (!(url = url.href )) return;
    addPortletLink('p-cactions', url.replace(/([?&]action=)history([&#]|$)/, '$1purge$2'),
                   'purge', 'ca-purge', 'Purge server cache for this page', '0');
}
});
//


// --------------------------------------------------------
// Rights
// Sets a variable "rights" which will return "false" if the 
// currently logged in user is a bureaucrat, administrator, or autoconfirmed user. It will return true otherwise.
// it also defines variables which may be used elsewhere in scripts.
// --------------------------------------------------------

 var rights_isAdmin = (wgUserGroups.toString().indexOf('sysop') != -1);
 var rights_isAuto = (wgUserGroups.toString().indexOf('autoconfirmed') != -1);
 var rights_isCrat = (wgUserGroups.toString().indexOf('bureaucrat') != -1);
 var rights = true;
 if (rights_isCrat || rights_isAdmin || rights_isAuto)
 {rights=false}
//

// --------------------------------------------------------
// addLogs
// adds a 'page logs' link to the toolbox bar (if the page is a special page, then no link is displayed)
// --------------------------------------------------------
addOnloadHook(function () {
    if ( wgCanonicalNamespace == "Special" )
        return;  // don't display link for special pages

    url = wgServer + "/wiki/index.php?title=Special:Log&page=" + encodeURIComponent(wgPageName);

    addPortletLink("p-tb", url, "Page logs", "pt-logs");
});
//
// --------------------------------------------------------
// user rights
// adds a link in the tool box while on user pages to a user's rights management page. 
// --------------------------------------------------------
addOnloadHook(function () {
     if (!rights_isAdmin)
        return; //Restrict this feature to admins.
    if (wgNamespaceNumber != "2" && wgNamespaceNumber != "3")
        return;  // restrict to User and User talk
 
    var title = wgTitle;
 
    addPortletLink('p-tb', '/wiki/index.php?title=Special:Userrights/'+title,
                   'User rights', 't-userrights', 'User rights for "'+title+'"');
 
});
//

// --------------------------------------------------------
// adminrights.js          (adapted from http://en.wikipedia.org/wiki/User:Ais523/adminrights.js)
// This script changes the color of links to admins' userpages in the bodyContent of Special, History pages, diff pages,
// and old page revisions.
// ("bodyContent" being everything but the tabs,personal links at the top of the screen and sidebar).
// --------------------------------------------------------

var adminrights=new Array();
 
importScript('MediaWiki:Adminlist.js');
 
//Highlighting script. Based on [[User:ais523/highlightmyname.js]].
 
function highlightadmins(n,p) //node, parent node
{
  while(n!=null)
  {
    if(n.nodeType==1&&n.tagName.toLowerCase()=="a") //anchor
    {
      if(n.href.indexOf("/wiki/index.php?title=User:")!=-1)
      {
        var u=n.href.split("/wiki/index.php?title=User:")[1];
        if(adminrights[u.split("_").join("%20")]==1)
        {
          n.style.color="#00CC00";
          if(n.className==null||n.className=="") n.className="ais523_adminrights_admin";
          else n.className+="ais523_adminrights_admin";
        }
        n=n.nextSibling;
      }
      else if(n.href.indexOf("/wiki/index.php?title=User:")!=-1)
      {
        var u=n.href.split("/wiki/index.php?title=User:")[1];
        if(adminrights[u.split("_").join("%20")]==1)
        {
          n.style.color="#00CC00";
          if(n.className==null||n.className=="") n.className="ais523_adminrights_admin";
          else n.className+=" ais523_adminrights_admin";
        }
        n=n.nextSibling;
      }
      else
      {
        if(n.firstChild!=null) highlightadmins(n.firstChild,n);
        n=n.nextSibling;
      }
    }
    else
    {
      if(n.firstChild!=null) highlightadmins(n.firstChild,n);
      n=n.nextSibling;
    }
  }
}


if (wgCanonicalNamespace == 'Special' || wgAction == 'history' || document.URL.indexOf('diff=') > 0 || document.URL.indexOf('oldid=') > 0)
{
addOnloadHook(function() {
    highlightadmins(document.getElementById('bodyContent').firstChild,
                    document.getElementById('bodyContent'));
});
}
 
//

// --------------------------------------------------------
// Patrol tab
// adds a "marked as patrolled" tab to pages that have that link already on it.
// Once patrolled, the button turns into a button to go to the recent changes
// with patrolled edits hidden. Further speeding up patrolling.
// The second function of the button has the same access key.
// --------------------------------------------------------
function patroltab() {
if (document.URL.indexOf('&rcid=') > 0 && wgAction != 'markpatrolled')
{
 addPortletLink ('p-cactions', "/wiki/index.php?title=" + encodeURIComponent(wgPageName) + "&action=markpatrolled&rcid=" + document.location.toString().split('&rcid=')[1].split('&'), 'patrol', 'ca-patrol', 'Mark as patrolled', '1');
}
else if (document.URL.indexOf('&rcid=') > 0 && wgAction == 'markpatrolled')
{
 addPortletLink ('p-cactions', "/wiki/index.php?title=Special:RecentChanges&hidepatrolled=1", 'return', 'ca-return', 'Return to unpatrolled recent changes', '1');
}
}
addOnloadHook(patroltab);
//

// --------------------------------------------------------
// Recent Changes Edit Colors
// Colors the page size changes on the recent changes
// --------------------------------------------------------
importStylesheetURI("http://zeldawiki.org/User:Matt/RC_Colors.css" + "&ctype=text/css&action=raw");
//

/*gotten from http://en.wiktionary.org/w/index.php?title=MediaWiki:Common.js on 10/16/2010*/
/*
=== DOM creation ===
<pre>*/
/**
 * Create a new DOM node for the current document.
 *    Basic usage:  var mySpan = newNode('span', "Hello World!")
 *    Supports attributes and event handlers*: var mySpan = newNode('span', {style:"color: red", focus: function(){alert(this)}, id:"hello"}, "World, Hello!")
 *    Also allows nesting to create trees: var myPar = newNode('p', newNode('b',{style:"color: blue"},"Hello"), mySpan)
 *
 * *event handlers, there are some issues with IE6 not registering event handlers on some nodes that are not yet attached to the DOM,
 * it may be safer to add event handlers later manually.
**/
function newNode(tagname){

  var node = document.createElement(tagname);
  
  for( var i=1;i<arguments.length;i++ ){
    
    if(typeof arguments[i] == 'string'){ //Text
      node.appendChild( document.createTextNode(arguments[i]) );
      
    }else if(typeof arguments[i] == 'object'){ 
      
      if(arguments[i].nodeName){ //If it is a DOM Node
        node.appendChild(arguments[i]);
        
      }else{ //Attributes (hopefully)
        for(var j in arguments[i]){
          if(j == 'class'){ //Classname different because...
            node.className = arguments[i][j];
            
          }else if(j == 'style'){ //Style is special
            node.style.cssText = arguments[i][j];
            
          }else if(typeof arguments[i][j] == 'function'){ //Basic event handlers
            try{ node.addEventListener(j,arguments[i][j],false); //W3C
            }catch(e){try{ node.attachEvent('on'+j,arguments[i][j],"Language"); //MSIE
            }catch(e){ node['on'+j]=arguments[i][j]; }}; //Legacy
          
          }else{
            node.setAttribute(j,arguments[i][j]); //Normal attributes

          }
        }
      }
    }
  }
  
  return node;
}
/*</pre>






/*
#########
### ProjectLinks
###  by [[user:Pathoschild]] (idea from an older, uncredited script)
###    * generates a sidebar list of links to other projects from {{projectlinks}}
#########
*/
function Projectlinks() {
        var elements = new Array();
        var spans = document.getElementsByTagName('span');
        
        // filter for projectlinks
        for (var i=0, j=0; i<spans.length; i++) {
                if (spans[i].className == 'interProject') {
                        elements[j] = spans[i].getElementsByTagName('a')[0];
                        j++;
                }
        }

        if (j == 0)
            return;
        
        // sort alphabetically
        function sortbylabel(a,b) {
                // get labels
                a = a.innerHTML.replace(/^.*<a[^>]*>(.*)<\/a>.*$/i,'$1');
                b = b.innerHTML.replace(/^.*<a[^>]*>(.*)<\/a>.*$/i,'$1');

                // return sort order
                if (a < b) return -1;
                if (a > b) return 1;
                return 0;
        }
        elements.sort(sortbylabel);
        
        // Create the list of project links
        var pllist = newNode('ul');
        for (var i=0; i<elements.length; i++) {
                pllist.appendChild(newNode('li', elements[i]));
        }
        var projectBox = newNode('div', {'class': 'portlet portal', id: 'p-projects'}, 
            newNode('h5', 'On other wikis'),
            newNode('div', {'class': 'pBody body'}, pllist)
        );

        var insert = document.getElementById('p-tb');
        if (!insert)
            return;

        if (insert.nextSibling)
            insert.parentNode.insertBefore(projectBox, insert.nextSibling);
        else
            insert.parentNode.appendChild(projectBox);
}

addOnloadHook(Projectlinks);

/************/
//  addOnloadHook( createNavigationBarToggleButton );

// Code courtesy of pcj of WoWWiki.
// This is a modified version of the WoWWiki site version, in that it is designed for global.js use.

// Code adds a checkbox at the top of the Special:RecentChanges list, next to the header.
// Ticking it sets a cookie (should be individual to wikis) and starts updating the RC list.
// This occurs silently every 60 seconds without a full page reload occuring.

function setCookie(c_name,value,expiredays) {
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value) + ((expiredays==null) ? "" : ";expires="+exdate.toGMTString())
}

function getCookie(c_name) {
if (document.cookie.length>0) {
c_start=document.cookie.indexOf(c_name + "=")
if (c_start!=-1) { 
c_start=c_start + c_name.length+1 
c_end=document.cookie.indexOf(";",c_start)
if (c_end==-1) c_end=document.cookie.length
return unescape(document.cookie.substring(c_start,c_end))
} 
}
return ""
}

function getXmlHttpRequestObject() {
if (window.XMLHttpRequest) {
return new XMLHttpRequest(); //Not Internet Explorer
} else if(window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP"); //Internet Explorer
} else {
//fail silently
}
}
getRCDataRO = getXmlHttpRequestObject();
var cr = new RegExp("\r", "gm");
var lf = new RegExp("\n", "gm");
var endText = new RegExp('</div>[\t\s]*?<!-- end content -->[\t\s]*?<div class="visualClear">', "mi");
var rcTimer;
var rcRefresh = 60000;
function preloadAJAXRC() {
s = 0;
ajaxRCCookie = getCookie("ajaxRC")=="on" ? true:false;
document.getElementsByTagName("h1")[s].innerHTML += '&nbsp;<span style="font-size: xx-small; border-bottom: 1px dotted; cursor:help;" title="Enable auto-refreshing recent changes">AUTO-REFRESH:</span><input type="checkbox" id="ajaxRCtoggle" onClick="toggleRC();">';
document.getElementById("ajaxRCtoggle").checked = ajaxRCCookie;
if (getCookie("ajaxRC")=="on") loadRCData();
}

function toggleRC() {
if (document.getElementById("ajaxRCtoggle").checked == true) {
setCookie("ajaxRC", "on", 30);
loadRCData();
} else {
setCookie("ajaxRC", "off", 30);
clearTimeout(rcTimer);
}
}

function loadRCData() {
if (getRCDataRO.readyState == 4 || getRCDataRO.readyState == 0) {
if (location.href.indexOf("/")) {
rcURL = "http://" + location.hostname + "/Special:RecentChanges" + location.search;
} else {
rcURL = "http://" + location.hostname + "/Special:RecentChanges" + location.search;
}
getRCDataRO.open("GET", rcURL, true);
getRCDataRO.onreadystatechange = parseRCdata;
getRCDataRO.send(null);
}
}

function parseRCdata() {
if (getRCDataRO.readyState == 4) {
textFilter = new RegExp('<div id="bodyContent">.*?</div>[\t\s]*?<!-- end content -->[\t\s]*?<div class="visualClear">', "i");
rawRCdata = getRCDataRO.responseText.replace(cr, "").replace(lf, "");
filteredRCdata = textFilter.exec(rawRCdata);
updatedText = filteredRCdata[0].replace('<div id="bodyContent">', "").replace(endText, "");
document.getElementById("bodyContent").innerHTML = updatedText;
rcTimer = setTimeout("loadRCData();", rcRefresh);
}
}

if (wgPageName == "Special:RecentChanges") addOnloadHook(preloadAJAXRC);