MouseHunt - Birthday Map Color Coder 2020

Color codes mice on birthday maps according to decorations // & cheese. Based off tsitu's work.

Per 04-03-2020. Zie de nieuwste versie.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         MouseHunt - Birthday Map Color Coder 2020
// @author       Vinnie, Blende & Tran Situ (tsitu)
// @version      1.0.8
// @description  Color codes mice on birthday maps according to decorations // & cheese. Based off tsitu's work.
// @match        http://www.mousehuntgame.com/*
// @match        https://www.mousehuntgame.com/*
// @namespace    https://greasyfork.org/en/scripts/397287-mousehunt-birthday-map-color-coder-2020
// @include		http://apps.facebook.com/mousehunt/*
// @include		https://apps.facebook.com/mousehunt/*
// ==/UserScript==

const mixingMice = [
  "Force Fighter Blue",
  "Force Fighter Green",
  "Force Fighter Pink",
  "Force Fighter Red",
  "Force Fighter Yellow",
  "Super FighterBot MegaSupreme",
];

const breakMice = [
  "Breakdancer",
  "Fete Fromager",
  "Dance Party",
  "El Flamenco",
  "Para Para Dancer"
];

const pumpMice = [
  "Reality Restitch",
  "Time Punk",
  "Time Tailor",
  "Time Thief"
];

const qaMice = [
  "Cupcake Candle Thief",
  "Cupcake Cutie",
  "Sprinkly Sweet Cupcake Cook",
  "Cupcake Camo",
  "Cupcake Runner"
];

const bossMice = [
  "Vincent, The Magnificent"
];

const sbMice = [
  "Cheesy Party"
];

const factoryMice = [
  "Factory Technician"
];

const standardMice = [
  "Birthday",
  "Buckethead",
  "Present",
  "Pintail",
  "Dinosuit",
  "Sleepwalker",
  "Terrible Twos"
];

const birthdayMaps = [
  "Rare Birthday Event Map",
  "Birthday Event Map",
  "Rare Gilded Birthday Event Map",
  "Gilded Birthday Event Map",
];

