MediaWiki:Mobile.js
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.
/* All JavaScript here will be loaded for users of the mobile site */
/*
* @author Kyrptonaught
* @link github.com/kyrptonaught
*/
function replace(input, beginStr, endStr, match, replaceWith) {
var beginIndex = input.indexOf(beginStr);
var endIndex = input.indexOf(endStr, beginIndex);
while (beginIndex > -1 && endIndex > -1) {
var matchIndex = input.indexOf(match, beginIndex);
while (matchIndex > beginIndex && matchIndex < endIndex) {
input = input.substring(0, matchIndex) + replaceWith + input.substring(matchIndex + match.length);
matchIndex = input.indexOf(match, beginIndex);
}
beginIndex = input.indexOf(beginStr, endIndex);
endIndex = input.indexOf(endStr, beginIndex);
}
return input;
}
jQuery( document ).ready( function( $ ){
var textInput = document.getElementById("minecraft-text-input");
var itemCountInput = document.getElementById("item-count-input");
var textOutputContainer = document.getElementById('minecraft-text-output-container');
var itemInput = document.getElementById("item-input");
var outputItem = document.getElementById("output-item");
var obfuscatedTextManager = document.createElement("k-manager");
// Filter to make tooltips crispy
var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.setAttribute("class", "offscreen");
svg.setAttribute("width", "0");
svg.setAttribute("height", "0");
var defs = document.createElementNS("http://www.w3.org/2000/svg", "defs");
svg.appendChild(defs);
var filter = document.createElementNS("http://www.w3.org/2000/svg", "filter");
filter.setAttribute("id", "crispify");
var feComponentTransfer = document.createElementNS("http://www.w3.org/2000/svg", "feComponentTransfer");
filter.appendChild(feComponentTransfer);
var feFuncA = document.createElementNS("http://www.w3.org/2000/svg", "feFuncA");
feFuncA.setAttribute("type", "discrete");
feFuncA.setAttribute("tableValues", "0 1");
feComponentTransfer.appendChild(feFuncA);
defs.appendChild(filter);
document.body.appendChild(svg);
// The code below generates the following div:
//<div id="minecraft-tip" class="minecraft-tip">
//<div id="tip-text-line" class="text-line"></div>
//<div id="tip-shadow-line" class="shadow-line"></div>
//</div>
var mcTip = document.createElement("div");
mcTip.id = "minecraft-tip";
mcTip.classList.add("minecraft-tip");
var tipTextLine = document.createElement("div");
tipTextLine.id = "tip-text-line";
tipTextLine.classList.add("text-line");
mcTip.appendChild(tipTextLine);
var tipShadowLine = document.createElement("div");
tipShadowLine.id = "tip-shadow-line";
tipShadowLine.classList.add("shadow-line");
mcTip.appendChild(tipShadowLine);
document.body.appendChild(mcTip);
var textOutputFormatted;
var reformat = function(string) {
console.log(string);
textOutputFormatted = string.replace(/&/g, '&')
.replace(/</g, "<")
.replace(/>/g, ">")
.replace(/&el/g, '§r<br class="empty-line">')
.replace(/&nbsp/g, '§r<div class="no-break-space"></div>')
.replace(/\\\\/g, '\')
.replace(/\\n/g, '§r<br class="break">')
.replace(/\\/g, '');
if (!textOutputFormatted.substring(textOutputFormatted.lastIndexOf("§k")).includes("§r")) {
textOutputFormatted += "§r";
}
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§0", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§1", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§2", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§3", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§4", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§5", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§6", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§7", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§8", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§9", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§a", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§b", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§c", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§d", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§e", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§f", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§g", "");
textOutputFormatted = replace(textOutputFormatted, "§k", "§r", "§h", "");
textOutputFormatted = textOutputFormatted.replace(/§0/g, '</span><span class="c-0">')
.replace(/§1/g, '</span><span class="c-1">')
.replace(/§2/g, '</span><span class="c-2">')
.replace(/§3/g, '</span><span class="c-3">')
.replace(/§4/g, '</span><span class="c-4">')
.replace(/§5/g, '</span><span class="c-5">')
.replace(/§6/g, '</span><span class="c-6">')
.replace(/§7/g, '</span><span class="c-7">')
.replace(/§8/g, '</span><span class="c-8">')
.replace(/§9/g, '</span><span class="c-9">')
.replace(/§a/g, '</span><span class="c-a">')
.replace(/§b/g, '</span><span class="c-b">')
.replace(/§c/g, '</span><span class="c-c">')
.replace(/§d/g, '</span><span class="c-d">')
.replace(/§e/g, '</span><span class="c-e">')
.replace(/§f/g, '</span><span class="c-f">')
.replace(/§g/g, '</span><span class="c-g">')
.replace(/§h/g, '</span><span class="c-6-bedrock">')
.replace(/§l/g, '<b class="c-l">')
.replace(/§o/g, '<i class="c-o">')
.replace(/§n/g, '<n class="c-n">')
.replace(/§m/g, '<m class="c-m">')
.replace(/§k/g, '<k class="c-k">')
.replace(/§r/g, '</span></b></i></n></m></k>');
obfuscatedTextManager.innerHTML = textOutputFormatted.replace(/<k class="c-k">/g, '<k class="c-k-manager">');
return textOutputFormatted;
};
// Removes the title from every element with the .minecraft-item class to give space for the tooltip instead
$(".minecraft-item").each(function(event) {
this.title = '';
$(this).find("*").removeAttr("title");
});
$(".minecraft-item").on("mouseover mousemove", function(event) {
event.stopPropagation();
console.log(this.dataset.mctitle);
tipTextLine.innerHTML = tipShadowLine.innerHTML = reformat(this.dataset.mctitle);
$(mcTip).css("display", "block");
// Sets X position of the tip, considering possible overflow to the right
var x;
if (window.innerWidth - event.pageX - 11 - event.pageX % 2 < $(mcTip).outerWidth(true)) {
x = event.pageX - event.pageX % 2 - $(mcTip).outerWidth(true);
} else {
x = event.pageX + 13 - event.pageX % 2;
}
// Sets Y position of the tip, considering possible overflow to the top
var y;
if (event.pageY - 28 - event.pageY % 2 < $(document).scrollTop()) {
y = event.pageY + 17 - event.pageY % 2 - $(document).scrollTop();
} else {
y = event.pageY - 31 - event.pageY % 2 - $(document).scrollTop();
}
$(mcTip).css("left", x);
$(mcTip).css("top", y);
});
$(".minecraft-item").mouseout(function(event) {
$(mcTip).css("display", "none");
});
/* §k text */
var randomizeTextInterval = setInterval(function() {
randomizeText();
}, 50);
function randomizeText() {
for (var group = 0; group < obfuscatedTextManager.getElementsByClassName("c-k-manager").length; group++) {
var length = obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.length;
var result = "";
var widthNine = 'æÆ';
var widthEight = '░▒▓│┤╡╢╖╕╣║╗╝╜╛┐└┴┬├─┼╞╟╚╔╩╦╠═╬╧╨╤╥╙╘╒╓╫╪┘┌█▄▌▐▀';
var widthSeven = 'øØ∞∅⌠⌡∙';
var widthSix = '@~«»≡≈√';
var widthFive = 'ABCDEFGHJKLMNOPQRSTUVWXYZabcdeghjmnopqrsuvwxyzÀÁÂÈÊËÓÔÕÚßãõ0123456789#$%&-=_+\\/?ÇüéâäàåçêëèÄÅÉôöòûùÖÜ£×áóúñÑ¿®¬±÷∈≥≤π';
var widthFour = 'fk<>°ⁿ⁰²³⁴⁵⁶⁷⁸⁹ªº';
var widthThree = '¨I[]{}()^î*ïît͹';
var widthTwo = 'íìl´`';
var widthOne = "iı'!,.:;|¡·";
for (var i = 0; i < length; i++) {
if (widthNine.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthNine.charAt(Math.floor(Math.random() * widthNine.length));
} else if (widthEight.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthEight.charAt(Math.floor(Math.random() * widthEight.length));
} else if (widthSeven.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthSeven.charAt(Math.floor(Math.random() * widthSeven.length));
} else if (widthSix.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthSix.charAt(Math.floor(Math.random() * widthSix.length));
} else if (widthFour.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthFour.charAt(Math.floor(Math.random() * widthFour.length));
} else if (widthThree.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthThree.charAt(Math.floor(Math.random() * widthThree.length));
} else if (widthTwo.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthTwo.charAt(Math.floor(Math.random() * widthTwo.length));
} else if (widthOne.includes(obfuscatedTextManager.getElementsByClassName("c-k-manager")[group].textContent.charAt(i))) {
result += widthOne.charAt(Math.floor(Math.random() * widthOne.length));
} else {
result += widthFive.charAt(Math.floor(Math.random() * widthFive.length));
}
}
tipTextLine.getElementsByClassName("c-k")[group].innerHTML = tipShadowLine.getElementsByClassName("c-k")[group].innerHTML = result;
}
}
// Get all elements with data-background-image attribute
var elementsWithDataAttr = document.querySelectorAll('[data-bgimage]');
// Iterate through each element and set its background image
for (var i = 0; i < elementsWithDataAttr.length; i++) {
var el = elementsWithDataAttr[i];
var imageUrl = el.getAttribute('data-bgimage');
el.style.backgroundImage = "url(" + imageUrl + ")";
}
// Slots with multiple items inside cycle through the items
var inventorySlots = Array.from(document.querySelectorAll('.inventory-slot'));
inventorySlots.forEach(function(inventorySlot) {
var currentIndex = 0;
if (inventorySlot.childElementCount > 0) {
inventorySlot.children[currentIndex].style.display = 'inline-block';
}
if (inventorySlot.childElementCount > 1) {
var lastTime = 0;
var animate = function(currentTime) {
if (currentTime - lastTime > 2000) {
lastTime = currentTime;
inventorySlot.children[currentIndex].style.display = 'none';
currentIndex = (currentIndex + 1) % inventorySlot.childElementCount;
inventorySlot.children[currentIndex].style.display = 'inline-block';
}
requestAnimationFrame(animate);
};
requestAnimationFrame(animate);
}
});
});