mousehunt-improved 0.97.1

package/src/modules/better-quests/styles.css

@@ -0,0 +1,223 @@
+#mh-improved-m400-travel {
+  left: 15px;
+  cursor: pointer;
+}
+
+.m400-helper-hidden,
+.campPage-quests-objective-container.locked .campPage-quests-objective-content,
+.campPage-quests-footer-smash-icon,
+.campPage-quests-footer-smash-warning {
+  display: none;
+}
+
+.campPage-quests-objective-container .campPage-quests-objective-thumb {
+  width: 35px;
+  height: 25px;
+}
+
+.campPage-quests-objective-content {
+  width: calc(100% - 35px);
+}
+
+.campPage-quests-objective-container.locked .campPage-quests-objective-thumb {
+  width: 100%;
+  margin: 0 auto;
+  opacity: 0.4;
+}
+
+.campPage-quests-footer-smash {
+  display: flex;
+  flex-direction: row;
+  place-content: center center;
+  align-items: center;
+  padding: 4px;
+  font-size: 9.75px;
+  text-decoration: underline;
+  border-radius: 3px;
+  box-shadow: none;
+}
+
+#mh-research-smash-warning {
+  position: absolute;
+  bottom: 28px;
+  left: 30px;
+  display: block;
+  max-width: 250px;
+  line-height: 16px;
+  text-align: left;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .errorText {
+  padding: 10px 0;
+  color: #da1717;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .image {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  width: 50px;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .image img {
+  width: 40px;
+  height: 40px;
+  margin: 0;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .content b {
+  display: block;
+  padding: 5px 0;
+  font-size: 12px;
+  color: #000;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .content {
+  display: block;
+  width: auto;
+  padding: 0;
+  margin-left: 10px;
+  color: #909090;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .requirements b {
+  display: block;
+  padding: 7px;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .item img,
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink br {
+  display: none;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .requirements img {
+  display: inline-block;
+  width: auto;
+  height: 15px;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questContainer {
+  height: auto;
+  overflow-y: visible;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup a.questLink {
+  display: grid;
+  grid-template-columns: 1fr 5fr 2fr;
+  place-items: center;
+  align-items: start;
+  padding-bottom: 10px;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup a.questLink:hover,
+#overlayPopup.zugzwangsLibraryQuestShopPopup a.questLink:focus,
+#overlayPopup.zugzwangsLibraryQuestShopPopup a.questLink:active {
+  cursor: default;
+}
+
+.mh-dark #overlayPopup.zugzwangsLibraryQuestShopPopup .jsDialogContainer {
+  color: var(--d-text);
+  background: var(--d-bg);
+}
+
+.mh-dark #overlayPopup.zugzwangsLibraryQuestShopPopup #jsDialogAjaxPrefix h2,
+.mh-dark #overlayPopup.zugzwangsLibraryQuestShopPopup a.questLink {
+  color: var(--d-text);
+}
+
+.mh-m400-travel {
+  margin-top: -2px;
+  margin-left: 10px;
+}
+
+.mh-m400-quest .campPage-quests-objective-progress,
+.mh-m400-quest .campPage-quests-objective-progressBar {
+  display: none;
+}
+
+.mh-ui-assignment-meta {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.mh-ui-assignment-price {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.mh-ui-assignment-meta-wrapper {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 9px;
+  place-items: center stretch;
+}
+
+.mh-ui-assignment-wiki-button {
+  grid-column: span 2;
+  text-align: center;
+}
+
+.mh-ui-assignment-price-value {
+  font-size: 13px;
+  font-weight: 900;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questResources {
+  padding: 5px 0;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .image img.disabled[src=""] {
+  display: none;
+}
+
+.questLink .mousehuntActionButton.lightBlue {
+  padding: 2px 8px;
+  margin-left: -4px; /* make it look more visually centered */
+  font-size: 12px;
+  font-weight: 100;
+}
+
+.mh-ui-assignment-price-label {
+  text-decoration: underline;
+  text-decoration-color: #ccc;
+}
+
+.mh-ui-assignment-details-summary {
+  padding: 5px 0;
+  font-size: 12px;
+  color: #000;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questResources .mh-ui-quest-resources:hover {
+  cursor: pointer;
+  background-color: #dfdfdf;
+  border-radius: 6px;
+  box-shadow: -1px 1px 0 3px #dfdfdf;
+}
+
+h4.mh-ui-assignment-details-title {
+  padding: 3px 0;
+  font-size: 13px;
+  text-decoration: underline;
+}
+
+ul.mh-ui-assignment-details-task-list {
+  margin-left: 20px;
+  line-height: 1.5;
+  list-style: disc;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup .questLink .image,
+.mh-ui-assignment-meta-wrapper {
+  margin-top: 10px;
+}
+
+.mh-ui-assignment-details-task-title {
+  margin: 3px 0;
+}
+
+#overlayPopup.zugzwangsLibraryQuestShopPopup #jsDialogAjaxPrefix {
+  border: none;
+}

package/src/modules/better-send-supplies/index.js

@@ -0,0 +1,361 @@
+import {
+  addStyles,
+  getSetting,
+  makeElement,
+  makeMathButtons,
+  makeMhButton,
+  onNavigation
+} from '@utils';
+
+import settings from './settings';
+import styles from './styles.css';
+
+/**
+ * Process the search input.
+ */
+const processSearch = () => {
+  const currentValue = document.querySelector('#mhui-supply-search-input');
+  if (! currentValue) {
+    return;
+  }
+
+  if (! currentValue.value) {
+    // remove the hidden class from all items
+    items.forEach((item) => {
+      item.classList.remove('hidden');
+    });
+  }
+
+  // filter the inner text of the items and hide the ones that don't match
+  items.forEach((item) => {
+    const text = item.textContent.toLowerCase();
+    if (text.includes(currentValue.value.toLowerCase())) {
+      item.classList.remove('hidden');
+    } else {
+      item.classList.add('hidden');
+    }
+  });
+};
+
+/**
+ * Add the search input to the page.
+ */
+const addSearch = () => {
+  const existing = document.querySelector('.mhui-supply-search-wrapper');
+  if (existing) {
+    return;
+  }
+
+  const container = document.querySelector('#supplytransfer .tabContent.item');
+  if (! container) {
+    return;
+  }
+
+  const form = makeElement('form', 'mhui-supply-search-form');
+  const label = makeElement('label', ['mhui-supply-search-label']);
+  label.setAttribute('for', 'mhui-supply-search-input');
+  makeElement('span', '', 'Search: ', label);
+
+  const input = makeElement('input', 'mhui-supply-search-input');
+  input.setAttribute('type', 'text');
+  input.setAttribute('id', 'mhui-supply-search-input');
+  input.setAttribute('autocomplete', 'off');
+
+  input.addEventListener('keyup', processSearch);
+
+  label.append(input);
+  form.append(label);
+
+  // Convert the title into a wrapper that has the title and our form
+  const titleWrapper = makeElement('div', 'mhui-supply-search');
+  const title = container.querySelector('h2');
+  title.textContent = 'Send Supplies';
+  titleWrapper.append(title);
+
+  titleWrapper.append(form);
+
+  container.insertBefore(titleWrapper, container.firstChild);
+
+  setTimeout(() => input.focus(), 100);
+};
+
+/**
+ * Convert a string to a number.
+ *
+ * @param {string} number The number to convert.
+ *
+ * @return {number} The number.
+ */
+const asNum = (number) => {
+  // remove any commas, parse as int
+  return Number.parseInt(number.replace(',', ''));
+};
+
+/**
+ * Resort the items based on the sort type.
+ *
+ * @param {string} sortType The type of sort to apply.
+ */
+const resortItems = (sortType = 'alpha') => {
+  // sort items by the text in the details element
+  const container = document.querySelector('#supplytransfer .tabContent.item .listContainer');
+  const items = container.querySelectorAll('.item');
+
+  let sortSelector = '.quantity';
+  if ('alpha' === sortType || 'alpha-reverse' === sortType) {
+    sortSelector = '.details';
+  }
+
+  const sorted = [...items].sort((a, b) => {
+    const aText = a.querySelector(sortSelector).textContent;
+    const bText = b.querySelector(sortSelector).textContent;
+
+    switch (sortType) {
+    case 'alpha':
+      return aText.localeCompare(bText);
+
+    case 'alpha-reverse':
+      return bText.localeCompare(aText);
+
+    case 'qty':
+      return asNum(bText) - asNum(aText);
+
+    case 'qty-reverse':
+      return asNum(aText) - asNum(bText);
+
+    // No default
+    }
+
+    return 0;
+  });
+
+  for (const item of sorted) {
+    // if it has a class of pinned, make sure it's the first item
+    if (item.classList.contains('pinned')) {
+      continue;
+    }
+
+    container.append(item);
+  }
+
+  currentSort = sortType;
+};
+
+/**
+ * Add the sort buttons to the page.
+ */
+const addSortButtons = () => {
+  const existing = document.querySelector('.mhui-supply-sort-wrapper');
+  if (existing) {
+    return;
+  }
+
+  const container = document.querySelector('.mhui-supply-search');
+  if (! container) {
+    return;
+  }
+
+  const sortWrapper = makeElement('div', 'mhui-supply-sort-wrapper');
+  makeElement('span', 'mhui-supply-sort-label', 'Sort by:', sortWrapper);
+
+  makeMhButton({
+    text: 'Name',
+    className: ['mhui-supply-sort-alphabetic', 'lightBlue'],
+    callback: () => {
+      resortItems(currentSort === 'alpha' ? 'alpha-reverse' : 'alpha');
+    },
+    appendTo: sortWrapper,
+  });
+
+  makeMhButton({
+    text: 'Quantity',
+    className: ['mhui-supply-sort-quantity', 'lightBlue'],
+    callback: () => {
+      resortItems(currentSort === 'qty' ? 'qty-reverse' : 'qty');
+    },
+    appendTo: sortWrapper,
+  });
+
+  // append as the 2nd child so it's after the title
+  container.insertBefore(sortWrapper, container.childNodes[1]);
+};
+
+/**
+ * Highlight the favorited items.
+ */
+const highlightFavoritedItems = () => {
+  const itemsToPin = new Set([
+    getSetting('better-send-supplies.pinned-items-0', 'SUPER|brie+'),
+    getSetting('better-send-supplies.pinned-items-1', 'Empowered SUPER|b...'),
+    getSetting('better-send-supplies.pinned-items-2', 'Rift Cherries'),
+    getSetting('better-send-supplies.pinned-items-3', 'Rift-torn Roots'),
+    getSetting('better-send-supplies.pinned-items-4', 'Sap-filled Thorns'),
+  ]);
+
+  for (const item of items) {
+    // if the details text content is in the array, then pin it
+    const details = item.querySelector('.details');
+    if (itemsToPin.has(details.textContent)) {
+      item.classList.add('pinned');
+    }
+  }
+};
+
+/**
+ * Add the quick quantity buttons to the page.
+ */
+const addQuickQuantityButtons = () => {
+  const input = document.querySelector('#supplytransfer-confirm-text input');
+  if (! input) {
+    return;
+  }
+
+  const maxquantity = document.querySelector('#supplytransfer-confirm-text .userQuantity');
+  if (! maxquantity) {
+    return;
+  }
+
+  const existing = document.querySelector('.mhui-supply-quick-quantity-wrapper');
+  if (existing) {
+    existing.remove();
+  }
+
+  // parse out the max quantity by getting the text between 'you can send up to: ' and the first space after the number
+  const maxQty = Number.parseInt(maxquantity.textContent.split('You can send up to: ')[1].split(' ')[0].replace(',', ''));
+
+  const wrapper = makeElement('div', 'mhui-supply-quick-quantity-wrapper');
+
+  makeMathButtons([1, 5, 10, 100], {
+    appendTo: wrapper,
+    input,
+    maxQty,
+    classNames: ['mhui-supply-quick-quantity', 'small'],
+  });
+
+  makeMhButton({
+    text: 'Max',
+    size: 'small',
+    className: ['mhui-supply-quick-quantity'],
+    callback: (event) => {
+      const button = event.currentTarget;
+      const maxText = button.querySelector('span');
+
+      if (input.value === String(maxQty)) {
+        input.value = 0;
+        maxText.textContent = 'Max';
+      } else {
+        input.value = maxQty;
+        maxText.textContent = 'Reset';
+      }
+    },
+    appendTo: wrapper,
+  });
+
+  // append the wrapper after the input
+  input.parentNode.insertBefore(wrapper, input.nextSibling);
+};
+
+let items = [];
+let currentSort = null;
+
+/**
+ * Upgrade the Send Supplies page.
+ *
+ * @param {boolean} initial If this is the initial upgrade.
+ */
+const upgradeSendSupplies = (initial = false) => {
+  const sendTo = document.querySelector('#supplytransfer .drawer .tabContent.recipient');
+  const isChoosingUser = sendTo && sendTo.style.display !== 'none';
+
+  const sending = document.querySelector('#supplytransfer .drawer .tabContent.item');
+  const isChoosingItem = sending && sending.style.display !== 'none';
+
+  if (isChoosingUser) {
+    const users = document.querySelectorAll('#supplytransfer .friendList .element.recipient');
+    for (const user of users) {
+      // add an event listener to the click so we can apply the item changes
+      user.addEventListener('click', () => {
+        upgradeSendSupplies();
+      }, { once: true });
+
+      const search = document.querySelector('.searchContainer input');
+      if (search) {
+        search.focus();
+      }
+    }
+  } else if (isChoosingItem) {
+    items = document.querySelectorAll('#supplytransfer .tabContent.item .listContainer .item');
+    highlightFavoritedItems();
+
+    if (initial || ! hasSorted) {
+      hasSorted = true;
+      resortItems('alpha'); // default to alpha sort
+    }
+    addSortButtons();
+
+    const itemSearch = document.querySelector('#mhui-supply-search-input');
+    if (itemSearch) {
+      itemSearch.focus();
+    }
+  } else {
+    addQuickQuantityButtons();
+
+    const inputVal = document.querySelector('#supplytransfer-confirm-text input');
+    if (inputVal) {
+      inputVal.focus();
+    }
+  }
+
+  const categories = document.querySelectorAll('#supplytransfer .categoryMenu a');
+  for (const category of categories) {
+    category.addEventListener('click', () => {
+      // re-sort the pinned items
+      highlightFavoritedItems();
+    }, { once: true });
+  }
+
+  if (sendTo) {
+    sendTo.addEventListener('click', () => {
+      upgradeSendSupplies();
+    }, { once: true });
+  }
+
+  if (sending) {
+    sending.addEventListener('click', () => {
+      upgradeSendSupplies();
+    }, { once: true });
+  }
+};
+
+let hasSorted = false;
+
+/**
+ * The main function.
+ */
+const main = () => {
+  addSearch();
+  upgradeSendSupplies(true);
+};
+
+/**
+ * Initialize the module.
+ */
+const init = () => {
+  addStyles(styles, 'better-send-supplies');
+  onNavigation(main, {
+    page: 'supplytransfer',
+  });
+};
+
+/**
+ * Initialize the module.
+ */
+export default {
+  id: 'better-send-supplies',
+  name: 'Better Send Supplies',
+  type: 'better',
+  default: true,
+  description: 'Add pinned items, search, and sorting to the Send Supplies page.',
+  load: init,
+  settings,
+};

package/src/modules/better-send-supplies/settings/index.js

@@ -0,0 +1,45 @@
+import { getTradableItems } from '@utils';
+
+/**
+ * Add settings for the module.
+ *
+ * @return {Array} The settings for the module.
+ */
+export default async () => {
+  const tradableItems = await getTradableItems('truncated_name');
+
+  tradableItems.unshift({ name: 'None', value: 'none' }, { seperator: true });
+
+  return [{
+    id: 'better-send-supplies.pinned-items',
+    title: 'Pinned items',
+    default: [
+      {
+        name: 'SUPER|brie+',
+        value: 'SUPER|brie+',
+      },
+      {
+        name: 'Empowered SUPER|brie+',
+        value: 'Empowered SUPER|b...',
+      },
+      {
+        name: 'Rift Cherries',
+        value: 'Rift Cherries',
+      },
+      {
+        name: 'Rift-torn Roots',
+        value: 'Rift-torn Roots',
+      },
+      {
+        name: 'Sap-filled Thorns',
+        value: 'Sap-filled Thorns',
+      },
+    ],
+    description: 'Pin items at the top of the Send Supplies page.',
+    settings: {
+      type: 'multi-select',
+      number: 5,
+      options: tradableItems,
+    },
+  }];
+};