mousehunt-improved 0.97.1

package/src/modules/lgs-reminder/styles.css

@@ -0,0 +1,85 @@
+.mousehunt-improved-lgs-reminder,
+.default.mhui-custom-shield .mousehunt-improved-lgs-reminder {
+  position: absolute;
+  right: 8px;
+  bottom: 4px;
+  left: 13px;
+  z-index: 1;
+  font-size: 11px;
+  color: #684434;
+  text-align: center;
+  background-color: rgb(221 205 162 / 85%);
+  border: 1px solid #9d9a91;
+  border-radius: 5px;
+}
+
+.default .mousehunt-improved-lgs-reminder {
+  left: -5px;
+}
+
+.default-fancy .mousehunt-improved-lgs-reminder {
+  right: 15px;
+}
+
+.mousehuntHud-shield.color .mousehunt-improved-lgs-reminder {
+  right: 20px;
+  left: 0;
+}
+
+.mhui-custom-shield .mousehunt-improved-lgs-reminder.exact {
+  font-size: 10px;
+}
+
+.mousehunt-improved-lgs-reminder-new.lgs-warning,
+.mousehunt-improved-lgs-reminder.lgs-warning,
+.default.mhui-custom-shield .mousehunt-improved-lgs-reminder.lgs-warning {
+  background-color: #ffbfbf;
+}
+
+.mousehunt-improved-lgs-reminder-new.lgs-danger,
+.mousehunt-improved-lgs-reminder.lgs-danger,
+.default.mhui-custom-shield .mousehunt-improved-lgs-reminder.lgs-danger {
+  color: #f1d7d7;
+  background-color: #b32d26;
+  border-color: #af8080;
+  transition: 1.75s;
+  animation: mh-improved-fade-slightly 1.75s infinite;
+}
+
+/* if they have prefers reduced motion enabled, don't animate */
+@media (prefers-reduced-motion: reduce) {
+  .mousehunt-improved-lgs-reminder-new.lgs-danger,
+  .mousehunt-improved-lgs-reminder.lgs-danger,
+  .default.mhui-custom-shield .mousehunt-improved-lgs-reminder-new.lgs-danger {
+    animation: none;
+  }
+}
+
+.mousehunt-improved-lgs-reminder-wrapper {
+  position: absolute;
+  right: 642px;
+  bottom: 0;
+  left: 15px;
+  font-size: 9px;
+}
+
+.mousehunt-improved-lgs-reminder-new {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 2px 5px;
+  text-align: center;
+  background: linear-gradient(#fff 45%, #f8e7bb 55%);
+  border: 1px solid #d4af37;
+  border-bottom: none;
+  border-radius: 6px 6px 0 0;
+}
+
+.mousehunt-improved-lgs-reminder-new.lgs-warning {
+  background: linear-gradient(#fff, #ffbfbf);
+}
+
+.mousehunt-improved-lgs-reminder-new.lgs-danger {
+  background: #b32d26;
+  border: none;
+}

package/src/modules/links/index.js

@@ -0,0 +1,69 @@
+import { addSubmenuItem, makeElement } from '@utils';
+
+/**
+ * Add help links to the support dropdown.
+ */
+const addHelpLinks = () => {
+  const supportDropdown = document.querySelector('.menuItem.dropdown.support .dropdownContent');
+  if (! supportDropdown) {
+    return;
+  }
+
+  const helpLinks = [
+    {
+      id: 'mouserip',
+      class: 'rules',
+      title: 'MOUSE.RIP', // caps to look better
+      href: 'https://mouse.rip',
+      text: 'MH guides, tools, and more.',
+    },
+    {
+      id: 'mhui',
+      class: 'fanPage',
+      title: 'MH Improved',
+      href: 'https://github.com/MHCommunity/mousehunt-improved',
+      text: 'Bug reports and feature requests.',
+    },
+  ];
+
+  helpLinks.forEach((helpLink) => {
+    if (supportDropdown.querySelector(`a.${helpLink.id}`)) {
+      return;
+    }
+
+    const link = makeElement('a', [helpLink.id, helpLink.class]);
+    makeElement('b', 'title', helpLink.title, link);
+    makeElement('span', 'text', helpLink.text, link);
+
+    link.setAttribute('href', helpLink.href);
+    link.setAttribute('target', '_blank');
+    link.setAttribute('rel', 'noopener noreferrer');
+
+    supportDropdown.append(link);
+  });
+};
+
+/**
+ * Initialize the module.
+ */
+const init = () => {
+  addHelpLinks();
+
+  addSubmenuItem({
+    menu: 'kingdom',
+    label: 'mouse.rip',
+    icon: 'https://www.mousehuntgame.com/images/ui/hud/menu/prize_shoppe.png',
+    href: 'https://mouse.rip',
+    external: true,
+  });
+};
+
+/**
+ * Initialize the module.
+ */
+export default {
+  id: 'links',
+  type: 'required',
+  alwaysLoad: true,
+  load: init,
+};

package/src/modules/location-catch-stats/crown-colored-rows.css

@@ -0,0 +1,47 @@
+.mh-catch-stats.mh-catch-stats-crown-none {
+  background-color: #e0e0e0;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-none:nth-child(odd) {
+  background-color: #d0d0d0;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-bronze {
+  background-color: #f7c8a6;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-bronze:nth-child(odd) {
+  background-color: #f4b385;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-silver {
+  background-color: #bcc7d2;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-silver:nth-child(odd) {
+  background-color: #acbac8;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-gold {
+  background-color: #ebdda2;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-gold:nth-child(odd) {
+  background-color: #f0e5b8;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-platinum {
+  background-color: #d7f0f0;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-platinum:nth-child(odd) {
+  background-color: #c1e8e8;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-diamond {
+  background-color: #f0d7f0;
+}
+
+.mh-catch-stats.mh-catch-stats-crown-diamond:nth-child(odd) {
+  background-color: #e8bfe8;
+}

package/src/modules/location-catch-stats/index.js

@@ -0,0 +1,234 @@
+import {
+  addStyles,
+  addSubmenuItem,
+  doRequest,
+  getSetting,
+  makeElement,
+  makeElementDraggable
+} from '@utils';
+
+import crownColoredRowsStyles from './crown-colored-rows.css';
+import styles from './styles.css';
+
+import settings from './settings';
+
+const normalize = (value) => {
+  return Number.parseInt(value.toString().replaceAll(',', ''), 10);
+};
+
+/**
+ * Get the mouse stats.
+ *
+ * @return {Object} The mouse stats.
+ */
+const getMouseStats = async () => {
+  const data = await doRequest('managers/ajax/mice/mouse_list.php', {
+    action: 'get_environment',
+    category: user.environment_type,
+    user_id: user.user_id,
+    display_mode: 'stats',
+    view: 'ViewMouseListEnvironments',
+  });
+
+  // Grab the data from the response.
+  const mouseData = data?.mouse_list_category?.subgroups[0]?.mice;
+
+  if (! mouseData) {
+    return [];
+  }
+
+  // Reorder by the num_catches key.
+  mouseData.sort((a, b) => {
+    return normalize(b.num_catches) - normalize(a.num_catches);
+  });
+
+  // Return the data.
+  return mouseData ?? [];
+};
+
+/**
+ * Build the markup for the stats.
+ *
+ * @param {Object} mouseData The mouse data.
+ *
+ * @return {Node} The node to append.
+ */
+const buildMouseMarkup = (mouseData) => {
+  // Fallbacks for mouse data.
+  const mouse = Object.assign({}, {
+    name: '',
+    type: '',
+    image: '',
+    crown: 'none',
+    num_catches: 0,
+  }, mouseData);
+
+  const mouseEl = document.createElement('a');
+  mouseEl.classList.add('mh-catch-stats');
+
+  mouseEl.title = mouse.name;
+  mouseEl.addEventListener('click', () => {
+    if ('undefined' !== hg?.views?.MouseView?.show) {
+      hg.views.MouseView.show(mouse.type);
+    }
+  });
+
+  // Create the image element.
+  const image = document.createElement('div');
+  image.classList.add('mh-catch-stats-image');
+  if (mouse.num_catches <= 0) {
+    image.classList.add('mh-catch-stats-no-catches');
+  }
+
+  image.style.backgroundImage = `url('${mouse.image}')`;
+
+  // If the mouse has a crown, add it.
+  if (mouse.crown && 'none' !== mouse.crown) {
+    const crown = document.createElement('div');
+    crown.classList.add('mh-catch-stats-crown');
+    crown.style.backgroundImage = `url('https://www.mousehuntgame.com/images/ui/crowns/crown_${mouse.crown}.png')`;
+    image.append(crown);
+
+    mouseEl.classList.add(`mh-catch-stats-crown-${mouse.crown}`);
+  } else {
+    mouseEl.classList.add('mh-catch-stats-crown-none');
+  }
+
+  // Create the name element.
+  const name = document.createElement('div');
+  name.classList.add('mh-catch-stats-name');
+  name.textContent = mouse.name;
+
+  // Create a wrapper for the name and image.
+  const imageNameContainer = document.createElement('div');
+  imageNameContainer.append(image);
+  imageNameContainer.append(name);
+  mouseEl.append(imageNameContainer);
+
+  // Create the catches element.
+  const catches = document.createElement('div');
+  catches.classList.add('mh-catch-stats-catches');
+
+  catches.textContent = mouse.num_catches;
+  if (showMisses) {
+    makeElement('span', 'mh-catch-stats-separator', '/', catches);
+    makeElement('span', 'mh-catch-stats-misses', mouse.num_misses, catches);
+  }
+
+  mouseEl.append(catches);
+
+  return mouseEl;
+};
+
+/**
+ * Show the stat modal.
+ */
+const showModal = async () => {
+  showMisses = getSetting('location-catch-stats.show-misses', false);
+
+  // Remove the existing modal.
+  const existing = document.querySelector('#mh-catch-stats');
+  if (existing) {
+    existing.remove();
+  }
+
+  // Create the modal.
+  const modalWrapper = document.createElement('div');
+  modalWrapper.id = 'mh-catch-stats';
+
+  // Create the wrapper.
+  const modal = document.createElement('div');
+  modal.classList.add('mh-catch-stats-wrapper');
+
+  // Create the header.
+  const header = document.createElement('div');
+  header.classList.add('mh-catch-stats-header');
+
+  // Add the title;
+  const title = document.createElement('h1');
+  title.textContent = 'Location Catch Stats';
+  header.append(title);
+
+  // Create a close button icon.
+  const closeIcon = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+  closeIcon.classList.add('mh-catch-stats-close');
+  closeIcon.setAttribute('viewBox', '0 0 24 24');
+  closeIcon.setAttribute('width', '18');
+  closeIcon.setAttribute('height', '18');
+  closeIcon.setAttribute('fill', 'none');
+  closeIcon.setAttribute('stroke', 'currentColor');
+  closeIcon.setAttribute('stroke-width', '1.5');
+
+  // Create the path.
+  const closePath = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+  closePath.setAttribute('d', 'M18 6L6 18M6 6l12 12');
+  closeIcon.append(closePath);
+
+  // Close the modal when the icon is clicked.
+  closeIcon.addEventListener('click', () => {
+    modalWrapper.remove();
+  });
+
+  // Append the button.
+  header.append(closeIcon);
+
+  // Add the header to the modal.
+  modal.append(header);
+
+  // Make the mouse stats table.
+  const mouseBody = document.createElement('div');
+  mouseBody.classList.add('mh-catch-stats-body');
+
+  // Get the mouse stats.
+  const mouseStats = await getMouseStats();
+
+  // Loop through the stats and add them to the modal.
+  mouseStats.forEach((mouseData) => {
+    mouseBody.append(buildMouseMarkup(mouseData, mouseBody));
+  });
+
+  // Add the mouse stats to the modal.
+  modal.append(mouseBody);
+
+  // Add the modal to the wrapper.
+  modalWrapper.append(modal);
+
+  // Add the wrapper to the body.
+  document.body.append(modalWrapper);
+
+  // Make the modal draggable.
+  makeElementDraggable('#mh-catch-stats', '.mh-catch-stats-header', 25, 25);
+};
+
+let showMisses = false;
+
+/**
+ * Initialize the module.
+ */
+const init = async () => {
+  addStyles([
+    styles,
+    getSetting('location-catch-stats.crown-colored-rows', false) ? crownColoredRowsStyles : null
+  ]
+  , 'location-catch-stats');
+
+  addSubmenuItem({
+    menu: 'mice',
+    label: 'Location Catch Stats',
+    icon: 'https://www.mousehuntgame.com/images/ui/hud/menu/prize_shoppe.png?',
+    callback: showModal,
+  });
+};
+
+/**
+ * Initialize the module.
+ */
+export default {
+  id: 'location-catch-stats',
+  name: 'Location Catch Stats',
+  type: 'feature',
+  default: true,
+  description: 'Add a “Location Catch Stats” option to the Mice menu to see your catch stats for the current location.',
+  load: init,
+  settings,
+};

package/src/modules/location-catch-stats/settings/index.js

@@ -0,0 +1,17 @@
+/**
+ * Add settings for the module.
+ *
+ * @return {Array} The settings for the module.
+ */
+export default async () => {
+  return [
+    {
+      id: 'location-catch-stats.crown-colored-rows',
+      title: 'Color rows based on crown',
+    },
+    {
+      id: 'location-catch-stats.show-misses',
+      title: 'Show number of misses',
+    },
+  ];
+};

package/src/modules/location-catch-stats/styles.css

@@ -0,0 +1,125 @@
+#mh-catch-stats {
+  position: absolute;
+  z-index: 150;
+}
+
+@media screen and (prefers-reduced-motion: reduce) {
+  .mh-catch-stats-wrapper {
+    transition: none;
+  }
+}
+
+.mh-catch-stats-wrapper {
+  width: 275px;
+  background: #f6f3eb;
+  border: 1px solid #534022;
+  box-shadow:
+    1px 1px 1px 0 #9d917f,
+    1px 3px 5px 0 #6a6969;
+  transition: box-shadow 0.25s;
+}
+
+.mh-is-dragging .mh-catch-stats-wrapper {
+  box-shadow:
+    1px 1px 1px 0 #9d917f,
+    0 7px 9px 2px #6a6969;
+}
+
+.mh-catch-stats-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 10px;
+  color: #f6f3eb;
+  background-color: #8e6642;
+  border-bottom: 1px solid #ceb7a6;
+}
+
+.mh-catch-stats-header:hover {
+  cursor: grab;
+}
+
+.mh-catch-stats-header:active {
+  cursor: grabbing;
+}
+
+.mh-catch-stats-header h1 {
+  color: #f6f3eb;
+}
+
+.mh-catch-stats-close {
+  cursor: pointer;
+}
+
+.mh-catch-stats-close:hover,
+.mh-catch-stats-close:focus {
+  color: #8e6642;
+  background-color: #eee;
+  border-radius: 50%;
+  outline: 1px solid #ccc;
+}
+
+.mh-catch-stats-body {
+  max-height: 85vh;
+  overflow: hidden auto;
+}
+
+.mh-catch-stats-wrapper .mh-catch-stats:nth-child(odd) {
+  background-color: #e8e3d7;
+}
+
+.mh-catch-stats {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 5px;
+  color: #000;
+}
+
+.mh-catch-stats:hover,
+.mh-catch-stats-wrapper .mh-catch-stats:nth-child(odd):hover,
+.mh-catch-stats:focus,
+.mh-catch-stats-wrapper .mh-catch-stats:nth-child(odd):focus {
+  text-decoration: none;
+  outline: 1px solid #646464;
+}
+
+.mh-catch-stats-image {
+  position: relative;
+  display: inline-block;
+  width: 40px;
+  height: 40px;
+  vertical-align: middle;
+  background-repeat: no-repeat;
+  background-size: contain;
+  border-radius: 2px;
+  box-shadow: 1px 1px 1px #999;
+}
+
+.mh-catch-stats-crown {
+  position: absolute;
+  right: -5px;
+  bottom: -5px;
+  width: 20px;
+  height: 20px;
+  background-color: #fff;
+  background-repeat: no-repeat;
+  background-position: 50% 50%;
+  background-size: 80%;
+  border: 1px solid #333;
+  border-radius: 50%;
+}
+
+.mh-catch-stats-name {
+  display: inline-block;
+  padding-left: 10px;
+  vertical-align: middle;
+}
+
+.mh-catch-stats-catches {
+  padding-right: 5px;
+}
+
+.mh-catch-stats-no-catches {
+  filter: grayscale(1) opacity(0.5);
+}