☰

Thief-Book in Browser

浏览器版 Thief-Book 摸鱼神器

当前为 2023-11-15 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Thief-Book in Browser
  3. // @namespace    https://github.com/chocovon/thiefbook-js
  4. // @version      0.3
  5. // @description  浏览器版 Thief-Book 摸鱼神器
  6. // @author       chocovon
  7. // @match       http*://*/*
  8. // @grant        none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12.     let text = '按，。键翻页\n-键退出/恢复显示\nGood Luck!'
  13.     let lines = [];
  14.     let lineLength = 10;
  15.     let pointer = 0;
  16.     let keyNextLine = 'Period';
  17.     let keyPreLine = 'Comma';
  18.     let keyHide = 'Minus';
  19.     let hide = false;
  20.     let progress = 0;
  21.  
  22.     document.head.innerHTML +=
  23.         '<style>\n' +
  24.         '        .thief-book-line-box {\n' +
  25.         '            position: fixed;\n' +
  26.         '            left: 0;\n' +
  27.         '            bottom: 0;\n' +
  28.         '        }\n' +
  29.         '        .thief-book-line {\n' +
  30.         '            font-size: 10px;\n' +
  31.         '            text-align:left;\n' +
  32.         '            background-color: rgb(222,225,230);\n' +
  33.         '            height: 23px;\n' +
  34.         '            line-height: 23px;\n' +
  35.         '            border-radius: 4px;\n' +
  36.         '            padding-left: 5px;\n' +
  37.         '            padding-right: 5px;\n' +
  38.         '        }\n' +
  39.         '        .thief-book-mouse-area {\n' +
  40.         '            position: fixed;\n' +
  41.         '            left: 0;\n' +
  42.         '            bottom: 0;\n' +
  43.         '            z-index: 99999;\n' +
  44.         '            height: 70px;\n' +
  45.         '            width:500px;\n' +
  46.         '            margin: 1px;\n' +
  47.         '        }\n' +
  48.         '        .thief-book-mouse-area:hover .thief-book-settings-area {\n' +
  49.         '            opacity: 1 !important;\n' +
  50.         '        }\n' +
  51.         '        .thief-book-settings-area {\n' +
  52.         '            position: fixed;\n' +
  53.         '            left: 60px;\n' +
  54.         '            bottom: 30px;\n' +
  55.         '            display: flex;\n' +
  56.         '            transition: 0.3s;\n' +
  57.         '        }\n' +
  58.         '        .thief-book-semi-hide {\n' +
  59.         '            opacity: 0;\n' +
  60.         '        }\n' +
  61.         '        .thief-book-icon {\n' +
  62.         '            cursor: default;\n' +
  63.         '            font-size: 30px;\n' +
  64.         '            transition: 0.3s;\n' +
  65.         '        }\n' +
  66.         '        .thief-book-slider {\n' +
  67.         '            height: 13px;\n' +
  68.         '            width: 100px;\n' +
  69.         '        }\n' +
  70.         '        .thief-book-hide {\n' +
  71.         '            display: none;\n' +
  72.         '        }\n' +
  73.         '    </style>';
  74.  
  75.     document.body.innerHTML +=
  76.         '<div id="thief-book-leftCorner" class="thief-book-mouse-area">\n' +
  77.         '    <div id="thief-book-settings" class="thief-book-settings-area">\n' +
  78.         '        <label class="thief-book-icon">&#128193;\n' +
  79.         '            <input type="file" id="thief-book-selectFile" style="display:none">\n' +
  80.         '        </label>\n' +
  81.         '        <label>\n' +
  82.         '            <input id="thief-book-progressSlider" class="thief-book-slider" style="width:500px" type="range" min="0" max="2" value="0">\n' +
  83.         '        </label>\n' +
  84.         '        <label>\n' +
  85.         '            <input id="thief-book-lineLengthSlider" class="thief-book-slider" type="range" min="5" max="70" value="20">\n' +
  86.         '        </label>\n' +
  87.         '    </div>\n' +
  88.         '    <div id="thief-book-lineBox" class="thief-book-line-box"></div>\n' +
  89.         '</div>';
  90.  
  91.     parseText(false);
  92.  
  93.     document.getElementById('thief-book-selectFile')
  94.         .addEventListener('change', function(){
  95.             let fr=new FileReader();
  96.             fr.onload=function(){
  97.                 text = fr.result;
  98.                 parseText(false);
  99.             }
  100.             fr.readAsText(this.files[0]);
  101.             document.getElementById('thief-book-settings').classList.add('thief-book-semi-hide');
  102.         })
  103.     document.getElementById('thief-book-progressSlider')
  104.         .addEventListener('input', function(){
  105.             pointer = parseInt(this.value);
  106.             printLine(true);
  107.         })
  108.     document.getElementById('thief-book-progressSlider')
  109.         .addEventListener('mouseup', function(){
  110.             printLine();
  111.         })
  112.     document.getElementById('thief-book-lineLengthSlider')
  113.         .addEventListener('input', function(){
  114.             lineLength = parseInt(this.value);
  115.             parseText(true)
  116.         })
  117.     window.addEventListener('keydown', function(e) {
  118.         if (e.code === keyNextLine) {
  119.             nextLine();
  120.         } else if (e.code === keyPreLine) {
  121.             preLine();
  122.         } else if (e.code === keyHide) {
  123.             onOff()
  124.         }
  125.     });
  126.  
  127.  
  128.     function parseText(keepProgress) {
  129.         lines = parseLines(text);
  130.         if (keepProgress) {
  131.             pointer = Math.round(progress * (lines.length - 1));
  132.         } else {
  133.             pointer = 0;
  134.             progress = 0;
  135.         }
  136.         let slider = document.getElementById('thief-book-progressSlider')
  137.         slider.min = 0;
  138.         slider.max = lines.length - 1;
  139.         printLine();
  140.     }
  141.  
  142.     function parseLines(text) {
  143.         text = text.replace(/\r/g, "")
  144.  
  145.         let i = 0,j = 0;
  146.         let lines = [];
  147.         while (j < text.length) {
  148.             if (j - i > lineLength || text[j] === '\n') {
  149.                 lines.push(text.slice(i, j+1))
  150.                 i = ++j;
  151.                 continue;
  152.             }
  153.             j++;
  154.         }
  155.         if (j > i) {
  156.             lines.push(text.slice(i, j))
  157.         }
  158.         return lines;
  159.     }
  160.  
  161.     function nextLine() {
  162.         if (pointer < lines.length - 1) {
  163.             pointer++;
  164.         }
  165.         printLine()
  166.     }
  167.     function preLine() {
  168.         if (pointer > 0) {
  169.             pointer--;
  170.         }
  171.         printLine();
  172.     }
  173.     function onOff() {
  174.         hide = !hide;
  175.         printLine();
  176.     }
  177.  
  178.     function printLine(multiLine) {
  179.         if (hide) {
  180.             document.getElementById('thief-book-leftCorner').classList.add('thief-book-hide');
  181.         } else {
  182.             document.getElementById('thief-book-leftCorner').classList.remove('thief-book-hide');
  183.         }
  184.  
  185.         document.getElementById('thief-book-lineBox').innerHTML = ''
  186.  
  187.         if (multiLine) {
  188.             let i = pointer - 20;
  189.             while (i < pointer) {
  190.                 if (i < 0) {
  191.                     i++;
  192.                     continue;
  193.                 }
  194.                 createLine(i);
  195.                 i++;
  196.             }
  197.         }
  198.         createLine(pointer);
  199.  
  200.         document.getElementById('thief-book-progressSlider').value = pointer;
  201.  
  202.         function createLine(ptr) {
  203.             let newLine = document.createElement('div');
  204.             newLine.classList.add('thief-book-line');
  205.             let line = lines[ptr];
  206.             if (line.length < lineLength) {
  207.                 line += '　'.repeat(lineLength - line.length);
  208.             }
  209.             newLine.innerText = calProgress(ptr) + '  ' + line;
  210.             document.getElementById('thief-book-lineBox').append(newLine);
  211.         }
  212.     }
  213.  
  214.     function calProgress(ptr) {
  215.         progress = ptr / (lines.length - 1);
  216.         return ptr === lines.length - 1 ? '100.00%' :
  217.             ('000' + ((100 * progress).toFixed(2))).slice(-5) + '%';
  218.     }
  219. })();