MediaWiki:Common.js: Difference between revisions

From Rhythm Game Wiki
Jump to navigation Jump to search
mNo edit summary
No edit summary
Tag: Manual revert
 
(19 intermediate revisions by the same user not shown)
Line 16: Line 16:
findAndExecute(".rgwiki-main-negative-tabindex", (element) => {
findAndExecute(".rgwiki-main-negative-tabindex", (element) => {
     element.tabIndex = -1;
     element.tabIndex = -1;
});
/* Links without href/links to "javascript:void(0)" are not allowed by MediaWiki, this is a workaround */
/* Use Template:EmptyLink to activate this piece of code. */
findAndExecute(".rgwiki-main-emptylink", (span) => {
  const a = span.querySelector("a");
  for (const className of span.classList) {
    if (className !== "rgwiki-main-emptylink") {
      a.classList.add(className);
    }
  }
  a.href = "javascript:void(0)";
  const parent = span.parentNode;
  parent.replaceChild(a, span);
});
});


Line 26: Line 40:
});
});


/* Trivia box */
/* OS tabs */
findAndExecute(".rgwiki-main-trivia-box", (div) => {
findAndExecute(".tabber.rgwiki-main-os-tabber", (tabber) => {
     function roll() {
     const osString = (window.navigator.oscpu || window.navigator.platform || window.navigator.userAgent).toLowerCase();
        const ul = div.querySelector("ul");
     let userOs = null;
        const oldActive = ul.querySelectorAll(".rgwiki-main-trivia-active").forEach(x => x.classList.remove("rgwiki-main-trivia-active"))
     if (osString.includes("linux")) userOs = "linux";
        const elementCount = ul.childElementCount;
    if (osString.includes("mac")) userOs = "mac";
        const rand = Math.floor(Math.random() * elementCount);
     if (osString.includes("win")) userOs = "win";
        ul.children[rand].classList.add("rgwiki-main-trivia-active");
    }
    const a = document.createElement("a");
    a.classList.add("rgwiki-main-trivia-button");
    a.href = "javascript:void(0)";
    a.addEventListener("click", roll);
     a.textContent = "[reroll]";
    div.appendChild(a);
    roll();
});
 
/* Rizline clickable bio chips */
findAndExecute(".rgwiki-rizline-bio-chip-focusable", (chip) => {
     chip.addEventListener("click", () => {
        const isLeft = chip.classList.contains("rgwiki-rizline-bio-chip-left");
        const isRight = chip.classList.contains("rgwiki-rizline-bio-chip-right");
        if (isLeft) {
            document.querySelectorAll(".rgwiki-rizline-bio-chip-focusable.rgwiki-rizline-bio-chip-left.rgwiki-rizline-bio-chip-clicked").forEach((x) => {
                x.classList.remove("rgwiki-rizline-bio-chip-clicked");
            });
        }
        if (isRight) {
            document.querySelectorAll(".rgwiki-rizline-bio-chip-focusable.rgwiki-rizline-bio-chip-right.rgwiki-rizline-bio-chip-clicked").forEach((x) => {
                x.classList.remove("rgwiki-rizline-bio-chip-clicked");
            });
        }
        chip.classList.add("rgwiki-rizline-bio-chip-clicked");
    });
});
 
/* Gadvia Score Calculator */
findAndExecute(".rgwiki-gadvia-score-calculator", (root) => {
    root.textContent = "";
 
     function createFormField(root, labelText) {
        const fieldContainer = document.createElement("div");
        fieldContainer.style.display = "flex";
        fieldContainer.style.flexDirection = "column";
 
        const label = document.createElement("label");
        label.textContent = labelText;
        fieldContainer.appendChild(label);
 
        const inputElement = document.createElement("input");
        inputElement.type = "number";
        inputElement.size = 8;
        fieldContainer.appendChild(inputElement);
 
        root.appendChild(fieldContainer);
        return inputElement;
    }
 
    const fields = document.createElement("div");
    fields.style.display = "flex";
    fields.style.gap = "1em";
    fields.style.alignItems = "end";
 
    const inputGoldPerfect = createFormField(fields, "Gold Perfect");
    const inputAnyPerfect = createFormField(fields, "Any Perfect");
    const inputGreat = createFormField(fields, "Great");
    const inputGood = createFormField(fields, "Good");
    const inputMiss = createFormField(fields, "Miss");
 
    const calculateBtn = document.createElement("button");
    calculateBtn.textContent = "Calculate";
    fields.appendChild(calculateBtn);
 
    root.appendChild(fields);
 
    const output = document.createElement("p");
    root.appendChild(output);


     calculateBtn.addEventListener("click", () => {
     const oldAnchor = window.location.hash;
         const goldPerfect = Number(inputGoldPerfect.value);
    tabber.querySelectorAll(".tabber__header > .tabber__tabs > a.tabber__tab").forEach(tab => {
         const anyPerfect = Number(inputAnyPerfect.value);
         const tabName = tab.textContent.toLowerCase();
         const great = Number(inputGreat.value);
         if (userOs === "linux" && tabName.includes("linux")) tab.click();
        const good = Number(inputGood.value);
         if (userOs === "mac" && tabName.includes("macos")) tab.click();
         const miss = Number(inputMiss.value);
         if (userOs === "win" && tabName.includes("windows")) tab.click();
        const hitNotes = anyPerfect + great + good;
        const totalNotes = anyPerfect + great + good + miss;
        const nonGoldPerfect = anyPerfect - goldPerfect;
        const score = Math.floor((anyPerfect + (great * 0.8) + (good * 0.5)) / totalNotes * 1000000) + (goldPerfect * 0.0001);
        output.innerHTML = `<b>Score:</b> ${score}<br><b>Hit notes:</b> ${hitNotes}/${totalNotes}<br><b>Non-gold perfects:</b> ${nonGoldPerfect}`;
     });
     });
    setTimeout(() => {
        window.location.hash = oldAnchor;
    }, 100);
});
});

