User:RogueToad/global.js

const hideSpoilerWarning = (container) => { // Remember that the user has seen this warning, for future visits. localStorage.setItem('ir-spoiler-warning-state', 'seen'); document.body.classList.remove('ir-spoiler-blur'); container.remove; };

const showSpoilerWarning = => {

// Create the needed DOM elements for the popup, with relevant classnames. const container = document.createElement('div'); container.classList.add('ir-spoiler-full-window');

const popup = document.createElement('div'); popup.classList.add('ir-spoiler-popup-box');

const heading = document.createElement('h2'); heading.innerText = "Spoilers ahead!!";

const warning = document.createElement('p'); warning.innerText = `Welcome to the Infinite Realm Wiki! However, be warned that the content here reflects the current state of the ongoing web novel, Infinite Realm: Monsters and Legends.`;

const advice = document.createElement('p'); advice.innerHTML = `To avoid spoilers, make sure you've read the first three volumes on kindle unlimited, as well as the latest chapters on Royal Road before continuing.`;

const button = document.createElement('button'); button.classList.add('ir-spoiler-button', 'mw-ui-button'); button.innerText = "Continue"; button.onclick = => hideSpoilerWarning(container);

// Combine DOM elements into the popup, and then insert into the overlay flexbox. popup.append(heading, warning, advice, button); container.append(popup);

// Add blur then show the popup document.body.classList.add("ir-spoiler-blur"); document.body.appendChild(container);

};

console.log("Running global custom js");

window.addEventListener("load", => {  // Only show warning if the user hasn't seen it before (according to cache)  if (localStorage.getItem('ir-spoiler-warning-state') === null)    showSpoilerWarning; });