MediaWiki:Common.js

From The Binding of Isaac Godmode Wiki
Jump to navigation Jump to search

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.
// FLY LOGIC //

// constants
var flyDim = 100;
var flySizeVar = 0.25;
var flyMaxVelAdd = 2.5;
var flySnapToAnchorDamp = 50.0;
var flyMouseDistThres = flyDim * 3;
var shadowOff = 20;
var flyParameters = {
	min: 0,
	max: 2
};

// static vars
var xDistThres = window.innerWidth / 3;
var yDistThres = window.innerHeight / 3;
var mousePos;

// https://stackoverflow.com/questions/7790725/javascript-track-mouse-position
document.onmousemove = handleMouseMove;
function handleMouseMove(event) {
    var dot, eventDoc, doc, body, pageX, pageY;

    event = event || window.event; // IE-ism

    // If pageX/Y aren't available and clientX/Y are,
    // calculate pageX/Y - logic taken from jQuery.
    // (This is to support old IE)
    if (event.pageX == null && event.clientX != null) {
        eventDoc = (event.target && event.target.ownerDocument) || document;
        doc = eventDoc.documentElement;
        body = eventDoc.body;

        event.pageX = event.clientX +
          (doc && doc.scrollLeft || body && body.scrollLeft || 0) -
          (doc && doc.clientLeft || body && body.clientLeft || 0);
        event.pageY = event.clientY +
          (doc && doc.scrollTop  || body && body.scrollTop  || 0) -
          (doc && doc.clientTop  || body && body.clientTop  || 0 );
    }

    mousePos = {
        x: event.pageX,
        y: event.pageY
    };
}

window.addEventListener("resize", function() {
	xDistThres = window.innerWidth / 5;
	yDistThres = window.innerHeight / 5;
})

function clamp(x,a,b)
{
	return Math.max(a,Math.min(x,b));
}

function updateFlyPos(flyDiv)
{
	flyDiv.style.left = flyDiv.getAttribute("xpos") + "px";
	flyDiv.style.top = flyDiv.getAttribute("ypos") + "px";
}

function updateFlyAnchor(flyDiv)
{
	flyDiv.setAttribute("xanchor", window.innerWidth / 2);
	flyDiv.setAttribute("yanchor", window.innerHeight / 2);
}


/* Any JavaScript here will be loaded for all users on every page load. */
function createFly()
{
	var flyDiv = document.createElement("div");
	flyDiv.style.position = 'fixed';
	flyDiv.style.opacity = 0.0;
	flyDiv.className = "fly";
	flyDiv.setAttribute("xpos",Math.random() * window.innerWidth);
	flyDiv.setAttribute("ypos",Math.random() * window.innerHeight);
	flyDiv.setAttribute("xvel","0");
	flyDiv.setAttribute("yvel","0");
	flyDiv.setAttribute("opacity","0");
	
	var size = 1.0 + (Math.random() * flySizeVar * 2 - flySizeVar);
	flyDiv.style.width = (flyDim * (1.0 + flySizeVar)) + "px";
	flyDiv.style.height = (flyDim * (1.0 + flySizeVar)) + "px";
	flyDiv.setAttribute("size", size);

	var flyAnim = document.createElement("img");
	flyAnim.src = "/images/9/9e/AnimFly.gif";
	flyAnim.style.width = flyDim * size + "px";
	flyAnim.style.height = "auto";
	flyAnim.style.left = -shadowOff + "px";
	flyAnim.style.top = -shadowOff + "px";
	flyAnim.style.position = "relative";

	if(Math.random() < 0.5)
	{
		flyDiv.className = "fly fly-rev";
	}
	
	flyDiv.appendChild(flyAnim);

	flyAnim.addEventListener("click", function(event)
	{
		var flyDiv = event.target.parentElement;
		
		flyDiv.children[0].src = "https://tboigodmode.wiki.gg/images/6/6a/BloodExplode.gif";
		clearInterval(Number(flyDiv.getAttribute("intervalID")));
		flyDiv.className = "noclick";
		
		setTimeout(function(flyDiv){
			flyDiv.remove();
		}, 500, flyDiv);
		
		setTimeout(function(flyDiv) {
			var size = Number(flyDiv.getAttribute("size"));
			
			flyDiv.setAttribute("xpos",Number(flyDiv.getAttribute("xpos")) - flyDim * 0.5 * size);
			flyDiv.setAttribute("ypos",Number(flyDiv.getAttribute("ypos")) - flyDim * 0.5 * size);
			updateFlyPos(flyDiv);
			flyDiv.children[0].style.width = flyDim * 2 * size + "px";
		}, 100, flyDiv);
	});
	
	window.addEventListener("resize", function(event)
	{
		updateFlyAnchor(flyDiv);
	});

	flyDiv.setAttribute("intervalID",setInterval(function(flyDiv){
		flyDiv.setAttribute("opacity",Number(flyDiv.getAttribute("opacity")) + 0.01);
		flyDiv.style.opacity = clamp(Number(flyDiv.getAttribute("opacity")), 0.0, 1.0);
		var centOff = Number(flyDiv.getAttribute("size")) * flyDim / 2;
		var x = Number(flyDiv.getAttribute("xpos")) + centOff;
		var y = Number(flyDiv.getAttribute("ypos")) + centOff;
		var xanch = Number(flyDiv.getAttribute("xanchor"));
		var yanch = Number(flyDiv.getAttribute("yanchor"));
		var xvel = Number(flyDiv.getAttribute("xvel"));
		var yvel = Number(flyDiv.getAttribute("yvel"));
		
		var xrand = Math.floor(Math.random() * 100);
		var yrand = Math.floor(Math.random() * 100);

		var targX = (Math.abs(xanch - x) > xDistThres ? clamp((xanch - x) / flySnapToAnchorDamp, -1, 1) : (Math.random() - 0.5)) * flyMaxVelAdd;
		var targY = (Math.abs(yanch - y) > yDistThres ? clamp((yanch - y) / flySnapToAnchorDamp, -1, 1) : (Math.random() - 0.5)) * flyMaxVelAdd;
		
		if(mousePos && Math.abs(mousePos.x - x) < flyMouseDistThres && Math.abs(mousePos.y - y) < flyMouseDistThres)
		{
			targX = targX * 0.75 + clamp((mousePos.x - x) / flySnapToAnchorDamp,-flyMaxVelAdd,flyMaxVelAdd) * 0.25;
			targY = targY * 0.75 + clamp((mousePos.y - y) / flySnapToAnchorDamp,-flyMaxVelAdd,flyMaxVelAdd) * 0.25;
		}
		
		flyDiv.setAttribute("xvel",xvel * 0.9 + targX);
		flyDiv.setAttribute("yvel",yvel * 0.9 + targY);

		flyDiv.setAttribute("xpos",x + xvel - centOff);
		flyDiv.setAttribute("ypos",y + yvel - centOff);
		updateFlyPos(flyDiv);
	},20,flyDiv));
	
	updateFlyPos(flyDiv);
	updateFlyAnchor(flyDiv);
	
	document.body.appendChild(flyDiv);
}

