Forum:Coding/Javascript

From GuildWiki

Contents 1 Explanation 2 NavBar "widget" for Monobook 3 Page-top tabs 3.1 GWW Switch 3.2 Purge 3.3 Credits 4 Custom edit buttons

[edit] Explanation

These are some helpful Javascript function to add various types of functionality to the wiki. Feel free to add other useful functions or modify these to make them more useful. To use them, copy the code (in the gray boxes below) to your personal JavaScript page:

• If you use the default Monaco skin, use monaco.js
• If you have switched to the Monobook skin, use monobook.js

[edit] NavBar "widget" for Monobook

This function lets you add a custom box with custom links to Monobook's navigation bar, similar to a Monaco widget.

 function addBar() 
 {
  document.getElementById('p-navigation').innerHTML += 
  '</div>'+
  '<div id=p-my wiki links=portlet>'+
    '<h5>Command Center</h5>'+                                // Name the box whatever you want
    '<div id=commandCenterDiv class=pBody><ul>'+              // Also name the div as you like, to use in your .css
    '<li id=\><a href=\"/wiki/Main Page">Main Page</a></li>'+ // Copy this line for each link
    '</ul></div></div>';
 }

 addOnloadHook(addBar);

[edit] Page-top tabs

These functions add tabs to the top of each page on the wiki for easy access to common tasks.

[edit] GWW Switch

Adds a tab that links to the same article on Guild Wars Wiki.

function addGWWSwitch() 
{
    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', 
      'http://wiki.guildwars.com/wiki/'+wgCanonicalNamespace+':'+encodeURIComponent(wgTitle),
      'GWW', 'ca-gww', 'See this page on Guild Wars Wiki', 'g');
}
addOnloadHook(addGWWSwitch);

[edit] Purge

Adds a tab that will purge the server's cache of that article.

 function addPurge() 
 {
    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', '0');
 }
 addOnloadHook(addPurge);

[edit] Credits

Adds a tab that will display the credits for the article.

 function addCredits() 
 {
    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([&#]|$)/, '$1credits$2'),
                   'credits', 'ca-credits', 'Display article credits', '0');
 }
 addOnloadHook(addCredits);

[edit] Custom edit buttons

This function allows you to add to the line of edit buttons above the edit box. See WikiaHelp:Custom edit buttons for more info and Wikia:Category:Custom edit buttons/Commons:Category:ButtonToolbar for premade button icons.

/***** Custom edit buttons ****/
 if (mwCustomEditButtons) {
   mwCustomEditButtons[mwCustomEditButtons.length] = {
     "imageFile": "http://images.wikia.com/central/images/2/23/Button_code.png", // Image file to use
     "speedTip": "Code",
     "tagOpen": "<code>",     // What to insert before the selected text
     "tagClose": "</code>",   // What to insert after the selected text
     "sampleText": "foo"}     // Text to insert between if nothing is selected
     // tagOpen or tagClose can be null, i.e. to insert a self-closing tag like "<br />"
  }