Latest revision as of 07:52, 11 March 2025

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

/* Finds elements by a selector and executes a function for each element */
function findAndExecute(selector, callback) {
    const elements = document.querySelectorAll(selector);
    elements.forEach((element) => {
        try {
            callback(element);
        } catch (e) {
            console.error(`Error while initializing "${selector}"`, e);
        }
    });
}

/* tabindex="-1" is not allowed by MediaWiki, this is a workaround */
findAndExecute(".rgwiki-main-negative-tabindex", (element) => {
    element.tabIndex = -1;
});

/* Links without href/links to "javascript:void(0)" are not allowed by MediaWiki, this is a workaround */
/* Use Template:EmptyLink to activate this piece of code. */
findAndExecute(".rgwiki-main-emptylink", (span) => {
  const a = span.querySelector("a");
  for (const className of span.classList) {
    if (className !== "rgwiki-main-emptylink") {
      a.classList.add(className);
    }
  }
  a.href = "javascript:void(0)";
  const parent = span.parentNode;
  parent.replaceChild(a, span);
});

/* Localized date */
findAndExecute(".rgwiki-main-date-localized", (span) => {
    const inputDateString = span.dataset.datetime !== undefined ? span.dataset.datetime : span.textContent;
    const date = new Date(inputDateString);
    const outputDateString = date.toString();
    span.title = `This date in your timezone: ${outputDateString}`;
});

/* OS tabs */
findAndExecute(".tabber.rgwiki-main-os-tabber", (tabber) => {
    const osString = (window.navigator.oscpu || window.navigator.platform || window.navigator.userAgent).toLowerCase();
    let userOs = null;
    if (osString.includes("linux")) userOs = "linux";
    if (osString.includes("mac")) userOs = "mac";
    if (osString.includes("win")) userOs = "win";

    const oldAnchor = window.location.hash;
    tabber.querySelectorAll(".tabber__header > .tabber__tabs > a.tabber__tab").forEach(tab => {
        const tabName = tab.textContent.toLowerCase();
        if (userOs === "linux" && tabName.includes("linux")) tab.click();
        if (userOs === "mac" && tabName.includes("macos")) tab.click();
        if (userOs === "win" && tabName.includes("windows")) tab.click();
    });
    setTimeout(() => {
        window.location.hash = oldAnchor;
    }, 100);
});