var loc = window.location.href;

if(loc.includes("Main_Page"))
{
	var numFlies = Math.floor(Math.random() * (flyParameters.max - flyParameters.min)) + flyParameters.min;

	for(var i = 0; i <= numFlies; ++i)
	{
		createFly();
	}
}

var mobileWidth = 720;
var mwPanel = document.getElementById("mw-panel");
var content = document.getElementById("content");
var mobileLayoutFunc = function(event) {
	if(window.innerWidth < mobileWidth)
	{
		mwPanel.className = "mobile";
		content.style = "font-size: 1em !important;";
	}
	else
	{
		mwPanel.className = "";
		content.style = "";
	}
};


var updateMW = function()
{
	var pos = getVerticalScrollPercentage(document.body) / 100.0;
	var contentBound = content.children[0].children[0].getBoundingClientRect();
	var panelBound = mwPanel.getBoundingClientRect();
	
	if(mwPanel.className != "mobile") {
		if(mwPanel.getAttribute("intervalID") == ""){
			mwPanel.style = "";
			// add to navigation
			mwPanel.remove();
			document.getElementById("mw-navigation").appendChild(mwPanel);
		}
		
		var min = 80;
		var max = 200;
		var cur = contentBound.bottom - (panelBound.bottom - panelBound.y);
		// mwPanel.style.top = Math.max(min, Math.min(max, cur)) + "px";
		mwPanel.style.top = Math.max(min, Math.min(max, panelBound.y + panelSpeed,(cur - panelBound.y) / 5.0)) + "px";
		
		// if(mwPanel.getAttribute("intervalID") != "")
		// {
		// 	clearInterval(Number(mwPanel.getAttribute("intervalID")));
		// }
		
		// mwPanel.setAttribute("intervalID",setInterval(function(mwPanel,cur){
		// 	var bound = mwPanel.getBoundingClientRect();
		// 	mwPanel.style.top = bound.y + Math.max(-panelSpeed,Math.min(panelSpeed,(cur - bound.y) / 10.0)) + "px";
			
		// 	if(mwPanel.style.top == cur)
		// 	{
		// 		clearInterval(Number(mwPanel.getAttribute("intervalID")));
		// 	}
		// },20,mwPanel,Math.max(min, Math.min(max, cur))));
	} 
	else
	{
		if(mwPanel.getAttribute("intervalID") != ""){
			clearInterval(Number(mwPanel.getAttribute("intervalID")));
			mwPanel.setAttribute("intervalID","");
			mwPanel.style = "top: 40%; width: 70% !important; margin: auto 10% !important;";
			
			// add to accordion
			mwPanel.remove();
			document.getElementById("p-personal").children[1].appendChild(mwPanel);

		}
	}
}


window.addEventListener('resize', mobileLayoutFunc, true);
window.addEventListener('scroll', updateMW, true);
window.addEventListener('resize', updateMW, true);
mobileLayoutFunc();
updateMW();

var header = document.getElementById("wikigg-header");
var panelSpeed = 5.0; //max and min panel speed
// mw-panel movement logic and wiki gg header back logic
document.onscroll = function(){ 
	var pos = getVerticalScrollPercentage(document.body) / 100.0;
	
	updateMW();
	
	if(pos > 0)
	{
		header.className = "back";
	}
	else 
	{
		header.className = "";
	}
}

function getVerticalScrollPercentage( elm ){
	var p = elm.parentNode;
	return (elm.scrollTop || p.scrollTop) / (p.scrollHeight - p.clientHeight ) * 100
}

//google font api - Ubuntu
var font_links = [ "https://fonts.googleapis.com/css2?family=Ubuntu:wght@500&display=swap" ];

if(font_links.length > 0)
{
	var link1 = document.createElement("link");
	link1.href = "https://fonts.googleapis.com";
	link1.rel = "preconnect";
	var link2 = document.createElement("link");
	link2.href = "https://fonts.gstatic.com";
	link2.rel = "preconnect";
	link2.setAttribute("crossorigin","");
	document.head.appendChild(link1);
	document.head.appendChild(link2);
	
	for (var i = 0; i < font_links.length; ++i)
	{
		var fontLink = document.createElement("link");
		fontLink.href = font_links[i];
		fontLink.rel = "stylesheet";
		document.head.appendChild(fontLink);
	}
}
Retrieved from "https://tboigodmode.wiki.gg/index.php?title=MediaWiki:Common.js&oldid=2056"