MediaWiki:Common.js

Revision as of 05:44, June 16, 2016 by Turboo (talk | contribs)

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* Any JavaScript here will be loaded for all users on every page load. */

/* Automatically add Aboutfile template to file upload description. Source: nl.wikipedia.org/wiki/MediaWiki:Common.js */
if (mw.config.get('wgCanonicalSpecialPageName') === 'Upload' && !document.getElementById('wpForReUpload') && !document.getElementsByClassName('warning')[0] && !document.getElementsByClassName('error')[0]) {
	function loadAutoAboutfileTemplate() {
		uploadDescription = document.getElementById('wpUploadDescription');
		var doubleBracket = '{' + '{';
		uploadDescription.value = doubleBracket + 'aboutfile\n|1=Subject of the image\n|2=Where you found the image\n|3=Artist\n|4=Describe edits, if any\n|5=Other versions (use file link)\n}}';
	}

	addOnloadHook(loadAutoAboutfileTemplate);
}

/* Auto-refresh button on Special:RecentChanges */
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 "";
}
var ajaxPages = new Array("Special:RecentChanges");
var ajaxRCOverride = false;
var rcRefresh = 30000;
function ajaxRC() {
	appTo = $(".firstHeading");
	appTo.append('&nbsp;<span style="position:absolute; right:12px;"><span style="position:relative; top:2px;"><span style="position:relative; top:-12px; right:-15px;" id="autoRefreshProgress"><img src="/images/loader.gif" border="0" alt="AJAX operation in progress" /></span><span style="font-size: xx-small; cursor:help;" title="Automatically refresh the current page every ' + Math.floor(rcRefresh / 1000) + ' seconds">AUTO-REFRESH:</span><input type="checkbox" id="autoRefreshToggle"></span></span>');
	$("#autoRefreshToggle").click(function () {
		setCookie("ajaxRC", $("#autoRefreshToggle").is(":checked") ? "on" : "off")
		loadRCData()
	});
	$("#autoRefreshProgress").hide();
	if (getCookie("ajaxRC") == "on" || ajaxRCOverride) {
		$("#autoRefreshToggle").attr("checked", "checked");
		setTimeout("loadRCData();", rcRefresh);
	}
}
function loadRCData() {
	if (!$("#autoRefreshToggle").is(":checked")) return;
	$('#autoRefreshProgress').show()
	$(article).load(location.href + " " + article + " > *", function (data) {
		$(article + " .mw-collapsible").makeCollapsible();
		$('#autoRefreshProgress').hide()
		if ($("#autoRefreshToggle").is(":checked")) setTimeout("loadRCData();", rcRefresh);
	});
}
$(function () {
	article = "#bodyContent";
	for (x in ajaxPages) {
		if (wgPageName == ajaxPages[x] && $("#autoRefreshToggle").length == 0) ajaxRC();
	}
});

function setUpSynchTable () {
  var tables = document.getElementsByClassName("awardsSynchronisedTable");
  for (var k = 0; k < tables.length; k++) {
    var rows = tables[k].rows;
    for (var i = 0; i < rows.length; i++) {
      var cells = rows[i].cells;
      for (var j = 0; j < cells.length; j++) {
        cells[j].style.verticalAlign = "top";
        var synchDiv = document.createElement("DIV");
        synchDiv.style.position = "relative";
        synchDiv.className = "synchDiv";
        var childs = cells[j].childNodes;
        while (childs.length > 0) {
          synchDiv.appendChild(childs[0]);
        }
        cells[j].appendChild(synchDiv);
      }
    }
  }
  if (tables.length > 0) {
    document.onscroll = synchTableOnScroll;
  }
}

function synchTableOnScroll() {
  
  var divs = document.getElementsByClassName("synchDiv");
  for (var i = 0; i < divs.length; i++) {
    var parent = divs[i].parentNode;
    var parentRect = parent.getBoundingClientRect();
    var offset;
    if (window.innerHeight > divs[i].offsetHeight) {
      offset = Math.min(Math.max(-1 * parentRect.top, 0), parent.clientHeight - divs[i].offsetHeight);
    } else {
      offset = Math.min(Math.max(-1 * parentRect.top / (parent.clientHeight - window.innerHeight) * (parent.clientHeight - divs[i].offsetHeight), 0), parent.clientHeight - divs[i].offsetHeight);
    }
    divs[i].style.top = offset + "px";
  }
}

setUpSynchTable();

/******************************************************************************
 * Shroom Youtube Popups                                                      *
 ******************************************************************************/

function shroomYoutubeController () {
  
    var spans = document.getElementsByClassName("shroomYoutube"); 

    if (spans.length == 0) {
        return;
    }

    this.APIReady = false;
    this.APIContinue = function () {};
    onYouTubeIframeAPIReady = function () {
        this.APIReady = true;
        this.APIContinue;
    }.bind(this);
    this.players = [];

    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

    this.containerDiv = document.createElement("div");
    this.containerDiv.className = "shroomYoutubeContainer";
    var shadeDiv = document.createElement("div");
    shadeDiv.className = "shroomYoutubeShade";
    shadeDiv.onclick = this.hideContainer.bind(this);
    this.bgDiv = document.createElement("div");
    this.bgDiv.className = "shroomYoutubeBg";
    var throbber = document.createElement("div");
    throbber.className = "shroomThrobber";
    this.bgDiv.appendChild(throbber);
    var closeButton = document.createElement("div");
    closeButton.className = "shroomYoutubeClose";
    closeButton.onclick = this.hideContainer.bind(this);
    this.bgDiv.appendChild(closeButton);
    this.containerDiv.appendChild(shadeDiv);
    this.containerDiv.appendChild(this.bgDiv);
    document.body.appendChild(this.containerDiv);

    for (var i = 0; i < spans.length; i++) {
        new shroomYoutubeInstance (this, spans[i]) 
    }
  
}

