☰

DM5 ZEN MODE

Zen Read mode for manga

目前为 2024-07-21 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name         DM5 ZEN MODE
  3. // @namespace    https://www.dm5.com/
  4. // @version      2024-07-21
  5. // @description  Zen Read mode for manga
  6. // @author       Tommy Chan
  7. // @match        https://www.dm5.com/*
  8. // @icon         https://www.dm5.com/favicon.ico
  9. // @grant        GM_addStyle
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. /* globals ShowPre, ShowNext, DM5_CID  DM5_CID, DM5_MID, DM5_VIEWSIGN_DT, DM5_VIEWSIGN, DM5_CURL, DM5_IMAGE_COUNT, $ */
  14.  
  15. const isNormalReadingPage = !!DM5_CURL;
  16.  
  17. const css = `
  18. .view-header-2,
  19. .new-tip.normal,
  20. .view-ad+.view-paging,
  21. .view-ad,
  22. .rightToolBar,
  23. .view-comment-sub,
  24. #lb-win,
  25. #last-win > a > img,
  26. .lb-win-con,
  27. footer,
  28. .index-right-float {
  29.   display: none !important;
  30. }
  31.  
  32. #showimage,
  33. #cp_img,
  34. #cp_img > img {
  35.   min-height:  100vh !important;
  36.   height: 100vh !important;
  37.   max-height: 100vh !important;
  38.   margin: 0 !important;
  39.   object-fit: contain;
  40.   pointer-events: none !important;
  41. }
  42.  
  43. .view-paging {
  44.   margin-top: 24px !important;
  45. }
  46.  
  47. ${isNormalReadingPage ? `
  48. .view-comment,
  49. .view-comment > .container {
  50.   display:  flex;
  51.   justify-content: center;
  52. }
  53. `
  54.     : ""
  55.   }
  56.  
  57. #monkey-left-title {
  58.   position: fixed;
  59.   left: 8px;
  60.   top: 8px;
  61.   display: flex;
  62. }
  63.  
  64. #monkey-left-title > a,
  65. #monkey-left-title > a:visited,
  66. #monkey-left-title > a:hover,
  67. #monkey-left-title > a:focus,
  68. #monkey-left-title > a:active {
  69.   text-decoration: none;
  70.  color:rgb(23, 103, 152);
  71. }
  72. `;
  73.  
  74. function preloadImages(imageUrls) {
  75.   const loadedImages = [];
  76.   for (let url of imageUrls) {
  77.     const img = new Image();
  78.     img.onload = () => console.log(`Loaded ${url}`);
  79.     img.onerror = () => console.error(`Failed to load ${url}`);
  80.     img.src = url;
  81.     loadedImages.push(img);
  82.   }
  83. }
  84.  
  85. function getChapterImageUrls() {
  86.   return new Promise((resolve, reject) => {
  87.     let imageUrls = [];
  88.     for (let i = 1; i <= DM5_IMAGE_COUNT; i++) {
  89.       const params = new URLSearchParams({
  90.         cid: DM5_CID,
  91.         page: i,
  92.         key: $("#dm5_key").val(),
  93.         language: 1,
  94.         gtk: 6,
  95.         _cid: DM5_CID,
  96.         _mid: DM5_MID,
  97.         _dt: DM5_VIEWSIGN_DT,
  98.         _sign: DM5_VIEWSIGN
  99.       });
  100.  
  101.       fetch(`chapterfun.ashx?${params.toString()}`, {
  102.         method: 'GET'
  103.       })
  104.       .then(response => response.text())
  105.       .then(data => {
  106.         // eslint-disable-next-line
  107.         const d = eval(data);
  108.         const imgSrc = d[0];
  109.         imageUrls.push(imgSrc);
  110.         if (imageUrls.length === DM5_IMAGE_COUNT) {
  111.           resolve(imageUrls);
  112.         }
  113.       })
  114.       .catch(error => {
  115.         console.error('Error fetching image URLs:', error);
  116.         reject(error);
  117.       });
  118.     }
  119.   })
  120. }
  121. const preloadChapters = [];
  122.  
  123. function preloadChapterImages() {
  124.   if (preloadChapters.includes(DM5_CURL)) return;
  125.   getChapterImageUrls()
  126.     .then(imageUrls => preloadImages(imageUrls))
  127.     .then(() => { preloadChapters.push(DM5_CURL); })
  128.     .catch(() => {
  129.       console.error('Failed to preload chapter images');
  130.     });
  131. }
  132.  
  133. (function () {
  134.   'use strict';
  135.   console.log('DM5 Script is running');
  136.   GM_addStyle(css);
  137.   // Your code here...
  138.  
  139.   const titleEl = document.querySelector("body > div.view-header-2 > div.title > span:nth-child(2) > a");
  140.   const episodeEl = document.querySelector("body > div.view-header-2 > div.title > span.active.right-arrow");
  141.  
  142.   const el = document.createElement('div');
  143.   el.innerHTML = `<div id="monkey-left-title"><a href="${titleEl.href}">${titleEl.textContent.trim()}</a><span> > ${episodeEl.textContent.trim()}</span></div>`;
  144.   document.body.appendChild(el);
  145.  
  146.   document.addEventListener('mousedown', function (event) {
  147.     switch (event.button) {
  148.       case 0:
  149.         console.log('Left mouse button clicked');
  150.         ShowNext();
  151.         break;
  152.       case 2:
  153.         console.log('Right mouse button clicked');
  154.         ShowPre();
  155.         break;
  156.     }
  157.   });
  158.  
  159.   document.addEventListener('contextmenu', function (event) {
  160.     event.preventDefault();
  161.   });
  162.  
  163.   if (DM5_CURL) {
  164.     preloadChapterImages();
  165.   }
  166. })();