As8D (Message Wall | contribs) (Scavenger hunt-like feature. :)) |
(No difference)
|
Revision as of 03:31, 29 March 2020
$(function() {
let now = new Date(); // Only allow the 2020 April Fools effect on or after April 1st, 2020.
if (!(now.getUTCFullYear() > 2020 || now.getUTCMonth() > 2)) return;
let secretPages = ["Frail_Wooden_Sword","Guttermouth_Set","Kingrat"];
for (let i = 0; i < secretPages.length; i++) {
if ($("body").hasClass("page-" + secretPages[i])) { // For the given pages, add a small button.
let imgClicker = document.createElement("div");
imgClicker.className = "ffa2020-img-clicker";
$("#mw-content-text").children().last().after(imgClicker);
let imgClass = "ffa2020-img-popup ffa2020-img-popup-" + i;
let isOpen = false;
// Adds a popup showing the secret image. Click the popup to close it.
$(imgClicker).click(function() {
if (isOpen) return;
isOpen = true;
let popup = document.createElement("div");
popup.className = imgClass;
$(popup).click(() => {
$(popup).remove();
isOpen = false;
});
$("body").append(popup);
});
}
}
// We only apply the 2020 April Fools effect on the article 'Ratboy Secrets'.
if (!$("body").hasClass("page-Ratboy_Secrets")) return;
let article = $("#WikiaArticle");
let trigger = document.createElement("div");
trigger.className = "ffa2020-trigger";
article.after(trigger);
let triggerSymbols = ["#","_","-","/","\\","!","0","1","~","^","*","CL1CK"];
let glitchEffect = setInterval(() => {
trigger.innerText = triggerSymbols[Math.floor(Math.random() * triggerSymbols.length)];
}, 50);
// ——————————————————————————————————————————————————
// TextScramble - taken from https://codepen.io/soulwire/pen/mErPAK
// Changed to work with native JS stuff instead of Babel?
// ——————————————————————————————————————————————————
function TextScramble(el, callback) {
this.el = el;
this.chars = '!<>-_\\/[]{}—=+*^?#________';
this.queue = [];
this.setText = function(newText) {
var oldText = this.el.innerText;
var length = Math.max(oldText.length, newText.length);
var self = this;
var promise = new Promise(function(resolve) { self.resolve = resolve; });
this.queue = [];
for (var i = 0; i < length; i++) {
var from = oldText[i] || '';
var to = newText[i] || '';
var start = Math.floor(Math.random() * 20);
var end = start + Math.floor(Math.random() * 80);
this.queue.push({ from: from, to: to, start: start, end: end });
}
cancelAnimationFrame(this.frameRequest);
this.frame = 0;
this.update();
return promise;
};
this.update = function() {
var output = '';
var complete = 0;
for (var i = 0, n = this.queue.length; i < n; i += 2) {
var from = this.queue[i].from,
to = this.queue[i].to,
start = this.queue[i].start,
end = this.queue[i].end,
char = this.queue[i].char;
if (this.frame >= end) {
complete++;
output += to;
} else if (this.frame >= start) {
if (!char || Math.random() < 0.28) {
char = this.randomChar();
this.queue[i].char = char;
}
output += '<span class="dud">' + char + '</span>';
} else {
output += from;
}
}
this.el.innerHTML = output;
if (complete === this.queue.length) {
this.resolve();
} else {
var self = this;
this.frameRequest = requestAnimationFrame(function() {
self.update();
});
this.frame++;
}
};
this.randomChar = function() {
return this.chars[Math.floor(Math.random() * this.chars.length)];
};
}
let sleep = (ms) => new Promise(completed => setTimeout(completed, ms));
$(trigger).click(async function() { // User clicks weird glitchy letter, which triggers April Fools.
clearInterval(glitchEffect);
glitchEffect = null;
$(trigger).remove(); // Removes the single-use button.
// We want to swap to our secret page, so we remove the current page.
// Reversible by reloading the webpage.
let leafs = article.find("#mw-content-text *:not(:has(*))");
leafs.each((_, elem) => {
$(elem).addClass("glitch-text");
// Puts all our Promises into an array to wait for all to finish.
new TextScramble(elem).setText("").then(() => {
$(elem).remove();
});
});
article.find("#mw-content-text").fadeOut(1000);
await sleep(1000);
article.find("#mw-content-text").html(`<style>.ffa2020-banner {
text-align: center;
font-size: 48px;
height: 90px;
line-height: 90px;
font-family: 'Rubik', sans-serif;
font-weight: bold;
color: white;
background-image: url('https://vignette.wikia.nocookie.net/central/images/0/06/4c16092a4679406fbcdb566a07a9d3cf.png');
background-size: contain;
background-repeat: no-repeat;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
}
.ffa2020-banner-bg {
background-color: #17191A;
width: auto;
height: 100%;
position: inherit;
margin-left: 77px;
margin-bottom: -90px;
}
.ffa2020-content {
background-color: #222529;
background-color: rgba(34, 37, 41, 0.61);
margin: 0 5px;
padding: 10px 15px;
background-image: url('https://vignette.wikia.nocookie.net/central/images/d/d0/50f21bfedcda29bb515451050c0238db.png');
background-position: center bottom;
background-size: contain;
background-repeat: no-repeat;
padding-bottom: 110px;
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
}
.ffa2020-content img {
width: 261px;
margin: 7px 0;
border-radius: 3px;
box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
}
.ffa2020-inline {
display: inline-flex;
flex-direction: column;
}
.ffa2020-inline-text {
display: inline-block;
}
.ffa2020-horizontal {
display: inline-flex;
margin: 10px 0;
}
span.ffa2020-cite {font-family: 'Rubik', sans-serif;font-weight: lighter;font-style: italic;font-size: 14px;line-height: 14px;}
.ffa2020-pull-left {
float: left;
margin-right: 15px;
}
.ffa2020-pull-right {
float: right;
margin-left: 15px;
}
.ffa2020-sl-item:before {content: counter(item) "";counter-increment: item;display: inline-block;width: 36px;height: 36px;background-color: rgba(0, 0, 0, 0.5);border-radius: 50%;text-align: center;line-height: 36px;font-family: 'Rubik', sans-serif;font-size: 24px;font-weight: lighter;margin-left: -60px;}
.ffa2020-sl {
counter-reset: item;
margin-top: 30px;
}
.ffa2020-sl-item {
margin-bottom: 12px;
margin-left: 60px;
display: flex;
flex-direction: row;
align-items: center;
}
.ffa2020-sl-item:after {content: '';background-image: url('https://vignette.wikia.nocookie.net/central/images/1/1e/877ea6abb99d4d5ba56e274bd91b1c6a-1.png');background-repeat: no-repeat;display: inline-block;width: 100%;height: 24px;background-size: 83%;margin-left: 20px;}
.ffa2020-sl-item-2:after {
background-position-y: center;
}
.ffa2020-sl-item-3:after {
background-position-y: bottom;
}</style><div class="ffa2020-banner">
<div class="ffa2020-banner-bg"></div>
D4T4 4RCH1V3 ØW-2
</div>
<div class="ffa2020-content">Tomorrow’s “Dream of the Beyond” update introduces the long-lost <a>Empire of the Dragonkind</a> as an explorable new realm for you and your fellow adventurers.<br>One of the sweet perks it comes with is a portal for easy access to all major hub areas from the relative comfort of your own golden chambers of the <a>Dreamy Dragon</a>.<br><br>Each week, one of the three major <a>Ratboy Orders</a> that make up the governing force preceding that of <a>Kenneth’s Paroxysm Flower Helmet</a>, will send an emissary to the Empire of the Dragonkind with a chest for you. Complete the daily <a>Boss Encounter</a> in the <a>Fantastic Ratboy Achievement Section</a> to earn <i>Achievement Points</i> that can be used to open the chest once per week. The chest resets on Monday 7:30 AM EST.<br>
<div class="ffa2020-horizontal">
<div class="ffa2020-inline ffa2020-pull-left">
<img src="https://vignette.wikia.nocookie.net/central/images/5/58/Dimdimich-screenshot-1.png">
<img src="https://vignette.wikia.nocookie.net/central/images/3/3e/Dimdimich-screenshot-2.png">
</div>
<div class="ffa2020-inline-text">The new update also brings some more coherent story-element to the game, which has long been void.<br>In early brainstorming, the developer team considered the idea of creating content like <a>Bonus Missions</a>.<br><br>
I’ll give you a short recap of the memo you can find in-game once the update lands:<br><span class="ffa2020-cite">”A Pact squadron tracking the whereabouts of The Eternal Ratboy to the north of the <a>Endless Forest</a> were ambushed by <a>bandits</a>, with <a>Squad Leader Croctear</a> and numerous others taken hostage by <a>Malifice the Monstrous</a>. In response, rescue teams were formed to track them down in this dangerous, uncharted territory.<br>In <a>Spirit Vale</a>, the group faced heavy opposition from Malifice’s bandits, who were well equipped and had fortified themselves among the bestial <a>Seeker of Souls</a>.”</span></div>
</div><div class="ffa2020-horizontal">
<div class="ffa2020-inline-text">The journey to the Empire of the Dragonkind and all its secrets and monsters is something to look forward to. To break the ice a little, the <a>Rats of Donglemoore</a> have provided a small shopping list for you to complete - and obtain the mightiest weapon of all.<br><br>
Good luck, adventurer!<br>
<div class="ffa2020-sl">
<div class="ffa2020-sl-item ffa2020-sl-item-1"></div>
<div class="ffa2020-sl-item ffa2020-sl-item-2"></div>
<div class="ffa2020-sl-item ffa2020-sl-item-3"></div>
</div>
</div><div class="ffa2020-inline ffa2020-pull-right">
<img src="https://vignette.wikia.nocookie.net/central/images/b/b8/Dimdimich-screenshot-3.png">
<img src="https://vignette.wikia.nocookie.net/central/images/4/41/Dimdimich-screenshot-4.png">
</div>
</div>
</div>`).fadeIn();
});
});