MediaWiki:Common.js

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

/* MediaWiki:All.js */ mw.loader.load('//splatoonwiki.org/wiki/MediaWiki:All.js?action=raw&ctype=text/javascript');

// ================================================================================ // Injection into Upload Wizard for custom licensing and categories // ================================================================================ //https://commons.wikimedia.org/wiki/Commons:Upload_Wizard/Editing#License_options //https://www.mediawiki.org/wiki/Extension:UploadWizard/CustomWikiTextLicenseFeature

if ("UploadWizard" === mw.config.get('wgCanonicalSpecialPageName')) { mw.loader.using('ext.uploadWizard', function {    try {      var autoAdd = mw.config.get('UploadWizardConfig').autoAdd;      // Add a custom category to all my upload wizard uploads      // autoAdd.categories.push("Images");

// Add a custom license tag to all my files uploaded using the sorcerer autoAdd.wikitext += ""; } catch (ex) { mw.log("Injecting custom-category into UploadWizard failed.", ex); } }); }

/////////////////////////////////////////////////////////////////////////////// //                              Gobbler Class                               // ///////////////////////////////////////////////////////////////////////////////

// Folds all infoboxes into a single, tabbed element

// Object constructor var Gobbler = function {

// Check for a gobbler object in the document this.element = document.getElementById("gobbler"); if (!this.element) return;

// Gobble all of the infoboxes on the page var elements = document.getElementsByClassName("tagInfobox"); var tabs    = []; for (var x = 0; x < elements.length; x++) tabs.push(this.gobble(elements[x])); // 1-index for user niceness; 1 is "first" var initial = parseInt(this.element.dataset.initial) - 1; if (isNaN(initial) || initial < 0 || initial >= tabs.length) initial = tabs.length - 1; // default last tab this.onTab(tabs[initial]);

// Add the infoboxes and tab buttons to the gobbler element var tabStrip = document.createElement("div"); tabStrip.style.textAlign = "left"; if (tabs.length > 1) this.element.appendChild(tabStrip); for (var x = 0; x < tabs.length; x++) { tabStrip.appendChild(tabs[x].button); this.element.appendChild(tabs[x].element); }

};

// Process an infobox Gobbler.prototype.gobble = function(element) {

// Retrieve the infobox's hidden tab button element var button = element.getElementsByClassName("tagTab")[0];

// Create a tab object using the contents of the element var tab = { button:       button, colorInactive: button.style.backgroundColor, colorActive:  button.style.outlineColor, element:      element, cssText:      element.style.cssText };

// Configure element properties var that = this; element.style.cssText = "width: 100%; height: 100%; display: none;"; button.style.display = "inline"; button.onmousedown   = function(e) { if (e.button == 0) that.onTab(tab); };   return tab; };

// Event handler for when a tab is selected/clicked Gobbler.prototype.onTab = function(tab) { // Error checking when new gobbler is present if (!tab) return;

// Deselect the previous infobox if (this.current) { this.current.button.style.fontWeight     = "normal"; this.current.button.style.backgroundColor = this.current.colorInactive; this.current.element.style.display       = "none"; }

// Select the new infobox this.element.style.cssText      = tab.cssText; tab.button.style.fontWeight     = "bold"; tab.element.style.display       = "inline"; tab.button.style.backgroundColor = tab.colorActive; this.current                    = tab; };

$( document ).ready(function {   new Gobbler;    // 3D/2D viewer    $('.switch-to-3d').click(function { $('.container-2d').hide; $('.viewer-3d, .viewer-3d-multi, .buttons-container-3d').show; });

$('.switch-to-2d').click(function {	   $('.viewer-3d, .viewer-3d-multi, .buttons-container-3d').hide;	    $('.container-2d').show;    }); });

// ================================================================================ // Warning message in console to help prevent scams // ================================================================================ setTimeout(function {    console.log("%cHold up squiddo!", "color:rgb(170, 220, 0);font-family:Splatoon2, sans-serif;font-size:40px")   console.log("%cIf someone told you to paste something here, there is a 99% chance you're getting scammed!", "font-family:Splatoon2, sans-serif;font-size:15px")   console.log("%cPasting anything here could give scammers access to your account", "color:red;font-family:Splatoon2, sans-serif;font-size:15px")   console.log("%cUnless you know what you're doing, don't paste anything here!", "font-family:Splatoon2, sans-serif;font-size:25px") }, 1500)

// ================================================================================ // 3D/2D Viewer // ================================================================================

// 3D model viewer var viewer3d = { dragging: null, draggingFrameX: 0, draggingFrameY: 0, viewers: [], frameThresholdX: 10, frameThresholdY: 128, realMod: function(x, y) { return ((x % y) + y) % y;	}, init: function { $('.viewer-3d').each(viewer3d.bind); $(document).mouseup(viewer3d.release); $(document).mousemove(viewer3d.move); },	bind: function { var v = $(this); var num = viewer3d.viewers.length; var allModels = []; var modelID = 0; var viewerSize = 0; while(true) { var modelMap = v.find('.viewer-3d-map-' + modelID); var urlNode = v.find('.viewer-3d-url-' + modelID); if(!modelMap.length || !urlNode.length) break; var url = $(' ').html(urlNode.text).text; var framesS = $(' ').html(modelMap.text).text.replace(/^\s+|\s+$/g).split(/,/g); var frameMap = []; var heightMap = []; var leftCropMap = []; var totalW = parseInt(framesS[0]); var maxFrameW = parseInt(framesS[1]); var totalH = parseInt(framesS[2]); var verticalSteps = parseInt(framesS[3]); var midVertical = Math.floor(verticalSteps / 2); for(var f = 4; f < framesS.length; f += 3) { frameMap.push(parseInt(framesS[f])); heightMap.push(parseInt(framesS[f + 1])); leftCropMap.push(parseInt(framesS[f + 2])); }			allModels.push({				imageURL: url,				map: frameMap,				cropMap: leftCropMap,				totalWidth: totalW,				totalHeight: totalH,				maxFrameWidth: maxFrameW,				xStep: verticalSteps			}); viewerSize = Math.max(viewerSize, totalH, maxFrameW); modelID++; }		if(!modelID) return; var overlayNode = $(' '); var frameN = v.find('.viewer-3d-frame'); v.find('img').detach; var klasses = v.attr('class').split(/ /g); var startFrame = 0; for(var k in klasses) { if(klasses[k].substr(0, 11) == 'startframe-') { startFrame = Math.max(0, parseInt(klasses[k].substr(11))); }		}		var viewer = { node: v,			frameX: startFrame, frameY: midVertical, models: allModels, currentModel: -1, frameNode: frameN, width: viewerSize, height: viewerSize, mouseX: 0, mouseY: 0, overlay: overlayNode };		viewer3d.viewers.push(viewer); v.hover(viewer3d.hover, viewer3d.unhover).mousedown(viewer3d.drag).append(overlayNode).attr('data-id', num).css({			width: viewer.width + 'px',			height: viewer.height + 'px'		}); frameN.mousedown(viewer3d.drag).attr('data-id', num).css('height', viewer.height + 'px'); viewer3d.changeVersion(viewer, 0); },	getCurrentModel: function(v) { return v.models[v.currentModel]; },	changeVersion: function(v, version) { version = Math.max(0, Math.min(v.models.length - 1, version)); if(v.currentModel == version) return; v.currentModel = version; v.frameNode.css('background', 'url(' + viewer3d.getCurrentModel(v).imageURL + ') top left no-repeat'); viewer3d.display(v, v.frameX, v.frameY); },	hover: function(e) { var v = viewer3d.getViewer(this); if(viewer3d.dragging != v) { v.overlay.animate({'opacity': '1'}, 'fast'); }	},	unhover: function(e) { var v = viewer3d.getViewer(this); if(viewer3d.dragging != v) { v.overlay.animate({'opacity': '0.5'}, 'fast'); }	},	drag: function(e) { var v = viewer3d.getViewer(this); v.mouseX = e.pageX; v.mouseY = e.pageY; viewer3d.dragging = v;		draggingFrameX = v.frameX; draggingFrameY = v.frameY; return false; },	release: function { var v = viewer3d.dragging; viewer3d.dragging = null; if(v != null) { v.frameX = viewer3d.draggingFrameX; v.frameY = viewer3d.draggingFrameY; v.overlay.animate({'opacity': '0.5'}, 'fast'); }		viewer3d.draggingFrameX = 0; viewer3d.draggingFrameY = 0; },	getViewer: function(node) { return viewer3d.viewers[parseInt($(node).attr('data-id'))]; },	display: function(v, frameX, frameY) { var model = viewer3d.getCurrentModel(v); var frameID = viewer3d.realMod(frameX * model.xStep + frameY, model.map.length); var frameOffset = model.map[frameID]; var frameWidth = 0; if(frameID == model.map.length - 1) { frameWidth = model.totalWidth - frameOffset; } else { frameWidth = model.map[frameID + 1] - frameOffset; }		v.frameNode.css({			backgroundPosition: (-frameOffset - frameID) + 'px 0px',			left: Math.round((v.width - model.maxFrameWidth) / 2.0 + model.cropMap[frameID]) + 'px',			top: Math.round((v.height - model.totalHeight) / 2) + 'px',			width: frameWidth + 'px',			height: model.totalHeight + 'px'		}); },	move: function(e) { if(viewer3d.dragging == null) { return; }		var v = viewer3d.dragging; var model = viewer3d.getCurrentModel(v); var mouseDeltaX = e.pageX - v.mouseX; var mouseDeltaY = e.pageY - v.mouseY; var frameDeltaX = Math.round(mouseDeltaX / viewer3d.frameThresholdX); var frameDeltaY = -Math.round(mouseDeltaY / viewer3d.frameThresholdY); viewer3d.draggingFrameX = v.frameX + frameDeltaX; viewer3d.draggingFrameY = Math.max(0, Math.min(model.xStep - 1, v.frameY + frameDeltaY)); viewer3d.display(v, viewer3d.draggingFrameX, viewer3d.draggingFrameY); } }; $(viewer3d.init); var selector3d = { bind: function { var viewer = viewer3d.getViewer($(this).find('.viewer-3d')); var keepGoing = true; var modelVariant = 0; var selector; while(keepGoing) { selector = $(this).find('.selector-' + modelVariant); if(selector.length) { selector.attr('data-variant', modelVariant).click(function {					viewer3d.changeVersion(viewer, parseInt($(this).attr('data-variant')));					return false;				}); }			modelVariant++; keepGoing = selector.length; }	},	init: function { $('.viewer-3d-multi, .viewer-3d-container').each(selector3d.bind); } }; $(selector3d.init);

// Code to get 3D viewer drag working on touch devices // Source: http://www.jquery4u.com/mobile/jquery-add-dragtouch-support-ipad/ $.fn.addTouch = function{ this.each(function(i,el){     $(el).bind('touchstart touchmove touchend touchcancel',function{ //we pass the original event object because the jQuery event //object is normalized to w3c specs and does not provide the TouchList handleTouch(event); });   });

var handleTouch = function(event) {     var touches = event.changedTouches, first = touches[0], type = '';

switch(event.type) {       case 'touchstart': type = 'mousedown'; break;

case 'touchmove': type = 'mousemove'; event.preventDefault; break;

case 'touchend': type = 'mouseup'; break;

default: return; }

var simulatedEvent = document.createEvent('MouseEvent'); simulatedEvent.initMouseEvent(type, true, true, window, 1, first.screenX, first.screenY, first.clientX, first.clientY, false, false, false, false, 0/*left*/, null); first.target.dispatchEvent(simulatedEvent); }; };

$('.viewer-3d').addTouch;

// End 3D viewer touch device code