Fandom

Wikia Developers Wiki

JavaScript Cookbook

859pages on
this wiki
Add New Page
Talk24 Share

If you use JavaScript at Fandom a lot, you'll find yourself using the same functions again and again. So let's make a collection of those functions you copypaste from project to message wall to forum post to project and back.

Variables

Caching config

Caches config variables that use mw.config.get
var config = mw.config.get( [
	'skin',
	'wgAction',
	'wgArticlePath',
	'wgCanonicalSpecialPageName',
	'wgPagename',
	'wgTitle',
	'wgSiteName'
] );

Skins

Detect the skin

determines the wiki's skin taking variants into account
returns 'oasis' or 'monobook' or false
function getSkin () {
    switch (mw.config.get('skin')) {
        case 'oasis':
        case 'wikia':
            return 'oasis';
        case 'uncyclopedia':
        case 'wowwiki':
        case 'monobook':
            return 'monobook';
        default:
            return false;
    }
}

Colors

Determine Brightness

determines whether a color is bright
description Can be used to find out if a fore- or background color is bright or dark. That enables you to pick a high-contrast color for back- or foreground.
parameter1 color (can be in rgb or hexadecimal format - color names are not supported)
returns whether color is bright (boolean)
function isBright (color) {
    var m = color.match(/(?:([\da-fA-F]{2})([\da-fA-F]{2})([\da-fA-F]{2}))|(?:(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3}))/);
    if (!m) return false;
    var rgb = m[1] ? { r: parseInt(m[1], 16), g: parseInt(m[2], 16), b: parseInt(m[3], 16) }
                   : { r: parseInt(m[4], 10), g: parseInt(m[5], 10), b: parseInt(m[6], 10) };
    return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000 >= 128;
}

Get Background Color

determines the article area's background color
returns color (string/css-value)
function getBackgroundColor () {
    var bgColor = $('#WikiaPageBackground').css('background-color');
    if ('transparent' == bgColor) bgColor = $('#WikiaPage').css('background-color');
    if ('transparent' == bgColor) bgColor = $('#EditPageHeader').css('background-color');
    return bgColor;
}

Execution

After DOM

Runs the code once the DOM has finished loading, using a jQuery ready callback
$(function() {
  //code to run
});

After MW API

Runs the code once the MediaWiki API JavaScript library has finished loading
mw.loader.using('mediawiki.api', function() {
  //code to run
});

After MW Utilities

Runs the code once the MediaWiki Utilities JavaScript Library has finished loading
mw.loader.using('mediawiki.util', function() {
  //code to run
});

After MW API and Utilities

Runs the code once the MediaWiki API and Utilities libraries have finished loading
mw.loader.using(['mediawiki.util', 'mediawiki.api'], function() {
  //code to run
});

After Chat

Runs the code once the chat has finished loading
var chatLoader = setInterval(function() {
  if (typeof mainRoom !== "undefined") {
    //code to run
    clearInterval(chatLoader); 
  }
}, 200);

References

Start a Discussion Discussions about JavaScript Cookbook

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.