function colorize() {
  let mixingColor = "#c97c49"; // brown-ish
  let mixingCount = 0;
  let breakColor = "#f06a60"; // red
  let breakCount = 0;
  let pumpColor = "#5ae031"; // green
  let pumpCount = 0;
  let qaColor = "#4fcaf0"; // blue
  let qaCount = 0;
  let bossColor = "#cd87ff"; // light purple
  let bossCount = 0;
  let sbColor = "#66ffff"; // teal-ish
  let sbCount = 0;
  let standardColor = "#afa500"; // mountain dew-ish
  let standardCount = 0;
  let factoryColor = "#e6e6ff";
  let factoryCount = 0;
  const greyColor = "#949494";

  const isChecked =
    localStorage.getItem("highlightPref") === "uncaught-only" ? true : false;
  const isCheckedStr = isChecked ? "checked" : "";

  if (
    document.querySelectorAll(".treasureMapView-goals-group-goal").length === 0
  ) {
    return;
  }

  document.querySelectorAll(".treasureMapView-goals-group-goal").forEach(el => {
    el.querySelector("span").style = "color: black; font-size: 11px;";

    const mouseName = el.querySelector(".treasureMapView-goals-group-goal-name")
      .textContent;

    if (mixingMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = mixingColor;
      if (el.className.indexOf(" complete ") < 0) {
        mixingCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (breakMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = breakColor;
      if (el.className.indexOf(" complete ") < 0) {
        breakCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (pumpMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = pumpColor;
      if (el.className.indexOf(" complete ") < 0) {
        pumpCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (qaMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = qaColor;
      if (el.className.indexOf(" complete ") < 0) {
        qaCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (bossMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = bossColor;
      if (el.className.indexOf(" complete ") < 0) {
        bossCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (sbMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = sbColor;
      if (el.className.indexOf(" complete ") < 0) {
        sbCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (factoryMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = factoryColor;
      if (el.className.indexOf(" complete ") < 0) {
        factoryCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    } else if (standardMice.indexOf(mouseName) > -1) {
      el.style.backgroundColor = standardColor;
      if (el.className.indexOf(" complete ") < 0) {
        standardCount++;
      } else {
        if (isChecked) el.style.backgroundColor = "white";
      }
    }
  });

  mixingColor = mixingCount > 0 ? mixingColor : greyColor;
  breakColor = breakCount > 0 ? breakColor : greyColor;
  pumpColor = pumpCount > 0 ? pumpColor : greyColor;
  qaColor = qaCount > 0 ? qaColor : greyColor;
  bossColor = bossCount > 0 ? bossColor : greyColor;
  sbColor = sbCount > 0 ? sbColor : greyColor;
  factoryColor = factoryCount > 0 ? factoryColor : greyColor;
  standardColor = standardCount > 0 ? standardColor : greyColor;

  // Remove existing birthday Map related elements before proceeding
  document.querySelectorAll(".tsitu-birthday-map").forEach(el => el.remove());

  const masterDiv = document.createElement("div");
  masterDiv.className = "tsitu-birthday-map";
  masterDiv.style =
    "display: inline-flex; margin-bottom: 10px; width: 100%; text-align: center; line-height: 1.5; overflow: hidden";
  const spanStyle =
    "; width: auto; padding: 5px; font-weight: bold; font-size: 12.5px";

  const mixingSpan = document.createElement("span");
  mixingSpan.style = "background-color: " + mixingColor + spanStyle;
  mixingSpan.innerHTML = "Mixing<br>" + mixingCount;

  const breakSpan = document.createElement("span");
  breakSpan.style = "background-color: " + breakColor + spanStyle;
  breakSpan.innerHTML = "Break<br>" + breakCount;

  const pumpSpan = document.createElement("span");
  pumpSpan.style = "background-color: " + pumpColor + spanStyle;
  pumpSpan.innerHTML = "Pump<br>" + pumpCount;

  const qaSpan = document.createElement("span");
  qaSpan.style = "background-color: " + qaColor + spanStyle;
  qaSpan.innerHTML = "QA<br>" + qaCount;

  const vinnieSpan = document.createElement("span");
  vinnieSpan.style = "background-color: " + bossColor + spanStyle;
  vinnieSpan.innerHTML = "Vinnie<br>" + bossCount;

  const sbSpan = document.createElement("span");
  sbSpan.style = "background-color: " + sbColor + spanStyle;
  sbSpan.innerHTML = "SB+<br>" + sbCount;

  const factorySpan = document.createElement("span");
  factorySpan.style = "background-color: " + factoryColor + spanStyle;
  factorySpan.innerHTML = "Factory Charm<br>" + factoryCount;

  const standardSpan = document.createElement("span");
  standardSpan.style = "background-color: " + standardColor + spanStyle;
  standardSpan.innerHTML = "Standard<br>" + standardCount;

  // Highlight uncaught only feature
  const highlightLabel = document.createElement("label");
  highlightLabel.htmlFor = "tsitu-highlight-box";
  highlightLabel.innerText = "Highlight uncaught mice only";

  const highlightBox = document.createElement("input");
  highlightBox.type = "checkbox";
  highlightBox.name = "tsitu-highlight-box";
  highlightBox.style.verticalAlign = "middle";
  highlightBox.checked = isChecked;
  highlightBox.addEventListener("click", function() {
    if (highlightBox.checked) {
      localStorage.setItem("highlightPref", "uncaught-only");
    } else {
      localStorage.setItem("highlightPref", "all");
    }
    colorize();
  });

  const highlightDiv = document.createElement("div");
  highlightDiv.className = "tsitu-birthday-map";
  highlightDiv.style =
    "margin-bottom: 5px; width: 35%; border: 1px dotted black";
  highlightDiv.appendChild(highlightBox);
  highlightDiv.appendChild(highlightLabel);

  // Assemble masterDiv
  masterDiv.appendChild(mixingSpan);
  masterDiv.appendChild(breakSpan);
  masterDiv.appendChild(pumpSpan);
  masterDiv.appendChild(qaSpan);
  masterDiv.appendChild(vinnieSpan);
  masterDiv.appendChild(sbSpan);
  masterDiv.appendChild(factorySpan);
  masterDiv.appendChild(standardSpan);

  // Inject into DOM
  const insertEl = document.querySelector(
    ".treasureMapView-leftBlock .treasureMapView-block-content"
  );
  if (
    insertEl &&
    document.querySelector(
      ".treasureMapManagerView-header-navigation-item.tasks.active"
    )
  ) {
    insertEl.insertAdjacentElement("afterbegin", highlightDiv);
    insertEl.insertAdjacentElement("afterbegin", masterDiv);
  }

  // "Goals" button
  document.querySelector("[data-type='show_goals']").onclick = function() {
    colorize();
  };
}

// Listen to XHRs, opening a map always at least triggers board.php
const originalOpen = XMLHttpRequest.prototype.open;
XMLHttpRequest.prototype.open = function() {
  this.addEventListener("load", function() {
    const mapEl = document.querySelector(
      ".treasureMapManagerView-task.active .treasureMapManagerView-task-name"
    );
    if (mapEl) {
      const mapName = mapEl.textContent;
      if (mapName && birthdayMaps.indexOf(mapName) > -1) {
        colorize();
      }
    }
  });
  originalOpen.apply(this, arguments);
};