wnacg-helper

A manga helper for wnacg.com

2024-07-22 기준 버전입니다. 최신 버전을 확인하세요.

// ==UserScript==
// @name         wnacg-helper
// @namespace    https://www.wnacg.com/
// @version      0.0.1
// @author       dzh
// @description  A manga helper for wnacg.com
// @license      MIT
// @icon         https://vitejs.dev/logo.svg
// @match        https://www.wnacg.com/*
// ==/UserScript==

(function () {
  'use strict';

  (function() {
    $(document).ready(() => {
      observerImgList();
    });
    $(window).on("load", () => {
      $(document).keydown(handleKeydownEvent);
    });
    function observerImgList() {
      const targetNode = document.getElementById("img_list");
      if (!targetNode) return;
      const observer = new MutationObserver(handleMutationCallback);
      observer.observe(targetNode, {
        childList: true,
        subtree: true
      });
    }
    function handleMutationCallback(mutationList, observer) {
      mutationList.forEach((mutation) => {
        if (mutation.type === "childList") {
          autoChangeWidth();
        }
      });
    }
    function autoChangeWidth() {
      const imgList = document.querySelectorAll("#img_list img");
      imgList.forEach((img) => {
        img.style.width = "60%";
      });
    }
    function handleKeydownEvent(e) {
      switch (e.key) {
        case "=":
          plusWidth();
          break;
        case "-":
          minusWidth();
          break;
        case "r":
          autoChangeWidth();
          break;
      }
    }
    function plusWidth() {
      const imgList = document.querySelectorAll("#img_list img");
      const plusStep = 2;
      imgList.forEach((img) => {
        const width = parseInt(img.style.width);
        img.style.width = `${width + plusStep}%`;
      });
    }
    function minusWidth() {
      const imgList = document.querySelectorAll("#img_list img");
      const minusStep = 2;
      imgList.forEach((img) => {
        const width = parseInt(img.style.width);
        if (width <= 10) return;
        img.style.width = `${width - minusStep}%`;
      });
    }
  })();

})();