function shroomYoutubeInstance (parent, span) {
  
  this.parent = parent;
  this.span = span;
  this.link = this.span.getElementsByTagName("a")[0];
  this.videoWrapper = document.createElement("div");
  this.videoWrapper.class = "shroomYoutubeVideoWrapper";
  parent.bgDiv.appendChild(this.videoWrapper);
  this.link.onclick = this.showWrapper.bind(this);
  
}

shroomYoutubeInstance.prototype.showWrapper = function (e) {
  
  if (e.button == 0 &&
      !e.ctrlKey &&
      !e.altKey &&
      !e.shiftKey) {
    if (!this.parent.APIReady) {
      this.parent.containerDiv.className="shroomYoutubeContainer visible";
      this.parent.APIContinue = this.span.onclick; //should invoke this function again...
      return false;
    } else if (this.videoWrapper.firstChild == null) {
      this.videoWrapper.appendChild(document.createElement("div"));
      var player = new YT.Player(this.videoWrapper.firstChild, {
        width: '420',
        height: '315',
        videoId: this.span.dataset.video,
        events: {
          'onReady': this.onPlayerReady.bind(this),
          'onStateChange': this.onPlayerStateChange.bind(this)
        }
      });
      this.parent.addPlayer(player);
    }
    var visibles = this.parent.containerDiv.getElementsByClassName("visible");
    while (visibles.length > 0) {
      visibles[0].className="shroomYoutubeVideoWrapper";
    }
  
    this.parent.containerDiv.className="shroomYoutubeContainer visible";
    this.videoWrapper.className="shroomYoutubeVideoWrapper visible";
    return false;
  } else {
    return true;
  }
  
}

shroomYoutubeInstance.prototype.onPlayerStateChange = function (e) {
  
  switch (e.data) {
    case -1:
    case 0:
    case 5:
      this.span.className = "shroomYoutube stopState";
      break;
    case 1:
      this.parent.pauseOthers(e);
    case 3:
      this.span.className = "shroomYoutube playState";
      break;
    case 2:
      this.span.className = "shroomYoutube pauseState";
      break;
  }
  
}

shroomYoutubeInstance.prototype.onPlayerReady = function (e) {
  e.target.playVideo();
}

shroomYoutubeController.prototype.pauseOthers = function(e) {
  for (var i = 0; i < this.players.length; i++) {
    if (this.players[i] != e.target) {
      this.players[i].pauseVideo();
    }
  }
}

shroomYoutubeController.prototype.hideContainer = function () {
  this.containerDiv.className="shroomYoutubeContainer";
}

shroomYoutubeController.prototype.addPlayer = function (player) { 
  
  this.players.push(player);
  
}

new shroomYoutubeController ();


/** pollspinner *****************************************************************
 *
 * description: this shows every awards poll to a user on the main page
 * maintainers: 2257
 */

function pollspinner_callback( json ) {
 
    var obj = jQuery.parseJSON( json );
 
    if ( obj.result == 'registered' || obj.result == 'already-registered' ) {
        
        var spinner = document.getElementsByClassName("pollspinner")[0];
        spinner.className = "pollspinner animated throbbing";

        window.setTimeout(function() {

            var spinner = document.getElementsByClassName("pollspinner")[0];
            spinner.className = "pollspinner animated";
            spinner.getElementsByClassName("pollspinnerbox active")[0].className = "pollspinnerbox answered";
            var unansweredPolls = spinner.getElementsByClassName("pollspinnerbox unanswered")
    
            if (unansweredPolls.length > 0) {

                var nextPoll = Math.floor(Math.random() * unansweredPolls.length);
                spinner.style.height = unansweredPolls[nextPoll].offsetHeight + "px";
                unansweredPolls[nextPoll].className = "pollspinnerbox active";

            } else {

                var end = spinner.getElementsByClassName("pollspinnerend")
                end[0].className = "pollspinnerend active";

                if (mw.config.get("wgUserName") == null) {

                    end[0].innerHTML = "The power of the Votes is restored to the poll... and it's all thanks to you! Thank you!";

                } else {

                    end[0].innerHTML = mw.config.get("wgUserName") + "! The power of the Votes is restored to the poll... and it's all thanks to you! Thank you, " + mw.config.get("wgUserName") + "!";

                }

                spinner.style.height = end[0].offsetHeight + "px";

            }
        }, 2000)
    }
};



function setupPollSpinner () {
    
    var spinner = document.getElementsByClassName("pollspinner")[0];

    if (spinner != null) {

        var preload = new Image();
        preload.src = "http://wiki.userpedia.net/images/8/82/Pollthrobber.png";

        this.pd_callback = pollspinner_callback;
        spinner.className = "pollspinner animated";
        var pollSpinnerBoxes = spinner.getElementsByClassName("pollspinnerbox");
        var activeIndex = Math.floor(Math.random() * pollSpinnerBoxes.length);
        pollSpinnerBoxes[activeIndex].className = "pollspinnerbox active";
        spinner.style.height = pollSpinnerBoxes[activeIndex].offsetHeight + "px";
        
        for (var i = 0; i < pollSpinnerBoxes.length; i++) {
            if (i != activeIndex) {
    
                pollSpinnerBoxes[i].className = "pollspinnerbox unanswered" 
                
            }
        }
    }
}

setupPollSpinner();