☰

鼠标拖拽

鼠标拖拽，按住鼠标左键拖拽选中文本、链接、图片后复制、打开、搜索，Alt+Y进入设置，Esc退出设置

目前為 2021-05-14 提交的版本，檢視 最新版本。

  1. // ==UserScript==
  2. // @name         鼠标拖拽
  3. // @version      1.3
  4. // @namespace    http://tampermonkey.net/
  5. // @description  鼠标拖拽，按住鼠标左键拖拽选中文本、链接、图片后复制、打开、搜索，Alt+Y进入设置，Esc退出设置
  6. // @author       lyscop
  7. // @icon         https://i.imgur.com/obQUjIi.png
  8. // @include      *
  9. // @run-at       document-end
  10. // @grant        GM_addStyle
  11. // @grant        GM_openInTab
  12. // @grant        GM_setValue
  13. // @grant        GM_getValue
  14. // @grant        GM.setValue
  15. // @grant        GM.getValue
  16. // @grant        GM_setClipboard
  17. // @grant        GM_download
  18. // @grant        GM_addValueChangeListener
  19. // @grant        GM_notification
  20. // @grant        window.close
  21. // @grant        GM_getResourceText
  22. // @grant        GM_xmlhttpRequest
  23. // @grant        GM_deleteValue
  24. // @grant        GM_listValues
  25. // ==/UserScript==
  26.  
  27.  
  28. (function() {
  29.     'use strict';
  30.     //==========①=========================
  31.     let storage = {
  32.         get: function(name, defaultValue) {
  33.             return GM_getValue(name, defaultValue);
  34.         },
  35.         set: function(name, data) {
  36.             return GM_setValue(name, data);
  37.         }
  38.     },
  39.         runtime = {
  40.             sendMessage: function(data){
  41.                 return Promise.resolve(this.processMessage(data));
  42.             },
  43.             processMessage: function(data){
  44.                 switch (data.subject) {
  45.                     case "gestureFrameMousedown":
  46.                     case "gestureFrameMousemove":
  47.                     case "gestureFrameMouseup":
  48.                         gestureHandler.handleMessage(data);
  49.                         break;
  50.                     case 'gestureChange':
  51.                         /*if(this.captureGesture){
  52.                             Ui.captureGesture(data.data.gesture, "recorddingGesture");
  53.  
  54.                             return;
  55.                         }*/
  56.                         try {
  57.                             let actionName = '';
  58.                             if(cfg.gesture[data.data.gesture].alias)
  59.                                 actionName = cfg.gesture[data.data.gesture].alias;
  60.                             else
  61.                                 actionName = local.gesture[cfg.gesture[data.data.gesture].name][cfg.language];
  62.                             return {action:actionName};
  63.                         } catch(e) {}
  64.                         break;
  65.                     case 'gestureEnd':
  66.                         /*if(this.captureGesture){
  67.                             Ui.captureGesture(data.data.gesture);
  68.                             return;
  69.                         }*/
  70.                         try {
  71.                             let action = cfg.gesture[data.data.gesture];
  72.                             Fn[action.name](action.arg, data.data);
  73.                         } catch(e) {
  74.                             // console.log(e);
  75.                         }
  76.                         break;
  77.                     case 'dragChange':
  78.                         if(this.captureGesture){
  79.                             Ui.captureGesture(data.data.gesture, "recorddingGesture");
  80.  
  81.                             return;
  82.                         }
  83.                         try {
  84.                             let actionName = '',
  85.                                 typeAndData = getDragFn(data.data);
  86.                             if(typeAndData[1].alias)
  87.                                 actionName = typeAndData[1].alias;
  88.                             else
  89.                                 actionName = local[typeAndData[0]][typeAndData[1].name][cfg.language];
  90.                             return {action:actionName};
  91.                         } catch(e) {}
  92.                         break;
  93.                     case 'dragEnd':
  94.                         if(this.captureGesture){
  95.                             Ui.captureGesture(data.data.gesture);
  96.                             return;
  97.                         }
  98.                         try {
  99.                             let action = getDragFn(data.data)[1];
  100.                             Fn[action.name](action.arg, data.data);
  101.                         } catch(e) {
  102.                             // console.log(e);
  103.                         }
  104.                         break;
  105.                     default:
  106.                         break;
  107.                 }
  108.             },
  109.             captureGesture:false
  110.         },
  111.         _cfg = {
  112.             Gesture: {
  113.                 mouseButton: 2,
  114.                 suppressionKey: "",
  115.                 distanceThreshold: 2,
  116.                 distanceSensitivity: 20,
  117.                 Timeout: {
  118.                     active: true,
  119.                     duration: 1
  120.                 }
  121.             },
  122.             Hinter: {
  123.                 background : '',
  124.                 fontSize: 0,
  125.                 lineColor: null,
  126.                 minLineWidth: 1,
  127.                 maxLineWidth: 10,
  128.                 lineGrowth: 0.6,
  129.                 funNotDefine: null
  130.             },
  131.             Drag: {
  132.                 linktextAslink: true,
  133.                 dragInTextarea: true
  134.             },
  135.             directions: 8,//方向
  136.             language: "zh",
  137.             gesture:{
  138.                 //"2":  {name:"toTop", arg:[]},
  139.             },
  140.             text: {// dragText
  141.                 "9":  {name:"copyText", arg:[]},
  142.                 "4":  {name:"deleteText", arg:[]},
  143.                 "7":  {name:"cutText", arg:[]},
  144.                 "1":  {name:"pasteText", arg:[]},
  145.                 "2":  {name:"space", arg:[]},
  146.                 "3":  {
  147.                     name:"searchText",
  148.                     arg:["https://www.baidu.com/s?wd=", true, true]
  149.                 },
  150.                 "6":  {
  151.                     name:"searchText",
  152.                     arg:["http://www.google.com/search?q=", true, true]
  153.                 }
  154.             },
  155.             link: {// drag link
  156.                 "3": {name:"openLink", arg:[]},
  157.                 "9": {name:"copyLink", arg:[]},
  158.                 "1": {name:"copyLinkText", arg:[]},
  159.             },
  160.             image: {// drag image
  161.                 "46": {name:"saveImg", arg:[]},
  162.                 "64": {name:"copyImg", arg:[]},
  163.                 "2": {name:"openImgURL", arg:[]},
  164.                 "3": {
  165.                     name:"searchImg",
  166.                     arg:['https://graph.baidu.com/details?isfromtusoupc=1&tn=pc&carousel=0&promotion_name=pc_image_shituindex&extUiData%5bisLogoShow%5d=1&image=U-R-L', true, true]
  167.                 },
  168.                 "7": {
  169.                     name:"searchImg",
  170.                     arg:['https://yandex.com/images/search?rpt=imageview&url=U-R-L', true, true]
  171.                 },
  172.                 "4": {
  173.                     name:"searchImg",
  174.                     arg:['https://www.tineye.com/search?url=U-R-L', true, true]
  175.                 },
  176.                 "6": {
  177.                     name:"searchImg",
  178.                     arg:['https://www.google.com/searchbyimage?image_url=U-R-L', true, true]
  179.                 },
  180.                 "9": {name:"copyImgLink", arg:[]},
  181.                 "1": {name:"copyImgURL", arg:[]},
  182.                 "8": {name:"openImgLink", arg:[]},
  183.                 //"4": {name:"selectImg", arg:[]}
  184.             },
  185.         },
  186.         cfg = storage.get('cfg',_cfg),
  187.         Fn = {
  188.             userDefine: function(argumentArr, data){
  189.                 try {
  190.                     new Function("mpArray", "mpData", mpUnescape(argumentArr[0]))(data);
  191.                 } catch(e) {
  192.                     console.log(e);
  193.                 }
  194.             },
  195.             stopLoading: function() {
  196.                 window.stop();
  197.             },
  198.             reload: function() {
  199.                 history.go(0);
  200.                 //window.location.reload();
  201.             },
  202.             reloadNoCache: function() {
  203.                 window.location.reload(true);
  204.             },
  205.             close: function() {
  206.                 window.close();
  207.             },
  208.             back: function() {
  209.                 history.back();
  210.             },
  211.             forward: function() {
  212.                 history.forward();
  213.             },
  214.             toTop: function() {
  215.                 document.documentElement.scrollTo(0, 0);
  216.             },
  217.             toBottom: function() {
  218.                 document.documentElement.scrollTo(0, 9999999);
  219.             },
  220.             reopenTab: function() {
  221.                 //GreasyMonkdy:
  222.                 // GM_openInTab(GM_getValue('latestTab'),false);
  223.                 //TamperMonkey:
  224.                 GM_openInTab(GM_getValue('latestTab', 'about:blank'), {
  225.                     active: true
  226.                 });
  227.             },
  228.             URLLevelUp: function() {
  229.                 //当前网址的层次结构向上一层
  230.                 if (window.location.href[window.location.href.length - 1] === "/")
  231.                     window.location.href = "../";
  232.                 else
  233.                     window.location.href = "./";
  234.             },
  235.             //clone curren tab ,background
  236.             cloneTab: function() {
  237.                 GM_openInTab(location.href, {
  238.                     active: false
  239.                 });
  240.             },
  241.             //open new blank tab
  242.             openBlankTab: function() {
  243.                 GM_openInTab('about:blank', {
  244.                     active: true
  245.                 });
  246.             },
  247.             //view source
  248.             viewSource: function() {
  249.                 GM_openInTab('view-source:'+location.href, {
  250.                     active: true
  251.                 });
  252.             },
  253.             fkVip: function(argumentArr) {
  254.                 GM_openInTab(argumentArr[0]+location.href, {active:true});
  255.             },
  256.             closeOtherTabs: function() {
  257.                 GM_setValue('closeAll', Date());
  258.             },
  259.  
  260.             deleteText: function() {
  261.                 try {
  262.                     if(document.execCommand("Delete", "false", null)){
  263.                         //success info
  264.                         count(newFn.deleteText);
  265.                         console.log("doSomethingOk");
  266.                     } else{
  267.                         //fail info
  268.                         console.log("doSomethingNotOk");
  269.                     }
  270.                 } catch (error) {
  271.                     return document.execCommand("Delete", "false", null);
  272.                 }
  273.             },
  274.             cutText: function() {
  275.                 try {
  276.                     if(document.execCommand("Cut", "false", null)){
  277.                         count(newFn.cutText);
  278.                         console.log("doSomethingOk");
  279.  
  280.                     } else{
  281.                         //fail info
  282.                         console.log("doSomethingNotOk");
  283.                     }
  284.                 } catch (error) {
  285.                     return document.execCommand("Cut", "false", null);
  286.                 }
  287.             },
  288.             pasteText: function() {
  289.                 try {
  290.                     if(window.navigator.clipboard.readText()
  291.                        .then(text => {
  292.                         document.execCommand("insertText", "false", text);
  293.                     })
  294.                        .catch(err => {
  295.                         console.error('Failed to read clipboard contents: ', err);
  296.                     })) {
  297.                         //success info
  298.                         count(newFn.pasteText);
  299.                         console.log("doSomethingOk");
  300.                     } else{
  301.                         //fail info
  302.                         console.log("doSomethingNotOk");
  303.                     }
  304.                 } catch (error) {
  305.                     return;
  306.                 }
  307.             },
  308.             space: function() {
  309.                 try {
  310.  
  311.                     if(document.execCommand("insertText", "false", " ")){
  312.                         count(newFn.space);
  313.                         console.log("doSomethingOk");
  314.                     } else{
  315.                         //fail info
  316.                         console.log("doSomethingNotOk");
  317.                     }
  318.                 } catch (error) {
  319.                     return document.execCommand("insertText", "false", " ");
  320.                 }
  321.             },
  322.             searchText: function(argumentArr, data) {
  323.                 GM_openInTab(argumentArr[0] + encodeURIComponent(data.textSelection),
  324.                              {
  325.                     //active: argumentArr[1] != "false",
  326.                     //insert: argumentArr[2] != "false",
  327.                     active: false,
  328.                     insert: true,
  329.                     setParent: true //makes the browser re-focus the current tab on close.
  330.                 });
  331.                 count(newFn.searchText);
  332.             },
  333.             copyText: function(argumentArr, data) {
  334.                 GM_setClipboard(data.textSelection, "text");
  335.                 //showclipboard(data.textSelection);
  336.                 window.navigator.clipboard.readText()
  337.                     .then(text => {
  338.  
  339.                     showclipboard(text);
  340.                 })
  341.                     .catch(err => {
  342.                     console.error('Failed to read clipboard contents: ', err);
  343.                 });
  344.                 count(newFn.copyText);
  345.             },
  346.             openLink: function(argumentArr, data) {
  347.                 //TamperMonkey
  348.                 GM_openInTab(getLink(data), {
  349.                     active: false,
  350.                     insert: true,
  351.                     setParent :true
  352.                 });
  353.                 count(newFn.openLink);
  354.             },
  355.             copyLink: function(argumentArr, data) {
  356.                 GM_setClipboard(getLink(data), "text");
  357.  
  358.                 //showclipboard(getLink(data));
  359.                 window.navigator.clipboard.readText()
  360.                     .then(text => {
  361.  
  362.                     showclipboard(text);
  363.                 })
  364.                     .catch(err => {
  365.                     console.error('Failed to read clipboard contents: ', err);
  366.                 });
  367.                 count(newFn.copyLink);
  368.             },
  369.             copyLinkText: function(argumentArr, data) {
  370.                 GM_setClipboard(data.target.textContent || data.textSelection, "text");
  371.  
  372.                 //showclipboard(data.target.textContent || data.textSelection);
  373.                 window.navigator.clipboard.readText()
  374.                     .then(text => {
  375.  
  376.                     showclipboard(text);
  377.                 })
  378.                     .catch(err => {
  379.                     console.error('Failed to read clipboard contents: ', err);
  380.                 });
  381.                 count(newFn.copyLinkText);
  382.  
  383.             },
  384.  
  385.             copyImgLink: function(argumentArr, data) {
  386.                 GM_setClipboard(getLink(data), "text");
  387.  
  388.                 window.navigator.clipboard.readText()
  389.                     .then(text => {
  390.  
  391.                     showclipboard(text);
  392.                 })
  393.                     .catch(err => {
  394.                     console.error('Failed to read clipboard contents: ', err);
  395.                 });
  396.                 count(newFn.copyImgLink);
  397.  
  398.             },
  399.             openImgLink: function(argumentArr, data) {
  400.                 GM_openInTab(getLink(data), {
  401.                     active: false,
  402.                     insert: true,
  403.                     setParent :true
  404.                 });
  405.                 count(newFn.openImgLink);
  406.             },
  407.             saveImg: function(argumentArr, data) {
  408.                 //TamperMonkey
  409.                 let name = data.target.src.split('/').pop();
  410.  
  411.                 let d = new Date();
  412.                 let TimeDateFormatText = '[Year]-[Month]-[Day] [Hour][Minute]';
  413.                 let timetext = TimeDateFormatText.replace(/\[YEAR\]/gi, d.getFullYear().toString()).replace(/\[MONTH\]/gi, ('0' +(d.getMonth()+1).toString()).slice(-2)).replace(/\[DAY\]/gi, ('0' +d.getDate().toString()).slice(-2)).replace(/\[HOUR\]/gi, ('0' +d.getHours().toString()).slice(-2)).replace(/\[MINUTE\]/gi, ('0' +d.getMinutes().toString()).slice(-2)).replace(/\[SECOND\]/gi, ('0' +d.getSeconds().toString()).slice(-2));
  414.  
  415.                 GM_download(data.target.src, timetext);
  416.                 showclipboard("已保存");
  417.                 count(newFn.saveImg);
  418.                 //method 2
  419.                 /*
  420.         let a = document.createElement('a');
  421.         a.href = dObj.img; a.setAttribute('download', dObj.img.split('/').pop());
  422.         document.documentElement.appendChild(a);
  423.         a.click();
  424.         a.parentElement.remove(a);
  425.         */
  426.                 /* //jQuery:
  427.         $("<a>").attr("href", actionFn.request.selimg).attr("download", actionFn.request.selimg.split('/').pop()).appendTo("body");
  428.         a[0].click();
  429.         a.remove();
  430.         */
  431.             },
  432.             searchImg: function(argumentArr, data) {
  433.                 //TamperMonkey
  434.                 GM_openInTab(argumentArr[0].replace(/U-R-L/, data.target.src), {
  435.                     //active: argumentArr[1] != "false",
  436.                     //insert: argumentArr[2] != "true",
  437.                     active: false,
  438.                     insert: true,
  439.                     setParent: true
  440.                 });
  441.                 count(newFn.searchImg);
  442.             },
  443.             selectImg: function(argumentArr, data) {
  444.                 // it may not working on some browsers [develping standard]
  445.                 //TamperMonkey
  446.                 document.execCommand('selectAll');
  447.                 let sel = document.getSelection();
  448.                 sel.collapse(data.target.self, 0);
  449.                 sel.modify("extend", "forward", "character");
  450.             },
  451.             //not working:
  452.             copyImage: function(argumentArr, data) {
  453.                 /*let canvas = canvasDrawTheImage(e);
  454.                 // get image as blob
  455.                 canvas.canvas.toBlob((blob) => {
  456.                     GM_setClipboard(blob, {
  457.                         type: canvas.type,
  458.                         mimetype: canvas.mime
  459.                     });
  460.                 }, canvas.mime);*/
  461.                 copyImageto(data.target.src);
  462.                 count(newFn.copyImage);
  463.             },
  464.         /*image2DataURL: function(e) {
  465.             //canvas绘制图片，由于浏览器的安全考虑:
  466.             //如果在使用canvas绘图的过程中，使用到了外域的图片资源，那么在toDataURL()时会抛出安全异常：
  467.             let canvas = canvasDrawTheImage(e).canvas;
  468.             let dataURL = canvas.toDataURL();
  469.             GM_setClipboard(dataURL, "text");
  470.         },*/
  471.             copyImgURL: function(argumentArr, data) {
  472.                 //TamperMonkey
  473.                 GM_setClipboard(data.target.src, "text");
  474.  
  475.                 showclipboard(data.target.src);
  476.                 count(newFn.copyImgURL);
  477.             },
  478.             openImgURL: function(argumentArr, data) {
  479.                 //TamperMonkey
  480.                 GM_openInTab(data.target.src, {
  481.                     active: false,
  482.                     insert: true,
  483.                     setParent :true
  484.                 });
  485.                 count(newFn.openImgURL);
  486.             },
  487.             setting: function() {
  488.                 if (document.getElementById('MPsetting')) {
  489.                     return;
  490.                 }else Ui.init();
  491.             }
  492.         },
  493.         local = {
  494.             gesture:{
  495.                 /*stopLoading:     {zh:'停止加载',         en:'StopLoading'},
  496.                 reload:          {zh:'刷新',             en:'Refresh'},
  497.                 reloadNoCache:   {zh:'清缓存刷新',       en:'Refresh Without Cache'},
  498.                 close:           {zh:'关闭',             en:'Close'},
  499.                 back:            {zh:'后退',             en:'Back'},
  500.                 forward:         {zh:'前进',             en:'Forward'},
  501.                 toTop:           {zh:'到顶部',           en:'Scroll to Top'},
  502.                 toBottom:        {zh:'到底部',           en:'Scroll to Bottom'},
  503.                 reopenTab:       {zh:'打开最近关闭窗口', en:'Reopen Latest Closed Window'},
  504.                 setting:         {zh:'设置',             en:'Settings'},
  505.                 URLLevelUp:      {zh:'网址向上一层',     en:'URL hierarchy up'},
  506.                 cloneTab:        {zh:'克隆标签页',       en:'Duplicate This Tab'},
  507.                 openBlankTab:    {zh:'打开空白页',       en:'Open New Blank Tab'},
  508.                 viewSource:      {zh:'看网页源代码',     en:'View Source'},
  509.                 fkVip:           {zh:'破解VIP视频',      en:'Crack to Watch VIP Video'},
  510.                 closeOtherTabs:  {zh:'关闭其他标签',     en:'Close Other Tabs'},
  511.                 translateSelect: {zh:'开启划词翻译',     en:'Turn on Select And Translate'},
  512.                 //开发者功能
  513.                 contentEditable: {zh:'元素内容可编辑',   en:'Element Content Editable'},
  514.                 userDefine:      {zh:'自定义',           en:'User Define'}*/
  515.             },
  516.             //drag text
  517.             text: {
  518.                 searchText:      {zh:'搜索选中文本',     en:'Search Selected Text'},
  519.                 copyText:        {zh:'复制选中文本',     en:'Copy Selected Text'},
  520.                 deleteText:      {zh:'退格',             en:'Delete Selected Text'},
  521.                 cutText:         {zh:'剪切',             en:'Cut Selected Text'},
  522.                 pasteText:       {zh:'粘贴',             en:'Paste Selected Text'},
  523.                 space:           {zh:'空格',             en:'Input Space'},
  524.                 userDefine:      {zh:'自定义',           en:'User Define'}
  525.             },
  526.             //drag link
  527.             link:{
  528.                 openLink:        {zh:'打开链接',         en:'Open Link'},
  529.                 copyLink:        {zh:'复制链接',         en:'Copy Link'},
  530.                 copyLinkText:    {zh:'复制链接文字',     en:'Copy Link Text'},
  531.                 userDefine:      {zh:'自定义',           en:'User Define'}
  532.             },
  533.             //drag image
  534.             image:{
  535.                 saveImg:         {zh:'保存图片',         en:'Save Image'},
  536.                 searchImg:       {zh:'搜索图片',         en:'Search Image'},
  537.                 copyImage:       {zh:'复制图片',         en:'Copy Image to ClickBoard'},
  538.                 copyImgURL:      {zh:'复制图片链接（img）',     en:'Copy ImageURL'},
  539.                 openImgURL:   {zh:'新标签打开图片(img)',   en:'Open Image in New Tab'},
  540.                 copyImgLink:     {zh:'复制图片链接',   en:'Open Image in New Tab'},
  541.                 openImgLink:     {zh:'打开图片链接',   en:'Open Image in New Tab'},
  542.                 // image2DataURL:   {zh:'复制图片为DataURL',en:'Copy Image as DataURL'},
  543.                 //selectImg:       {zh:'选中图片',         en:'Select This Image'},
  544.                 userDefine:      {zh:'自定义',           en:'User Define'}
  545.             }
  546.         };
  547.  
  548.     let mouseEvent = null;
  549.  
  550.     document.addEventListener('mousemove', event => {
  551.         mouseEvent = event;
  552.     });
  553.  
  554.     document.addEventListener('keydown',function(event) {
  555.  
  556.         var keynum;
  557.         if(window.event) // IE
  558.             keynum = event.keyCode;
  559.         else if(event.which) // Netscape/Firefox/Opera
  560.             keynum = event.which;
  561.  
  562.         if(keynum == 89 && event.altKey) {//Alt+Y设置
  563.             if (document.getElementById('MPsetting')) {
  564.                 return;
  565.             }else Ui.init();
  566.         }else if(keynum ==73 && event.altKey) {//Alt+I重置
  567.             var mymessage = confirm("是否确定重置设置？");
  568.             if(mymessage == true) {
  569.                 GM_deleteValue('cfg');
  570.             }
  571.         }else if(keynum == 27) {//Esc退出设置
  572.             Ui.closesetting()
  573.         }else if(keynum ==85 && event.altKey) {//Alt+U计数
  574.             let allValue = GM_listValues();
  575.             let vala = [];
  576.             let valb = [];
  577.             let valc = [];
  578.             allValue.forEach(function(value, index) {//["searchText","Google搜索"]
  579.  
  580.                      Object.keys(local).forEach(function (value1, index1) {//[iconData[iconArraya], iconDara[iconArrayb]]
  581.  
  582.                         Object.keys(local[value1]).forEach(function(n) {//[name:,image:,host:][name:,image:,host:]
  583.  
  584.                             if(index1 == 1){
  585.                                 if(value === n){
  586.                                     vala.push(GM_getValue(value));
  587.                                 }
  588.                             } else if(index1 == 2){
  589.                                 if(value === n){
  590.                                     valb.push(GM_getValue(value));
  591.                                 }
  592.                             } else if(index1 == 3){
  593.                                 if(value === n){
  594.                                     valc.push(GM_getValue(value));
  595.                                 }
  596.                             }
  597.  
  598.                     });
  599.                 });
  600.             });
  601.  
  602.             vala.sort(compare( "times"));
  603.             valb.sort(compare( "times"));
  604.             valc.sort(compare( "times"));
  605.  
  606.             console.log("文字功能统计数据：");
  607.             console.log(vala);
  608.             console.log("链接功能统计数据：");
  609.             console.log(valb);
  610.             console.log("图片功能统计数据：");
  611.             console.log(valc);
  612.  
  613.         }
  614.  
  615.     });
  616.         
  617.     //========②supported functions=======
  618.     function getLink(data){
  619.         if(data.link)
  620.             return data.link.href;
  621.         else if(data.target.src)
  622.             return data.target.src;
  623.         else return data.textSelection;
  624.     }
  625.  
  626.     //--> check if string is an url
  627.     function isURL (string) {
  628.         try {
  629.             new URL(string);
  630.         }
  631.         catch (e) {
  632.             return false;
  633.         }
  634.         return true;
  635.     }
  636.  
  637.     //--> checks if the current window is framed or not
  638.     function inIframe () {
  639.         try {
  640.             return window.self !== window.top;
  641.         }
  642.         catch (e) {
  643.             return true;
  644.         }
  645.     }
  646.  
  647.     //--> returns all available data of the given target
  648.     //--> this data is used by some background actions
  649.     function getTargetData(target) {
  650.         let data = {};
  651.  
  652.         data.target = {
  653.             src: target.currentSrc || target.src || null,
  654.             title: target.title || null,
  655.             alt: target.alt || null,
  656.             textContent: target.textContent.trim(),
  657.             nodeName: target.nodeName,
  658.             self: target
  659.         };
  660.  
  661.         let link = getClosestLink(target);
  662.         if (link) {
  663.             data.link = {
  664.                 href: link.href || null,
  665.                 title: link.title || null,
  666.                 textContent: link.textContent.trim()
  667.             };
  668.         }
  669.  
  670.         data.textSelection = getTextSelection();
  671.  
  672.         return data;
  673.     }
  674.  
  675.     //--> returns the selected text, if no text is selected it will return an empty string
  676.     //--> inspired by https://stackoverflow.com/a/5379408/3771196
  677.     function getTextSelection () {
  678.         // get input/textfield text selection
  679.         if (document.activeElement &&
  680.             typeof document.activeElement.selectionStart === 'number' &&
  681.             typeof document.activeElement.selectionEnd === 'number') {
  682.             return document.activeElement.value.slice(
  683.                 document.activeElement.selectionStart,
  684.                 document.activeElement.selectionEnd
  685.             );
  686.         }
  687.         // get normal text selection
  688.         return window.getSelection().toString();
  689.     }
  690.  
  691.     //--> calculates and returns the distance
  692.     //--> between to points
  693.     function getDistance(x1, y1, x2, y2) {
  694.         return Math.hypot(x2 - x1, y2 - y1);
  695.     }
  696.  
  697.     //--> returns the closest hierarchical link node or null of given element
  698.     function getClosestLink (node) {
  699.         // bubble up the hierarchy from the target element
  700.         while (node !== null && node.nodeName.toLowerCase() !== "a" && node.nodeName.toLowerCase() !== "area")
  701.             node = node.parentElement;
  702.         return node;
  703.     }
  704.     function getDirection(x, y, cx, cy){
  705.         /*=================
  706.     |                 |
  707.     | 1↖   2↑   3↗ |
  708.     |                 |
  709.     | 4←    5    6→ |
  710.     |                 |
  711.     | 7↙   8↓   9↘ |
  712.     |                 |
  713.     |=================*/
  714.         let d, t;
  715.         if(cfg.directions == 4){   //4 directions
  716.             if (Math.abs(cx - x) < Math.abs(cy - y)) {
  717.                 d = cy > y ? "8" : "2";
  718.             } else {
  719.                 d = cx > x ? "6" : "4";
  720.             }
  721.         }else{  //8 directions
  722.             t = (cy-y)/(cx-x);
  723.             if     (-0.4142<= t && t < 0.4142) d = cx > x ? '6' : "4";
  724.             else if(2.4142 <= t || t< -2.4142) d = cy > y ? '8' : '2';
  725.             else if(0.4142 <= t && t < 2.4142) d = cx > x ? '9' : '1';
  726.             else                               d = cy > y ? '7' : '3';
  727.         }
  728.         return d;
  729.     }
  730.     // data: data.data
  731.     function getDragFn(data){
  732.         // let
  733.         if(data.target.nodeName === "IMG")
  734.             return ['image',cfg.image[data.gesture]];
  735.         else if(data.link || data.target.nodeName === "A" || isURL(data.textSelection))
  736.             return ['link', cfg.link[data.gesture]];
  737.         else
  738.             return ['text', cfg.text[data.gesture]];
  739.     }
  740.  
  741.     function mpEscape(str){
  742.         if(!str) return;
  743.         return str.replace(/"/g, "&quot;").replace(/'/g, "&apos;");
  744.     }
  745.     function mpUnescape(str){
  746.         if(!str) return;
  747.         return str.replace(/&quot;/g,'"').replace(/&apos;/g, "'");
  748.     }
  749.     
  750.    function count(a) {
  751.         //存储次数和日期
  752.         let d = new Date();
  753.         let TimeDateFormatText = '[Year]/[Month]/[Day] [Hour]:[Minute]:[Second]';
  754.         let timetext = TimeDateFormatText.replace(/\[YEAR\]/gi, d.getFullYear().toString()).replace(/\[MONTH\]/gi, ('0' +(d.getMonth()+1).toString()).slice(-2)).replace(/\[DAY\]/gi, ('0' +d.getDate().toString()).slice(-2)).replace(/\[HOUR\]/gi, ('0' +d.getHours().toString()).slice(-2)).replace(/\[MINUTE\]/gi, ('0' +d.getMinutes().toString()).slice(-2)).replace(/\[SECOND\]/gi, ('0' +d.getSeconds().toString()).slice(-2));
  755.  
  756.         if(GM_getValue(a)){
  757.             GM_setValue(a, {
  758.                 'name':a,
  759.                 'times': GM_getValue(a).times + 1,
  760.                 'date': timetext
  761.             });
  762.         }else{
  763.             GM_setValue(a, {
  764.                 'name':a,
  765.                 'times': 1,
  766.                 'date': timetext
  767.             });
  768.         }
  769.  
  770.         console.log(a + ":" + GM_getValue(a).times + "times\0" + GM_getValue(a).date);
  771.  
  772.     }
  773.  
  774.     function compare( propertyName) {
  775.         return function( object1, object2) {
  776.             var value1 = object1[propertyName];
  777.             var value2 = object2[propertyName];
  778.             if(value1 < value2) {
  779.                 return 1;
  780.             } else if(value1 > value2) {
  781.                 return - 1;
  782.             } else {
  783.                 return 0;
  784.             }
  785.         }
  786.     }
  787.  
  788.     //对象的元素中获取该元素的名字
  789.     const handler = {
  790.         get: function(obj, prop) {
  791.             //console.log(prop);
  792.             //return obj[prop];
  793.             return prop;
  794.         }
  795.     };
  796.  
  797.     const newFn = new Proxy(Fn, handler);
  798.     
  799.     
  800.     //复制图片到剪切板
  801.     function imageToBlob(imageURL) {
  802.         const img = new Image;
  803.         const c = document.createElement("canvas");
  804.         const ctx = c.getContext("2d");
  805.         img.crossOrigin = "";
  806.         //img.src = imageURL;
  807.         img.src = imageURL + '?v=' + Math.random();
  808.         return new Promise(resolve => {
  809.             img.onload = function () {
  810.                 c.width = this.naturalWidth;
  811.                 c.height = this.naturalHeight;
  812.                 ctx.drawImage(this, 0, 0);
  813.                 c.toBlob((blob) => {
  814.                     // here the image is a blob
  815.                     resolve(blob)
  816.                 }, "image/png", 0.75);
  817.             };
  818.         })
  819.     }
  820.  
  821.     async function copyImageto(imageURL){
  822.         const blob = await imageToBlob(imageURL)
  823.         const item = new ClipboardItem({ "image/png": blob });
  824.         navigator.clipboard.write([item]);
  825.         showclipboard("已复制");
  826.     }
  827.     
  828.     
  829.  
  830.     //========③Hinter====================
  831.     const Hinter = (function(){
  832.         let modul = {};
  833.  
  834.         modul.enable = function enable(){
  835.             GestureHandler
  836.                 .on("start", addCanvas)
  837.                 .on("update", updateTrack)
  838.                 .on("change", updateHint)
  839.                 .on("abort", reset)
  840.                 .on("end", reset);
  841.         };
  842.  
  843.         modul.applySettings = function applySettings(Config){
  844.             //background   = Config.Hinter.background;//隐藏提示
  845.             fontSize     = Config.Hinter.fontSize;
  846.             //lineColor    = Config.Hinter.lineColor;
  847.             minLineWidth = Config.Hinter.minLineWidth;
  848.             maxLineWidth = Config.Hinter.maxLineWidth;
  849.             //lineGrowth   = Config.Hinter.lineGrowth;
  850.             funNotDefine = Config.Hinter.funNotDefine;
  851.             updateHintLayer();
  852.         };
  853.  
  854.         //private methods & value
  855.         let
  856.         background = '',//隐藏提示
  857.             fontSize = 0,
  858.             lineColor = null,
  859.             minLineWidth = 1,
  860.             maxLineWidth = 10,
  861.             lineGrowth = 0.6,
  862.             funNotDefine = '';
  863.         let canvas = null,
  864.             tip = null,
  865.             ctx = null,
  866.             hasCanvas = false;
  867.  
  868.         function updateHintLayer(){
  869.             canvas = tip = ctx = hasCanvas = null;
  870.             createCanvaTips();
  871.         }
  872.         function createCanvaTips(){
  873.             //create <canvas>
  874.             canvas = document.createElement("canvas");
  875.             canvas.id = 'MPcanvas';
  876.             ctx = canvas.getContext("2d");
  877.             //create tips<div>
  878.             tip = document.createElement('div');
  879.             tip.id = 'MPtips';
  880.             tip.style.cssText = `background:#${background} !important;  font-size: ${fontSize}px !important;`;
  881.         }
  882.         //<canvas> & tip<div> is ready, when mousemove or drag, append to show track & tips
  883.         function addCanvas(e) {
  884.             if(!canvas || !tip) createCanvaTips();
  885.             document.documentElement.appendChild(tip);      //append tip <div>
  886.             document.documentElement.appendChild(canvas);   //append <canvas>
  887.             canvas.width = window.innerWidth;               //set canvas attribute to clear content
  888.             canvas.height = window.innerHeight;
  889.             ctx.lineCap = "round";
  890.             ctx.lineJoin = "round";
  891.             //if(lineColor.length>6) canvas.style.opacity = parseInt(lineColor.slice(6),16)/255;
  892.             canvas.style.opacity = 0;//不显示轨迹
  893.             ctx.lineWidth = minLineWidth;
  894.             //ctx.strokeStyle = '#' + lineColor.slice(0,6); //like delicious link color//line color
  895.             hasCanvas = true;
  896.             //allow drop
  897.             tip.addEventListener('dragover', ()=>event.preventDefault(), false);
  898.             canvas.addEventListener('dragover', ()=>event.preventDefault(), false);
  899.         }
  900.         //remove <canvas> and tips<div>,set flags to false
  901.         function reset() {
  902.             if (hasCanvas) {
  903.                 document.documentElement.removeChild(canvas);
  904.                 tip.innerHTML = '';
  905.                 document.documentElement.removeChild(tip);
  906.             }
  907.             hasCanvas = false;
  908.         }
  909.         //show Tips
  910.         function updateHint(gesture,fnName){
  911.             tip.innerHTML = gesture.join("") + '<br/>' + (fnName ? fnName : funNotDefine);
  912.         }
  913.         function updateTrack(x,y){
  914.             if (hasCanvas) {
  915.                 ctx.lineWidth = Math.min(maxLineWidth, ctx.lineWidth += lineGrowth);
  916.                 ctx.lineTo(x, y);
  917.                 ctx.stroke();
  918.                 ctx.closePath();
  919.                 ctx.beginPath();
  920.                 ctx.moveTo(x, y);
  921.             }
  922.         }
  923.         // due to modul pattern: http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html
  924.         return modul;
  925.     })();
  926.  
  927.     //========④GesturedHadler============
  928.     //--> GestureHandler "singleton" class using the modul pattern
  929.     //--> the handler behaves different depending on whether it's injected in a frame or not
  930.     //--> frame: detects gesture start, move, end and sends an indication message
  931.     //--> main page: detects whole gesture including frame indication messages and reports it to the background script
  932.     //--> provides 4 events: on start, update, change and end
  933.     //--> on default the handler is disabled and must be enabled via enable()
  934.     //--> REQUIRES: contentCommons.js
  935.     const GestureHandler = (function() {
  936.         // public variables and methods
  937.         let modul = {};
  938.  
  939.         //-->Add callbacks to the given events
  940.         modul.on = function on(event, callback) {
  941.             // if event does not exist or function already applied skip it
  942.             if (event in events && !events[event].includes(callback))
  943.                 events[event].push(callback);
  944.             return this;
  945.         };
  946.  
  947.         //-->applies necessary settings
  948.         modul.applySettings = function applySettings(Settings) {
  949.             mouseButton = Number(Settings.Gesture.mouseButton);
  950.             suppressionKey = Settings.Gesture.suppressionKey;
  951.             distanceSensitivity = Settings.Gesture.distanceSensitivity;
  952.             distanceThreshold = Settings.Gesture.distanceThreshold;
  953.             timeoutActive = Settings.Gesture.Timeout.active;
  954.             timeoutDuration = Settings.Gesture.Timeout.duration;
  955.         };
  956.  
  957.         //-->Add the event listeners
  958.         modul.enable = function enable() {
  959.             if (inIframe()) {
  960.                 //window.addEventListener('mousedown', handleFrameMousedown, true);//去掉鼠标手势动作
  961.                 //window.addEventListener('mousemove', handleFrameMousemove, true);
  962.                 //window.addEventListener('mouseup', handleFrameMouseup, true);
  963.                 window.addEventListener('dragstart', handleDragstart, true);
  964.             } else {
  965.                 // chrome.runtime.onMessage.addListener(handleMessage);
  966.                 window.addEventListener('mousedown', handleMousedown, true);
  967.             }
  968.         };
  969.  
  970.         //-->Remove the event listeners and resets the handler
  971.         modul.disable = function disable() {
  972.             if (inIframe()) {
  973.                 //window.removeEventListener('mousedown', handleFrameMousedown, true);
  974.                 //window.removeEventListener('mousemove', handleFrameMousemove, true);
  975.                 //window.removeEventListener('mouseup', handleFrameMouseup, true);
  976.                 window.removeEventListener('dragstart', handleDragstart, true);
  977.             } else {
  978.                 // chrome.runtime.onMessage.removeListener(handleMessage);
  979.                 //window.removeEventListener('mousedown', handleMousedown, true);
  980.                 //window.removeEventListener('mousemove', handleMousemove, true);
  981.                 //window.removeEventListener('mouseup', handleMouseup, true);
  982.                 //window.removeEventListener('contextmenu', handleContextmenu, true);
  983.                 //window.removeEventListener('mouseout', handleMouseout, true);
  984.                 window.removeEventListener('dragstart', handleDragstart, true);
  985.                 // reset gesture array, internal state and target data
  986.                 directions = [];
  987.                 state = "passive";
  988.                 targetData = {};
  989.             }
  990.         };
  991.  
  992.         // private variables and methods
  993.  
  994.         // setting properties
  995.         let mouseButton = 2,
  996.             dragButton = 1,//MP
  997.             suppressionKey = "",
  998.             distanceThreshold = 2,
  999.             distanceSensitivity = 10,
  1000.             timeoutActive = true, //超时取消动作 没取消轨迹
  1001.             timeoutDuration = 1;
  1002.  
  1003.         // contains all gesture direction letters
  1004.         let directions = [];
  1005.  
  1006.         // internal state: passive, pending, active
  1007.         let state = "passive";
  1008.  
  1009.         // holds reference point to current point
  1010.         let referencePoint = {
  1011.             x: 0,
  1012.             y: 0
  1013.         };
  1014.  
  1015.         // contains the timeout identifier
  1016.         let timeout = null;
  1017.  
  1018.         // contains relevant data of the target element
  1019.         let targetData = {};
  1020.  
  1021.         // holds all event callbacks added by on()
  1022.         let events = {
  1023.             'start': [],
  1024.             'update': [],
  1025.             'change': [],
  1026.             'abort': [],
  1027.             'end': []
  1028.         };
  1029.  
  1030.         //-->initializes the gesture to the "pending" state, where it's unclear if the user is starting a gesture or not
  1031.         //-->requires the current x and y coordinates
  1032.         function init(x, y) {
  1033.             // set the initial point
  1034.             referencePoint.x = x;
  1035.             referencePoint.y = y;
  1036.  
  1037.             // change internal state
  1038.             state = "pending";
  1039.  
  1040.             // add gesture detection listeners
  1041.             //window.addEventListener('mousemove', handleMousemove, true);
  1042.             window.addEventListener('dragstart', handleDragstart, true);
  1043.             window.addEventListener('drag', handleDrag, true);//MP
  1044.             window.addEventListener('dragend', handleDragend, true);//MP
  1045.             //window.addEventListener('contextmenu', handleContextmenu, true);
  1046.             //window.addEventListener('mouseup', handleMouseup, true);
  1047.             //window.addEventListener('mouseout', handleMouseout, true);
  1048.         }
  1049.  
  1050.         //-->Indicates the gesture start and should only be called once untill gesture end
  1051.         function start() {
  1052.             // dispatch all binded functions with the current x and y coordinates as parameter on start
  1053.             events['start'].forEach((callback) => callback(referencePoint.x, referencePoint.y));
  1054.  
  1055.             // change internal state
  1056.             state = "active";
  1057.         }
  1058.  
  1059.         //-->Indicates the gesture change and should be called every time the cursor position changes
  1060.         //-->requires the current x and y coordinates
  1061.         function update(x, y, dragMark) {
  1062.             // dispatch all binded functions with the current x and y coordinates as parameter on update
  1063.             events['update'].forEach((callback) => callback(x, y));
  1064.  
  1065.             // handle timeout
  1066.             if (timeoutActive) {
  1067.                 // clear previous timeout if existing
  1068.                 if (timeout) window.clearTimeout(timeout);
  1069.                 timeout = window.setTimeout(() => {
  1070.                     // dispatch all binded functions on abort
  1071.                     events['abort'].forEach((callback) => callback());
  1072.                     state = "expired";
  1073.                     // clear directions
  1074.                     directions = [];
  1075.                     console.log("OK")
  1076.                 }, timeoutDuration * 1000);
  1077.             }
  1078.  
  1079.             let direction = getDirection(referencePoint.x, referencePoint.y, x, y);
  1080.  
  1081.             if (directions[directions.length - 1] !== direction) {
  1082.                 // add new direction to gesture list
  1083.                 directions.push(direction);
  1084.  
  1085.                 // send message to background on gesture change
  1086.                 let message = runtime.sendMessage({
  1087.                     // subject: "gestureChange",
  1088.                     subject: dragMark ? "dragChange" : "gestureChange",//MP
  1089.                     data: Object.assign(//MP
  1090.                         targetData, {
  1091.                             gesture: directions.join("")
  1092.                         })
  1093.                 });
  1094.                 // on response (also fires on no response) dispatch all binded functions with the directions array and the action as parameter
  1095.                 message.then((response) => {
  1096.                     let action = response ? response.action : null;
  1097.                     events['change'].forEach((callback) => callback(directions, action));
  1098.                 });
  1099.             }
  1100.  
  1101.             // set new reference point
  1102.             referencePoint.x = x;
  1103.             referencePoint.y = y;
  1104.         }
  1105.  
  1106.         //-->Indicates the gesture end and should be called to terminate the gesture
  1107.         function end(dragMark) {
  1108.             // dispatch all binded functions on end
  1109.             events['end'].forEach((callback) => callback(directions));
  1110.  
  1111.             // send directions and target data to background if directions is not empty
  1112.             if (directions.length) runtime.sendMessage({
  1113.                 // subject: "gestureEnd",
  1114.                 subject: dragMark ? "dragEnd" : "gestureEnd",
  1115.                 data: Object.assign(
  1116.                     targetData, {
  1117.                         gesture: directions.join("")
  1118.                     }
  1119.                 )
  1120.             });
  1121.  
  1122.             // reset gesture handler
  1123.             reset();
  1124.         }
  1125.  
  1126.         //-->Resets the handler to its initial state
  1127.         function reset() {
  1128.             // remove gesture detection listeners
  1129.             //window.removeEventListener('mousemove', handleMousemove, true);
  1130.             //window.removeEventListener('mouseup', handleMouseup, true);
  1131.             //window.removeEventListener('contextmenu', handleContextmenu, true);
  1132.             //window.removeEventListener('mouseout', handleMouseout, true);
  1133.             window.removeEventListener('dragstart', handleDragstart, true);
  1134.             window.removeEventListener('drag', handleDrag, true);//MP
  1135.             window.removeEventListener('dragend', handleDragend, true);//MP
  1136.  
  1137.             // reset gesture array, internal state and target data
  1138.             directions = [];
  1139.             state = "passive";
  1140.             targetData = {};
  1141.  
  1142.             if (timeout) {
  1143.                 window.clearTimeout(timeout);
  1144.                 timeout = null;
  1145.             }
  1146.         }
  1147.  
  1148.         //-->Handles iframe/background messages which will update the gesture
  1149.         function handleMessage(message, sender, sendResponse) {
  1150.  
  1151.             switch (message.subject) {
  1152.                 case "gestureFrameMousedown":
  1153.                     // init gesture
  1154.                     init(
  1155.                         Math.round(message.data.screenX / window.devicePixelRatio - window.mozInnerScreenX),
  1156.                         Math.round(message.data.screenY / window.devicePixelRatio - window.mozInnerScreenY)
  1157.                     );
  1158.                     // save target data
  1159.                     targetData = message.data;
  1160.                     break;
  1161.  
  1162.                 case "gestureFrameMousemove":
  1163.                     // calculate distance between the current point and the reference point
  1164.                     let distance = getDistance(referencePoint.x, referencePoint.y,
  1165.                                                Math.round(message.data.screenX / window.devicePixelRatio - window.mozInnerScreenX),
  1166.                                                Math.round(message.data.screenY / window.devicePixelRatio - window.mozInnerScreenY)
  1167.                                               );
  1168.                     // induce gesture
  1169.                     if (state === "pending" && distance > distanceThreshold)
  1170.                         start();
  1171.                     // update gesture && mousebutton fix: right click on frames is sometimes captured by both event listeners which leads to problems
  1172.                     else if (state === "active" && distance > distanceSensitivity && mouseButton !== 2) update(
  1173.                         Math.round(message.data.screenX / window.devicePixelRatio - window.mozInnerScreenX),
  1174.                         Math.round(message.data.screenY / window.devicePixelRatio - window.mozInnerScreenY)
  1175.                     );
  1176.                     break;
  1177.  
  1178.                 case "gestureFrameMouseup":
  1179.                     if (state === "active" || state === "expired") end();
  1180.                     else if (state === "pending") reset();
  1181.                     break;
  1182.             }
  1183.         }
  1184.  
  1185.         //-->Handles mousedown which will add the mousemove listener
  1186.         function handleMousedown(event) {
  1187.             // on mouse button and no supression key
  1188.             if (event.isTrusted && (event.buttons === mouseButton || event.buttons === dragButton) && (!suppressionKey || (suppressionKey in event && !event[suppressionKey]))) {//MP
  1189.                 // init gesture
  1190.                 init(event.clientX, event.clientY);
  1191.  
  1192.                 // save target to global variable if exisiting
  1193.                 if (typeof TARGET !== 'undefined') TARGET = event.target;
  1194.  
  1195.                 // get and save target data
  1196.                 targetData = getTargetData(event.target);
  1197.  
  1198.                 // prevent and middle click scroll
  1199.                 if (mouseButton === 4) event.preventDefault();
  1200.             }
  1201.         }
  1202.  
  1203.         //-->Handles mousemove which will either start the gesture or update it
  1204.         function handleMousemove(event) {
  1205.             if (event.isTrusted && event.buttons === mouseButton) {
  1206.                 // calculate distance between the current point and the reference point
  1207.                 let distance = getDistance(referencePoint.x, referencePoint.y, event.clientX, event.clientY);
  1208.  
  1209.                 // induce gesture
  1210.                 if (state === "pending" && distance > distanceThreshold)
  1211.                     start();
  1212.  
  1213.                 // update gesture
  1214.                 else if (state === "active" && distance > distanceSensitivity)
  1215.                     update(event.clientX, event.clientY);
  1216.  
  1217.                 // prevent text selection
  1218.                 if (mouseButton === 1) window.getSelection().removeAllRanges();
  1219.             }
  1220.         }
  1221.  
  1222.         //-->Handles context menu popup and removes all added listeners
  1223.         function handleContextmenu(event) {
  1224.             if (event.isTrusted && mouseButton === 2) {
  1225.                 if (state === "active" || state === "expired") {
  1226.                     // prevent context menu
  1227.                     event.preventDefault();
  1228.                     end();
  1229.                 }
  1230.                 // reset if state is pending
  1231.                 else if (state === "pending")
  1232.                     reset();
  1233.             }
  1234.         }
  1235.  
  1236.         //-->Handles mouseup and removes all added listeners
  1237.         function handleMouseup(event) {
  1238.             // only call on left and middle mouse click to terminate gesture
  1239.             if (event.isTrusted && ((event.button === 0 && mouseButton === 1) || (event.button === 1 && mouseButton === 4))) {
  1240.                 if (state === "active" || state === "expired")
  1241.                     end();
  1242.                 // reset if state is pending
  1243.                 else if (state === "pending")
  1244.                     reset();
  1245.             }
  1246.         }
  1247.  
  1248.         //-->Handles mouse out and removes all added listeners
  1249.         function handleMouseout(event) {
  1250.             // only call if cursor left the browser window
  1251.             if (event.isTrusted && event.relatedTarget === null) {
  1252.                 if (state === "active" || state === "expired")
  1253.                     end();
  1254.                 // reset if state is pending
  1255.                 else if (state === "pending")
  1256.                     reset();
  1257.             }
  1258.         }
  1259.  
  1260.         //-->Handles dragstart and prevents it if needed
  1261.         function handleDragstart(event) {
  1262.             // prevent drag if mouse button and no supression key is pressed
  1263.             if (event.isTrusted && event.buttons === mouseButton && (!suppressionKey || (suppressionKey in event && !event[suppressionKey])))
  1264.                 event.preventDefault();
  1265.         }
  1266.  
  1267.         //-->Handles drag  MP
  1268.         function handleDrag(event) {
  1269.             // prevent drag if mouse button and no supression key is pressed
  1270.             if (event.isTrusted && event.buttons === dragButton && (!suppressionKey || (suppressionKey in event && !event[suppressionKey]))){
  1271.                 let distance = getDistance(referencePoint.x, referencePoint.y, event.clientX, event.clientY);
  1272.  
  1273.                 // induce gesture
  1274.                 if (state === "pending" && distance > distanceThreshold)
  1275.                     start();
  1276.  
  1277.                 // update gesture
  1278.                 else if (state === "active" && distance > distanceSensitivity)
  1279.                     update(event.clientX, event.clientY, 'dragMark');
  1280.             }
  1281.         }
  1282.  
  1283.         //-->Handles dragsend MP
  1284.         function handleDragend(event) {
  1285.             if (event.isTrusted && ((event.button === 0 && mouseButton === 1) || (event.button === 1 && mouseButton === 4) || event.button === 0 && dragButton === 1)) {//MP
  1286.                 // if (event.isTrusted && ((event.button === 0 && gestureHandler.mouseButton === 1) || (event.button === 1 && gestureHandler.mouseButton === 4))) {
  1287.                 if (state === "active" || state === "expired")
  1288.                     end("dragMark");
  1289.                 // reset if state is pending
  1290.                 else if (state === "pending")
  1291.                     reset();
  1292.             }
  1293.         }
  1294.  
  1295.         //-->Handles mousedown for frames; send message with target data and position
  1296.         function handleFrameMousedown(event) {
  1297.             // on mouse button and no supression key
  1298.             if (event.isTrusted && event.buttons === mouseButton && (!suppressionKey || (suppressionKey in event && !event[suppressionKey]))) {
  1299.                 runtime.sendMessage({
  1300.                     subject: "gestureFrameMousedown",
  1301.                     data: Object.assign(
  1302.                         getTargetData(event.target), {
  1303.                             screenX: event.screenX,
  1304.                             screenY: event.screenY,
  1305.                         }
  1306.                     )
  1307.                 });
  1308.                 // save target to global variable if exisiting
  1309.                 if (typeof TARGET !== 'undefined') TARGET = event.target;
  1310.                 // prevent middle click scroll
  1311.                 if (mouseButton === 4) event.preventDefault();
  1312.             }
  1313.         }
  1314.  
  1315.         //-->Handles mousemove for frames; send message with position
  1316.         function handleFrameMousemove(event) {
  1317.             // on mouse button and no supression key
  1318.             if (event.isTrusted && event.buttons === mouseButton && (!suppressionKey || (suppressionKey in event && !event[suppressionKey]))) {
  1319.                 runtime.sendMessage({
  1320.                     subject: "gestureFrameMousemove",
  1321.                     data: {
  1322.                         screenX: event.screenX,
  1323.                         screenY: event.screenY
  1324.                     }
  1325.                 });
  1326.                 // prevent text selection
  1327.                 if (mouseButton === 1) window.getSelection().removeAllRanges();
  1328.             }
  1329.         }
  1330.  
  1331.         //--> Handles mouseup for frames
  1332.         function handleFrameMouseup(event) {
  1333.             // only call on left, right and middle mouse click to terminate or reset gesture
  1334.             if (event.isTrusted && ((event.button === 0 && mouseButton === 1) || (event.button === 1 && mouseButton === 4) || (event.button === 2 && mouseButton === 2)))
  1335.                 runtime.sendMessage({
  1336.                     subject: "gestureFrameMouseup",
  1337.                     data: {}
  1338.                 });
  1339.         }
  1340.  
  1341.         // due to modul pattern: http://www.adequatelygood.com/JavaScript-Module-Pattern-In-Depth.html
  1342.         return modul;
  1343.     })();
  1344.  
  1345.     //========⑤Setting===================
  1346.     const Ui = (function(){
  1347.         let modul = {};
  1348.         modul.init = function (){
  1349.             addStyle(CSS, 'MPmanageStyle');
  1350.  
  1351.             let node = document.createElement('div');
  1352.             node.id = 'MPsetting';
  1353.             node.innerHTML = menuHTML;
  1354.             document.body.appendChild(node);
  1355.  
  1356.             //#mg1
  1357.             q('#mg1')[0].innerHTML = gestureAndDragHTML;
  1358.             //#mg2
  1359.             q('#mg2')[0].innerHTML = makeFunsList();
  1360.             each(['gesture', 'text', 'link', 'image'],(item)=>{
  1361.                 q('#mg2')[0].innerHTML += makeDefinedFunsList(item);
  1362.             });
  1363.             //#mg3
  1364.             q('#mg3')[0].innerHTML = aboutHTML;
  1365.  
  1366.             //addEventListener
  1367.             listen(q('#MPsetting')[0], 'click', click);
  1368.             each(q('#mg1 input[type=text], #mg2 span[name="alias"]'),item=>{
  1369.                 listen(item, 'blur', updateConfigUi);
  1370.             });
  1371.             each(q('#MPsetting select, #MPsetting input[type=checkbox]'),item=>{
  1372.                 listen(item, 'change', updateConfigUi);
  1373.             });
  1374.             //show functions,hide others
  1375.             q('li[name=mg2]')[0].click();
  1376.         };
  1377.         
  1378.         modul.closesetting = function (){
  1379.             q('body')[0].removeChild(q('#MPsetting')[0]);
  1380.         };
  1381.         
  1382.         modul.captureGesture = function(gestureStr, operation){
  1383.             try {
  1384.                 if(operation === "recorddingGesture"){
  1385.                     q('#recorddingGesture')[0].textContent = gestureStr;
  1386.                     return;
  1387.                 }
  1388.                 if(operation !== "cancelGesture") q('[data-flag=captureGesture]')[0].value = gestureStr;
  1389.                 document.body.removeChild(q('#MPMask')[0]);
  1390.                 runtime.captureGesture = false;
  1391.                 attr(q('#MPsetting')[0], "style", " ");
  1392.                 let tmp = q('[data-flag=captureGesture]')[0];
  1393.                 attr(tmp, "data-flag", " ");
  1394.                 updateFns(tmp.parentElement);
  1395.             } catch(e) {
  1396.                 // console.log(e);
  1397.             }
  1398.         };
  1399.  
  1400.         let
  1401.         fnLocal = {
  1402.             arg: {
  1403.                 userDefine:{
  1404.                     description:{zh:['自定义功能代码'], en:['User Define Function Code']},
  1405.                     arg:['textarea']
  1406.                 },
  1407.                 searchText:{
  1408.                     description:{zh:['搜索引擎', '后台打开', '右边插入'], en:['SearchingEnging', 'Load In Background', 'Insert After Current Tab']},
  1409.                     arg:['select:searchEnging', 'checkbox', 'checkbox']
  1410.                 },
  1411.                 searchImg:{
  1412.                     description:{zh:['图片搜索引擎', '后台打开', '右边插入'], en:['Image SearchingEnging', 'Load In Background', 'Insert After Current Tab']},
  1413.                     arg:['select:imgSearchEnging', 'checkbox', 'checkbox']
  1414.                 },
  1415.                 fkVip:{
  1416.                     description:{zh:['视频解析接口'], en:['Videos Parser API']},
  1417.                     arg:['select:vipAPI']
  1418.                 }
  1419.             },
  1420.             FunsListTitle: {
  1421.                 gesture: {zh:'手势',     en:'Gesture'},
  1422.                 text:    {zh:'拖拽文本', en:'Drag Text'},
  1423.                 link:    {zh:'拖拽链接', en:'Drag Link'},
  1424.                 image:   {zh:'拖拽图片', en:'Drag Image'}
  1425.             },
  1426.             addFunction: {zh:'增加一个功能', en:'Add Function'}
  1427.         },
  1428.             CSS = `
  1429.         #MPsetting{z-index:999997!important;background:white!important;width:100%!important;height:100%!important;color:#032E58!important;font-family:"微软雅黑"!important;position:fixed!important;top:0!important;left:0!important;}
  1430.         #MPmenu *,
  1431.         .MPcontent *{border-radius:3px!important;font-size:16px!important;}
  1432.         #MPlogo svg{background:white!important;box-shadow:inset 0 0 25px 15px #A2B7D2!important;width:80px!important;height:100px!important;margin:0!important;padding:0!important;}
  1433.         #MPmenu{z-index:999999!important;height:100%!important;width:100px!important;background:#A2B7D2!important;color:white!important;text-align:center!important;}
  1434.         #MPmenu li{list-style-type:none!important;border-top:1px dashed white!important;margin:10px 15px!important;cursor:pointer;}
  1435.         .MPselected,#MPmenu li:hover{background:white!important;color:#A2B7D2!important;}
  1436.         #MPmenu li span{display:block!important;width:40px!important;height:40px!important;font-size:35px!important;font-weight:bold!important;padding:0 15px!important;}
  1437.         #MPmenu b{display:block!important;width:70px!important;text-align:center!important;margin-top:10px!important;}
  1438.         .MPcontent{height:94%!important;width:100%!important;overflow-y:scroll!important;position:absolute!important;left:100px!important;top:0!important;z-index:999998!important;padding:20px!important;}
  1439.         .MPcontent h1{display:block!important;width:800px!important;font-size:20px!important;float:left!important;top:0!important;left:90px!important;padding:3px 10px!important;margin:0 5px!important;border-left:5px solid #A2B7D2!important;background:#A2B7D259!important;}
  1440.         .MPcontent > li{list-style-type:none!important;width:800px!important;height:auto!important;padding:10px 5px 0px 5px!important;margin:5px 20px!important;float:left!important;border-bottom:1px dashed #00000020!important;}
  1441.         .MPcontent > li:hover{box-shadow:inset 1px 1px 1px 3px #A2B7D240!important;}
  1442.         #mg1 >li span:nth-child(2),#mg2>li>input{max-height:28px!important;float:right!important;}
  1443.         #mg1 input[type="text"],#mg1 select,#mg2 input[readonly="readonly"]{width:250px!important;height:26px!important;margin:0 10px!important;text-align:center!important;border:0!important;background:#0000000C!important;font-size:20px!important;}
  1444.         .MPcontent input[type="checkbox"]{width:0!important;}
  1445.         #FunsList{width:800px!important;border:0!important;overflow:hidden!important;}
  1446.         .FunsListHide{height: 34px!important;border: 0!important;margin: 0!important;padding: 0!important;}
  1447.         .FunsListShow{height:auto!important;}
  1448.         #FunsList>li{display:inline-block!important;width:300px!important;height:30px!important;margin:5px!important;text-align:left!important;}
  1449.         span.tag:before{color:white!important;background:#555555!important;margin:0!important;border:0!important;padding:3px!important;border-radius:4px 0 0 4px!important;font-size:14px!important;white-space:nowrap!important;font-weight:bold!important;}
  1450.         span.tag{color:white!important;margin:0!important;border:0!important;padding:1px 7px 3px 0!important;border-radius:4px!important;}
  1451.  
  1452.         #mg2 b{margin-left:30px;padding:0 20px;background:#00000000!important;}
  1453.         #mg2 div.fnArgument{<!--display:none;-->margin-left:0;margin-right:10px;padding-top:20px!important;height:auto;}<!--显示搜索引擎 去除空白-->
  1454.         #mg2 div.fnArgument textarea{width:100%;height:200px;}
  1455.         #mg2 div.fnArgument span{width:auto;height:auto;}
  1456.         #mg2 .yellow{background:#FFB400!important;}
  1457.         #mg2 .yellow:before{content:"${fnLocal.FunsListTitle.gesture[cfg.language]}";}
  1458.         #mg2 .blue:before{content:"${fnLocal.FunsListTitle.link[cfg.language]}";}
  1459.         #mg2 .blue{background:#1182C2!important;}
  1460.         #mg2 .green:before{content:"${fnLocal.FunsListTitle.text[cfg.language]}";}
  1461.         #mg2 .green{background:#4DC71F!important;}
  1462.         #mg2 .darkcyan:before{content:"${fnLocal.FunsListTitle.image[cfg.language]}";}
  1463.         #mg2 .darkcyan{background:#B10DC9!important;}
  1464.         #mg2 > li[data-type=gesture]>span:first-child{background:#FFB40030!important;color:#FFB400!important;}
  1465.         #mg2 > li[data-type=text]>span:first-child{background:#4DC71F30!important;color:#4DC71F!important;}
  1466.         #mg2 > li[data-type=link]>span:first-child{background:#1182C230!important;color:#1182C2!important;}
  1467.         #mg2 > li[data-type=image]>span:first-child{background:#B10DC930!important;color:#B10DC9!important;}
  1468.         #mg1 > li span:first-child,#mg2>li>span:first-child{text-align:left!important;font-size:16px!important;font-weight:bold!important;padding:2px 6px!important;width:auto!important;height:24px!important;float:left!important;border-left:5px solid!important;margin-right:20px!important;}
  1469.         #mg2>li>span{margin-bottom:10px!important;}
  1470.         #mg2>li>input {font-family: MParrow;}
  1471.  
  1472.         #mg2 div input[type=text],#mg2 div select{background:#0000000c;padding:5px;margin:10px 5px;border: 0;}
  1473.         #mg2 div input{width:80%;}
  1474.         #mg2 div select{width:15%;}
  1475.         #mg2 div label{margin-left:15px;margin-right:15px;}<!--margin:3px 0;-->
  1476.  
  1477.         #mg3 *{height: auto;font-size: 30px!important;text-decoration: none;font-weight: bolder;padding: 20px; color:#3A3B74!important}
  1478.  
  1479.         /*label 作为开关*/
  1480.         label.switchOn{background:#3A3B7420!important;display:inline-block!important;color:#3A3B74!important;font-weight:bolder!important;min-width:40px!important;height:24px!important;padding:2px 5px!important;border-left:15px solid #3A3B74!important;border-radius:5px!important;}
  1481.         label.switchOff{background:#33333370!important;display:inline-block!important;color:#333333a0!important;text-decoration:line-through!important;min-width:40px!important;height:24px!important;padding:2px 5px!important;border-right:15px solid #333333!important;border-radius:5px!important;}
  1482.         input[type=checkbox].switch{width:0px!important;}
  1483.  
  1484.         #MPMask{z-index:9999999;position:fixed;top:0;left:0;}
  1485.         #recorddingGesture{position: fixed;width: 100%;top: 100%;margin-top: -50%;text-align: center;color: white;font-size: 40px;font-family: MParrow;word-wrap:break-word;}
  1486.       `,
  1487.             uiLocal = {
  1488.                 //gesture
  1489.                 gestureUi: {zh:'手势配置', en:'Gesture Config'},
  1490.                 mouseButton: {zh:'手势按键', en:'Gesture mouse button'},
  1491.                 leftButton: {zh:'左键', en:'Left Key'},
  1492.                 middleButton: {zh:'中键', en:'MIddle Key'},
  1493.                 rightButton: {zh:'右键', en:'Right Key'},
  1494.                 mouseButtonTitle: {zh:'触发鼠标手势的按键', en:'The mouse button which will trigger the gesture.'},
  1495.  
  1496.                 suppressionKey: {zh:'手势禁用键', en:'Gesture suppression key'},
  1497.                 suppressionKeyTitle: {zh:'按下禁用键,暂时禁用手势', en:'Disables the mouse gesture if the key is pressed.'},
  1498.                 distanceThreshold: {zh:'手势距离阈值', en:'Gesture distance threshold'},
  1499.                 distanceThresholdTitle: {zh:'激活鼠标手势的最短距离', en:'The minimum mouse distance until the Gesture gets activated.'},
  1500.                 distanceSensitivity: {zh:'手势灵敏度', en:'Gesture sensitivity'},
  1501.                 distanceSensitivityTitle: {zh:'认定为新方向的最短距离。这也影响轨迹平滑度', en:'The minimum mouse distance until a new direction gets recognized. This will also impact the trace smoothness.'},
  1502.                 timeout: {zh:'手势超时', en:'Gesture timeout'},
  1503.                 timeoutTitle: {zh:'鼠标不动指定时间后，取消手势', en:'Cancels the gesture after the mouse has not been moved for the specified time.'},
  1504.                 directions: {zh:'手势方向数', en:'Gesture directions'},
  1505.                 directionsTitle: {zh:'手势识别的方向个数', en:'Gesture diffrent directions.'},
  1506.                 language: {zh:'语言', en:'Language'},
  1507.                 languageTitle: {zh:'设定使用语言', en:'Set the language for using.'},
  1508.                 //hint
  1509.                 hintUi: {zh:'提示配置', en:'Hint Config'},
  1510.                 background: {zh:'提示背景颜色', en:'Hint background'},
  1511.                 backgroundTitle: {zh:'提示的文字的背景颜色', en:'Hint text background color'},
  1512.                 fontSize: {zh:'提示字体', en:'Hint font size'},
  1513.                 fontSizeTitle: {zh:'提示文字的字体大小,单位:"&quot;px"&quot;', en:'Hint text font size,unit:"&quot;px"&quot;'},
  1514.                 lineColor: {zh:'轨迹颜色', en:'Track line color'},
  1515.                 lineColorTitle: {zh:'显示轨迹的颜色,十六进制,可以使3/6/8位', en:'track line color, hex, 3/6/8 bit'},
  1516.                 minLineWidth: {zh:'最小宽度', en:'Track minimum width'},
  1517.                 minLineWidthTitle: {zh:'轨迹的最小宽度,单位:&quot;px"&quot;', en:'Track minimum width,unit:&quot;px"&quot;'},
  1518.                 maxLineWidth: {zh:'最大宽度', en:'Track maximum width'},
  1519.                 maxLineWidthTitle: {zh:'轨迹的最大宽度,单位:&quot;px"&quot;', en:'Track maximum width,unit:&quot;px&quot;'},
  1520.                 lineGrowth: {zh:'增长速度', en:'Track growth speed'},
  1521.                 lineGrowthTitle: {zh:'轨迹的增长速度,单位:&quot;px&quot;', en:'Track growth speed,unit:&quot;px&quot;'},
  1522.                 funNotDefine: {zh:'未定义提示', en:'Gesture not found hint'},
  1523.                 funNotDefineTitle: {zh:'手势或者功能未定义时的提示信息', en:'If gesture not found, hint this'},
  1524.                 //drag
  1525.                 dragSetting: {zh:'拖拽配置', en:'Drag Config'},
  1526.                 linktextAslink: {zh:'链接优先', en:'Link priority'},
  1527.                 linktextAslinkTitle: {zh:'链接文字识别为链接', en:'Text link drag as link'},
  1528.                 dragInTextarea: {zh:'文本框拖拽', en:'Enable drag in textarea'},
  1529.                 dragInTextareaTitle: {zh:'文本框中选中文字并且拖拽时候,使用拖拽的功能', en:'Enable drag in textarea or input'}
  1530.             },
  1531.  
  1532.             menuHTML = `
  1533.         <div id="MPmenu">
  1534.           <span id="MPlogo">
  1535.             <svg width="80px" height="100px" viewbox="0 0 200 200">
  1536.             <path d="M135 13 l13 13h-7v20h20v-7l13 13l-13 13v-7h-20v20h7l-13 13 l-13 -13h7v-20h-20v7l-13-13l13-13v7h20v-20h-7z" style="fill:#0074d9;stroke:none;"></path>
  1537.             <path d="M0 190L20 10c3,-8 8,-4 10,0L100 130L160 80c8,-8 17,-8 20,0L200 180c-2 20 -24 20 -30 0L160 120L110 163c-6 6 -19 10 -25 0L30 40L10 195c-3 5 -8 5 -10 0z" style="stroke:none;fill:#0074d9;"></path>
  1538.             </svg>
  1539.           </span>
  1540.           <li name="mg1">   <span>◧</span>  <b>Config</b>  </li>
  1541.           <li name="mg2">   <span>↯</span>   <b>Gesture</b> </li>
  1542.           <li name="mg3">   <span>❓</span>  <b>About</b>   </li>
  1543.           <li name="close"> <span>?</span>  <b>Close</b>   </li>
  1544.         </div>
  1545.         <div id="mg1" class="MPcontent">mg1</div>
  1546.         <div id="mg2" class="MPcontent">mg2</div>
  1547.         <div id="mg3" class="MPcontent">mg3</div>
  1548.       `,
  1549.             gestureAndDragHTML =
  1550.             //======gestureAndDragHTML======
  1551.             `
  1552.   <h1>${uiLocal.gestureUi[cfg.language]}</h1>
  1553.   <!-- 因为启用了左键作为拖拽,所以按钮选项要禁用
  1554.   <li>
  1555.     <span title="${uiLocal.mouseButtonTitle[cfg.language]}">${uiLocal.mouseButton[cfg.language]}</span>
  1556.     <span>
  1557.      <select name="mouseButton">
  1558.       <option value="0" ${sel(cfg.Gesture.mouseButton, 0)}>${uiLocal.leftButton[cfg.language]}</option>
  1559.       <option value="1" ${sel(cfg.Gesture.mouseButton, 1)}>${uiLocal.middleButton[cfg.language]}</option>
  1560.       <option value="2" ${sel(cfg.Gesture.mouseButton, 2)}>${uiLocal.rightButton[cfg.language]}</option>
  1561.      </select>
  1562.     </span>
  1563.   </li>
  1564.   -->
  1565.   <li>
  1566.     <span title="${uiLocal.suppressionKeyTitle[cfg.language]}">${uiLocal.suppressionKey[cfg.language]}</span>
  1567.     <span>
  1568.      <select name="suppressionKey">
  1569.       <option value="" ${sel(cfg.Gesture.suppressionKey, '')}>&nbsp;</option>
  1570.       <option value="altKey" ${sel(cfg.Gesture.suppressionKey, 'altKey')}>Alt</option>
  1571.       <option value="ctrlKey" ${sel(cfg.Gesture.suppressionKey, 'ctrlKey')}>Ctrl</option>
  1572.       <option value="shiftKey" ${sel(cfg.Gesture.suppressionKey, 'shiftKey')}>Shift</option>
  1573.      </select>
  1574.      </span>
  1575.   </li>
  1576.   <li>
  1577.     <span title="${uiLocal.distanceThresholdTitle[cfg.language]}">${uiLocal.distanceThreshold[cfg.language]}</span>
  1578.     <span>
  1579.       <input type="text" name="distanceThreshold" value="${cfg.Gesture.distanceThreshold}" data-mark="number">
  1580.       </span>
  1581.     </li>
  1582.   <li>
  1583.     <span title="${uiLocal.distanceSensitivityTitle[cfg.language]}">${uiLocal.distanceSensitivity[cfg.language]}</span>
  1584.     <span>
  1585.       <input type="text" name="distanceSensitivity" value="${cfg.Gesture.distanceSensitivity}"  data-mark="number">
  1586.     </span>
  1587.   </li>
  1588.   <li>
  1589.     <span title="${uiLocal.timeoutTitle[cfg.language]}">${uiLocal.timeout[cfg.language]}</span>
  1590.     <span>
  1591.       <input type="text" name="timeout" value="${cfg.Gesture.Timeout.duration}" data-mark="number">
  1592.     </span>
  1593.   </li>
  1594.   <li>
  1595.     <span title="${uiLocal.directionsTitle[cfg.language]}">${uiLocal.directions[cfg.language]}</span>
  1596.     <span>
  1597.       <select name="directions">
  1598.        <option value="4" ${sel(cfg.directions, 4)}> 4 </option>
  1599.        <option value="8" ${sel(cfg.directions, 8)}> 8 </option>
  1600.       </select>
  1601.     </span>
  1602.   </li>
  1603.   <li>
  1604.     <span title="${uiLocal.languageTitle[cfg.language]}">${uiLocal.language[cfg.language]}</span>
  1605.     <span>
  1606.      <select name="language">
  1607.       <option value="zh" ${sel(cfg.language, 'zh')}>中文</option>
  1608.       <option value="en" ${sel(cfg.language, 'en')}>English</option>
  1609.      </select>
  1610.     </span>
  1611.   </li>
  1612.   <h1>${uiLocal.hintUi[cfg.language]}</h1>
  1613.   <li>
  1614.     <span title="${uiLocal.backgroundTitle[cfg.language]}">${uiLocal.background[cfg.language]}</span>
  1615.     <span>
  1616.       <input type="text" name="background" value="${cfg.Hinter.background}" style="background:#${cfg.Hinter.background} !important;">
  1617.     </span>
  1618.   </li>
  1619.   <li>
  1620.     <span title="${uiLocal.fontSizeTitle[cfg.language]}">${uiLocal.fontSize[cfg.language]}</span>
  1621.     <span>
  1622.       <input type="text" name="fontSize" value="${cfg.Hinter.fontSize}" data-mark="number">
  1623.     </span>
  1624.   </li>
  1625.   <li>
  1626.     <span title="${uiLocal.lineColorTitle[cfg.language]}">${uiLocal.lineColor[cfg.language]}</span>
  1627.     <span>
  1628.       <input type="text" name="lineColor" value="${cfg.Hinter.lineColor}" style="background:#${cfg.Hinter.lineColor} !important;">
  1629.     </span>
  1630.   </li>
  1631.   <li>
  1632.     <span title="${uiLocal.minLineWidthTitle[cfg.language]}">${uiLocal.minLineWidth[cfg.language]}</span>
  1633.     <span>
  1634.       <input type="text" name="minLineWidth" value="${cfg.Hinter.minLineWidth}">
  1635.     </span>
  1636.   </li>
  1637.   <li>
  1638.     <span title="${uiLocal.maxLineWidthTitle[cfg.language]}">${uiLocal.maxLineWidth[cfg.language]}</span>
  1639.     <span>
  1640.       <input type="text" name="maxLineWidth" value="${cfg.Hinter.maxLineWidth}">
  1641.     </span>
  1642.   </li>
  1643.   <li>
  1644.     <span title="${uiLocal.lineGrowthTitle[cfg.language]}">${uiLocal.lineGrowth[cfg.language]}</span>
  1645.     <span>
  1646.       <input type="text" name="lineGrowth" value="${cfg.Hinter.lineGrowth}">
  1647.     </span>
  1648.   </li>
  1649.   <li>
  1650.     <span title="${uiLocal.funNotDefineTitle[cfg.language]}">${uiLocal.funNotDefine[cfg.language]}</span>
  1651.     <span>
  1652.       <input type="text" name="funNotDefine" value="${cfg.Hinter.funNotDefine}">
  1653.     </span>
  1654.   </li>
  1655.  
  1656.   <h1>${uiLocal.dragSetting[cfg.language]}</h1>
  1657.   <li>
  1658.     <span title="${uiLocal.linktextAslinkTitle[cfg.language]}">${uiLocal.linktextAslink[cfg.language]}</span>
  1659.     <span>
  1660.       <input type="checkbox" id="linktextAslink" name="linktextAslink" checked="" class="switch">
  1661.       <label for="linktextAslink" class="switchOn"></label>
  1662.     </span>
  1663.   </li>
  1664.   <!--  使用抑制键代替
  1665.   <li>
  1666.     <span title="${uiLocal.dragInTextareaTitle[cfg.language]}">${uiLocal.dragInTextarea[cfg.language]}</span>
  1667.     <span>
  1668.       <input type="checkbox" id="dragInTextarea" name="dragInTextarea" checked="" class="switch">
  1669.       <label for="dragInTextarea" class="switchOn"></label>
  1670.     </span>
  1671.   </li>
  1672.   -->
  1673.       `,
  1674.  
  1675.             //=======gestureAndDragHTML End=========
  1676.             aboutHTML = `
  1677.         <pre style="font-size:1.2em !important;">
  1678.         About userDefine function:
  1679.         there are one argument(Object:mpData) provided in userDefine function.
  1680.         mpData is a object like this:
  1681.         {
  1682.           gesture:"646",         //gesture code of last mouse gesure
  1683.           link:{                 //optional, the target is link/image link...
  1684.             href: "https://www.baidu.com/",
  1685.             title: null, textContent: ""
  1686.           }
  1687.           target:{
  1688.             src: "https://www.baidu.com/img/baidu_jgylogo3.gif",   //target element arrtibute: src
  1689.             title: "到百度首页",  //target element arrtibute: title
  1690.             alt: "到百度首页",    //target element arrtibute: alt
  1691.             textContent: "",      //target element's text content
  1692.             nodeName: "IMG",      //target element's node name
  1693.             self:{}               //target element itself
  1694.           }
  1695.           textSelection:""
  1696.         }
  1697.         So, code in textarea shuold be <em>function body.</em>
  1698.         And, you can add some not frequently used function as "userDefine" function to MP™
  1699.         </pre>
  1700.         <a href="https://github.com/woolition/greasyforks/blob/master/mouseGesture/HY-MouseGesture.md" >(●￣(ｴ)￣●)づ <br>Click Me to More(点我看更多介绍)! </a>
  1701.         `,
  1702.             options = {
  1703.                 imgSearchEnging: {// image searching
  1704.                     默认:    "mull",
  1705.                     Baidu:   "https://graph.baidu.com/details?isfromtusoupc=1&tn=pc&carousel=0&promotion_name=pc_image_shituindex&extUiData%5bisLogoShow%5d=1&image=U-R-L",
  1706.                     Google:  "https://www.google.com/searchbyimage?image_url=U-R-L",
  1707.                     TinEye:  "https://www.tineye.com/search?url=U-R-L",
  1708.                     Yandex:  "https://yandex.com/images/search?rpt=imageview&url=U-R-L"
  1709.                 },
  1710.                 searchEnging: {// text searching
  1711.                     默认:    "null",
  1712.                     Baidu:   "https://www.baidu.com/s?wd=",
  1713.                     Google:  "https://www.google.com/search?q=",
  1714.                     Bing:    "https://www.bing.com/search?q=",
  1715.                     Yahoo:   "https://search.yahoo.com/search?p=",
  1716.                     Wiki:    "https://en.wikipedia.org/w/index.php?search=",
  1717.                     Taobao:  "https://s.taobao.com/search?q=",
  1718.                     Amazon:  "https://www.amazon.com/s/&field-keywords=",
  1719.                     Sogou:   "https://www.sogou.com/web?query=",
  1720.                     s360:    "https://www.haosou.com/s?q="
  1721.                 },
  1722.                 vipAPI:{
  1723.                     疯狂:    "http://goudidiao.com/?url=",
  1724.                     噗噗:    "http://pupudy.com/play?make=url&id="
  1725.                 }
  1726.             };
  1727.  
  1728.  
  1729.         function q(cssSelector){
  1730.             return document.querySelectorAll(cssSelector);
  1731.         }
  1732.         function attr(element,attributeName, attributeValue){
  1733.             try {
  1734.                 if(attributeValue) element.setAttribute(attributeName, attributeValue);
  1735.                 else return element.getAttribute(attributeName);
  1736.             } catch(e) {}
  1737.         }
  1738.         function each(elementCollect,func){
  1739.             try{
  1740.                 Array.prototype.forEach.call(elementCollect, (item)=>{func(item);});
  1741.             }catch(e){}
  1742.         }
  1743.         function listen(element, eventType, func){
  1744.             element.addEventListener(eventType, func, false);
  1745.         }
  1746.         function sel(val1, val2){
  1747.             return val1 == val2 ? 'selected="selected"' : '';
  1748.         }
  1749.         function click(evt){
  1750.             function getName(evt){
  1751.                 if(evt.target.getAttribute('name')){
  1752.                     return evt.target.getAttribute('name');
  1753.                 }else {
  1754.                     if(evt.target.parentElement.getAttribute('name'))
  1755.                         return evt.target.parentElement.getAttribute('name');
  1756.                     else
  1757.                         return evt.target.parentElement.parentElement.getAttribute('name');
  1758.                 }
  1759.             }
  1760.             let named = getName(evt);
  1761.             switch (named) {
  1762.                 case 'mg1':
  1763.                 case 'mg2':
  1764.                 case 'mg3':
  1765.                     each(q('.MPcontent'),(item)=>{
  1766.                         attr(item, 'style', 'display:none;');
  1767.                     });
  1768.                     attr(q('#'+named)[0], 'style', 'display:block;');
  1769.                     each(q('#MPmenu li'),item=>{
  1770.                         attr(item, 'class', ' ');
  1771.                     });
  1772.                     attr(q('[name='+named+']')[0], 'class', 'MPselected');
  1773.                     break;
  1774.                 case 'close':
  1775.                     q('body')[0].removeChild(q('#MPsetting')[0]);
  1776.                     break;
  1777.                 case 'addFunction':
  1778.                     toggleFunsList();
  1779.                     break;
  1780.                 case 'addFunctionLi':
  1781.                     clickToMakeEle();
  1782.                     break;
  1783.                 case 'alias':
  1784.                     attr(evt.target, 'contentEditable', "true");
  1785.                     break;
  1786.                 case 'toggleArgument':
  1787.  
  1788.                     if(evt.target.textContent === "▲"){
  1789.                         evt.target.textContent = "▼";
  1790.                         try{attr(evt.target.parentElement.lastChild,"style","display:none;");}
  1791.                         catch(e){}
  1792.                     }else {
  1793.                         evt.target.textContent = "▲";
  1794.                         try{attr(evt.target.parentElement.lastChild,"style","display:block;");}
  1795.                         catch(e){}
  1796.                     }
  1797.                     break;
  1798.                 case 'clearGesture':
  1799.                 case 'cancelGesture':
  1800.                     modul.captureGesture("", named);
  1801.                     break;
  1802.                 default:
  1803.                     if(cfg.hasOwnProperty(attr(evt.target, 'data-mark')))
  1804.                         addMask();
  1805.                     break;
  1806.             }
  1807.         }
  1808.         function arg2html(argument, type, trk){
  1809.             let html ="",
  1810.                 argu, i,rand, trackTxt, name,
  1811.                 argValue = [],
  1812.                 agrDetail = [],
  1813.                 description,
  1814.                 selectName;
  1815.             if(typeof argument === "object")
  1816.                 argu = argument;
  1817.             else
  1818.                 argu = JSON.parse(argument);
  1819.             trackTxt = trk || '';
  1820.             name = argu.name;
  1821.  
  1822.             html += `<span>${name}</span><span name="alias">${argu.alias ? argu.alias : local[type][name][cfg.language]}</span><b style="visibility:${argu.arg.length ? "visible" : "hidden"};" name="toggleArgument">▲</b><input type="text" name="${name}" value="${trackTxt}" data-mark="${type}" readonly="readonly"><br/><div class="fnArgument">`;
  1823.             if(argu.arg.length > 0){
  1824.                 argValue = trackTxt ? argu.arg : [];
  1825.                 agrDetail = fnLocal.arg[name].arg;
  1826.                 description = fnLocal.arg[name].description[cfg.language];
  1827.  
  1828.                 for(i in agrDetail){
  1829.                     rand = Math.floor(Math.random()*1000);
  1830.                     switch (agrDetail[i].slice(0,5)) {
  1831.                         case 'texta':
  1832.                             html += `<span><textarea>${mpUnescape(argValue[i])}</textarea><i></i></span>`;
  1833.                             break;
  1834.                         case 'input':
  1835.                             html += '<span><input type="text"><i></i></span>';
  1836.                             break;
  1837.                         case 'check':
  1838.                             html += `<span><input type="checkbox" id="${name + rand}" value=${argValue[i] || false} ${argValue[i] ? "checked" : ''} class="switch" name="fnCheckbox"><label for="${name + rand}" ${argValue[i] ? 'class="switchOn"' : 'class="switchOff"'}>${description[i]}</label></span>`;
  1839.                             break;
  1840.                         case 'selec':
  1841.                             selectName = agrDetail[i].split(':').pop();
  1842.                             html += `<span><input type="text" value=${argValue[i] || ''}><select name="fnSelect">`;
  1843.                             for (let k in options[selectName]){
  1844.                                 html += `<option value=${options[selectName][k]}>${k}</option>`;
  1845.                             }
  1846.                             html += '</select></span>';
  1847.                             break;
  1848.                         default:
  1849.                             html = `<span style="visibility:hidden;"></span>`;
  1850.                             break;
  1851.                     }
  1852.                 }
  1853.             }
  1854.             return html + "</div>";
  1855.         }
  1856.         function makeFunsList(){
  1857.             let color = ['yellow', 'green', 'blue', 'darkcyan'],
  1858.                 html = '',
  1859.                 arg = null;
  1860.             each(['gesture', 'text', 'link', 'image'], (type)=>{
  1861.                 each(Object.keys(local[type]), (fnName)=>{
  1862.                     if(fnLocal.arg.hasOwnProperty(fnName))
  1863.                         arg = Object.assign({name:fnName},fnLocal.arg[fnName]);
  1864.                     else
  1865.                         arg = {name:fnName,arg:[]};
  1866.                     html += `<li  data-type="${type}" data-arg='${JSON.stringify(arg)}' title="${local[type][fnName][cfg.language]}" name="addFunctionLi">
  1867.                       <span class="tag ${color[['gesture', 'text', 'link', 'image'].indexOf(type)]}">
  1868.                         <!--<span>${fnLocal.FunsListTitle[type][cfg.language]}</span>-->
  1869.                         <!--<span>-->${fnName}<!--</span>-->
  1870.                       </span>
  1871.                     </li>`;
  1872.                 });
  1873.             });
  1874.             html = `<fieldset id="FunsList" class="FunsListHide">
  1875.                 <h1 name="addFunction">${fnLocal.addFunction[cfg.language]} ➕ </h1><br/>
  1876.                 ${html}
  1877.               </fieldset>`;
  1878.             return html;
  1879.         }
  1880.         function makeDefinedFunsList(type){
  1881.             let html ='';
  1882.             each(Object.keys(cfg[type]), item=>{
  1883.                 try {
  1884.                     html += `<li data-arg='${JSON.stringify(cfg[type][item])}' data-type='${type}'>${arg2html(cfg[type][item], type, item)}`;
  1885.                 } catch(e) {}
  1886.             });
  1887.             return html;
  1888.         }
  1889.         function clickToMakeEle(){
  1890.             let tarEle = event.target.tagName === 'LI' ? event.target : (event.target.parentNode.tagName === "LI" ? event.target.parentNode : event.target.parentNode.parentNode);
  1891.             let ele = document.createElement('li');
  1892.             ele.setAttribute('data-arg', tarEle.dataset.arg);
  1893.             ele.setAttribute('data-type', tarEle.dataset.type);
  1894.             ele.innerHTML = arg2html(tarEle.dataset.arg, tarEle.dataset.type);
  1895.             document.getElementById('mg2').insertBefore(ele, document.querySelector(`#mg2>li`));
  1896.             listen(ele.childNodes[2].childNodes[0], 'blur', updateConfigUi);
  1897.             //函数列表收缩, 回滚到顶部
  1898.             toggleFunsList();
  1899.             document.documentElement.scrollTo(0, 0);
  1900.         }
  1901.         function updateFns(ele){
  1902.             // check Conflict
  1903.             if(Object.keys(cfg[ele.dataset.type]).indexOf(ele.childNodes[3].value) > -1){
  1904.                 if(JSON.parse(ele.dataset.arg).name !== cfg[ele.dataset.type][ele.childNodes[3].value].name){
  1905.                     attr(ele, "style", "background:red!important;");
  1906.                     alert("Gesture Conflict (手势冲突) !!!");
  1907.                     return;
  1908.                 }
  1909.             }
  1910.             // setting gesture not null
  1911.             if(JSON.parse(ele.dataset.arg).name === "setting" && !ele.childNodes[3].value){
  1912.                 attr(ele, "style", "background:red!important;");
  1913.                 alert("Setting Gesture Cannot Set Null (设置手势不能为空) !!!");
  1914.                 return;
  1915.             }
  1916.             attr(ele, "style", " ");
  1917.  
  1918.             let typeObject = {};
  1919.             each(q(`#mg2>li[data-type=${ele.dataset.type}]`), element=>updateItem(element));
  1920.             function updateItem(item){
  1921.                 let childrens, trk, argValue=[], name, dataArgObject, alias, argumentNodes;
  1922.                 trk = item.childNodes[3].value;
  1923.                 alias = item.childNodes[1].textContent;
  1924.                 //if mouse track is not empty , update Fns
  1925.                 if(trk !== ''){
  1926.                     childrens = item.childNodes[5].childNodes;
  1927.                     dataArgObject = JSON.parse(item.dataset.arg);
  1928.                     each(childrens, item=>{
  1929.                         if(item.firstElementChild.value && item.firstElementChild.value !== "undefined"){
  1930.                             // console.log(item.firstElementChild.nodeName);
  1931.                             // console.log('updateItem..');
  1932.                             if(item.firstElementChild.nodeName === "TEXTAREA")
  1933.                                 argValue.push(mpEscape(item.firstElementChild.value));
  1934.                             else
  1935.                                 argValue.push(item.firstElementChild.value);
  1936.                         } else{
  1937.                             argValue.push(' ');
  1938.                         }
  1939.                     });
  1940.                     typeObject[trk] = {name: dataArgObject.name, arg: argValue, alias:alias};
  1941.                 }
  1942.             }
  1943.             // console.log(typeObject);
  1944.             cfg[ele.dataset.type] = typeObject;
  1945.             storage.set('cfg', cfg);
  1946.         }
  1947.         function updateConfigUi(e){
  1948.             let name = attr(e.target, 'name');
  1949.             switch (name) {
  1950.                 case 'mouseButton':
  1951.                 case 'suppressionKey':
  1952.                     cfg.Gesture[name] = e.target.value;
  1953.                     break;
  1954.                 case 'distanceThreshold':
  1955.                 case 'distanceSensitivity':
  1956.                 case 'timeout':
  1957.                     cfg.Gesture[name] = parseInt(e.target.value);
  1958.                     break;
  1959.                 case 'directions':
  1960.                 case 'language':
  1961.                     cfg[name] = e.target.value;
  1962.                     break;
  1963.                 case 'background':
  1964.                 case 'lineColor':
  1965.                     cfg.Hinter[name] = e.target.value;
  1966.                     attr(e.target, 'style', `background: #${e.target.value} !important;`);
  1967.                     break;
  1968.                 case 'fontSize':
  1969.                 case 'minLineWidth':
  1970.                 case 'maxLineWidth':
  1971.                 case 'lineGrowth':
  1972.                     cfg.Hinter[name] = parseFloat(parseFloat(e.target.value).toFixed(2));
  1973.                     break;
  1974.                 case 'funNotDefine':
  1975.                     cfg.Hinter[name] = e.target.value;
  1976.                     break;
  1977.                 case 'linktextAslink':
  1978.                 case 'dragInTextarea':
  1979.                     cfg.Drag[name] = e.target.checked;
  1980.                     onOff(e, e.target.checked);
  1981.                     break;
  1982.                 default:
  1983.                     if(name === "alias")
  1984.                         updateFns(e.target.parentElement);
  1985.                     else if(name === "fnCheckbox" || name==="fnSelect"){
  1986.                         formChange();
  1987.                     }
  1988.                     return;
  1989.             }
  1990.             storage.set('cfg', cfg);
  1991.         }
  1992.         function formChange(){
  1993.             if(event.target.type === 'checkbox'){
  1994.                 event.target.value = event.target.checked;
  1995.                 onOff(event, event.target.checked);
  1996.                 updateFns(event.target.parentElement.parentElement.parentElement);
  1997.             }
  1998.             if(event.target.tagName === 'SELECT'){
  1999.                 event.target.previousElementSibling.value = event.target.value;
  2000.                 updateFns(event.target.parentElement.parentElement.parentElement);
  2001.             }
  2002.         }
  2003.         function onOff(e, check) {
  2004.             if (check) {
  2005.                 attr(e.target.nextElementSibling, 'class', 'switchOn');
  2006.             } else {
  2007.                 attr(e.target.nextElementSibling, 'class', 'switchOff');
  2008.             }
  2009.         }
  2010.         function addMask(){
  2011.             let
  2012.             w=window.innerWidth,
  2013.                 h=window.innerHeight,
  2014.                 px = 0.1*w,
  2015.                 string=`
  2016.         <svg height="${h}" width="${w}" style="background:#00000080">
  2017.         <path  id="record" d="
  2018.       M${50},     ${50+px}   v-${px}  h${px}
  2019.       M${w-px-50},${50}      h${px}   v${px}
  2020.       M${w-50},   ${h-px-50} v${px}   h-${px}
  2021.       M${50+px},  ${h-50}    h-${px}  v-${px}"
  2022.       style="stroke:#fff;stroke-width:${w/50};fill:none;"></path>
  2023.       <text name="clearGesture" x="100" y="${h-100}" style="font-size:${Math.floor(w/20)}px;stroke:none;fill:white;cursor:pointer;">Clear</text>
  2024.       <text name="A" x="${w-w/2}" y="${h-h/2}" style="font-size:${Math.floor(w/20)}px;stroke:none;fill:white;cursor:pointer;">A</text>
  2025.       <text name="cancelGesture" x="${w-100-w/6}" y="${h-100}" style="font-size:${Math.floor(w/20)}px;stroke:none;fill:white;cursor:pointer;">Cancle</text>
  2026.       </svg>`;
  2027.             let mask = document.createElement('div');
  2028.             mask.id = "MPMask";
  2029.             mask.innerHTML = string + '<div id="recorddingGesture"></div>';
  2030.             document.body.appendChild(mask);
  2031.             each(q('text[name=clearGesture], text[name=cancelGesture]'), item=>listen(item,"click",click));
  2032.  
  2033.             attr(q('#MPsetting')[0], "style", "z-index:9999998 !important;");
  2034.             attr(event.target, "data-flag", "captureGesture");
  2035.             runtime.captureGesture = true;
  2036.         }
  2037.         function toggleFunsList(){
  2038.             let a = q('#FunsList')[0];
  2039.             if(attr(a, 'class') === "FunsListHide"){
  2040.                 attr(a, 'class', 'FunsListShow');
  2041.             }else{
  2042.                 attr(a, 'class', 'FunsListHide');
  2043.             }
  2044.         }
  2045.  
  2046.  
  2047.         return modul;
  2048.     })();
  2049.  
  2050.     //========⑥Run===================
  2051.  
  2052.     //this addStyle is better than GM_addStyle,but not working in CSP tabs
  2053.     // function addStyle(cssStr,id='MPStyle'){
  2054.     //   try {
  2055.     //     let node = document.createElement('style');
  2056.     //     node.id = id;
  2057.     //     node.textContent = cssStr;
  2058.     //     document.querySelector(':root').appendChild(node);
  2059.     //   } catch(e){}
  2060.     // }
  2061.     function addStyle(cssStr,id='MPStyle'){
  2062.         GM_addStyle(cssStr);
  2063.     }
  2064.     addStyle(`
  2065.     @font-face {
  2066.     font-family: 'MParrow';
  2067.     src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAQdAAoAAAAABPAAAQAAAAAAAAAAAAAAAAAAAAAECAAAABVPUy8yAAABYAAAAEQAAABgUc1dNGNtYXAAAAHEAAAARgAAAGAAcgFDZ2x5ZgAAAiAAAADwAAABNKukdSxoZWFkAAAA9AAAADQAAAA2DKcEFmhoZWEAAAEoAAAAHQAAACQEKQIaaG10eAAAAaQAAAAfAAAAJBGtAZVsb2NhAAACDAAAABQAAAAUATIBfm1heHAAAAFIAAAAFQAAACAACwAKbmFtZQAAAxAAAADnAAABe0DXvWtwb3N0AAAD+AAAABAAAAAgAAMAAXjaY2BkYGAA4gfLE97F89t8ZeBkYgCBq07amiD6mu+MRAaB/3cZXzFuAnI5GMDSAEgbC5142mNgZGBgYgACPSApwCDA+IqBkQEVcAIAGeEBSQAAAHjaY2BkYGDgBEIQzQAlkQAAAjsAFgAAAHjaY2Bm/MY4gYGVgYPRhzGNgYHBHUp/ZZBkaGFgYGJg5WSAAUYGJBCQ5poCpAwZLBkf/H/AoMeEpIaRAcpjAAAVNgmoeNpjYmBgYPzCYAbE3lBagImBQQzM/srgA6IBjAwITgB42i2KywmAQBQD57l+e9gCvAoieLd/7ShmnwZCmDBA4WslaLlMkdyzekdv0LFzSuaNQ9Kj+/ebUfNf0iv2YfA7Mb+pBQmvAAAAAAAAABQAJgA6AEwAXgByAIYAmnjaVY8hT8NAGIa/N0tzLJlgbY4LYmI0zekvTTmBuHomcGT9DXMkpD8Bwd+AhIo1wa8CVYfF4DCgm8wV7m6Gqc+8eZ7nI9AlRejwSCdERvAkYqHEQxljarv6zWIau0sEuv79xAtewy4tjJLpPH2q2rZqvtH3GAc6YiWaswlroQfPKLsaVzYe93ZXu90pneML94ElWRuWS/nhILO7qt2uG/K+M7f5OWxQsBJcLAtc9P04YLHeOu2xL1McJayMAtlx74W34YngW7n25tCe5VLoIp/nuAnxzz4eMwrO/zzDScZGG2xK393V74G7q/8AczlNtXjadY7BasJAEIb/mKgVSumh3ucBoiQetHjpod6K4MlLi7CROSzEBDaB0EfoC/hEvoLv0990G0Rwhtn99p9/hwHwiCMCXCLAsD0v0eP94DnEuNMjjDruY8rOHw/ofqcziEZUnvDhuccfn55D+v/1CC8d9/GFb88DPOO83hjnykbetuoqWxaSTpPkmmWlez1k6mQeyyxJF7HYwtbW5OI0V1OpHzHBGhsYOGaJBrJ7/TlhiS2USgVLtYAg5WoJ854uWLGzZx2QtR7BHDHPGbspFi1b/rGoWQY5347OnGU4UW82mfwCMzM4HQB42mNgZkAGjAxoAAAAjgAFSExQRAEARkMJAAAAUGF3J1oAAAAA) format('woff');
  2068.     }
  2069.     #MPcanvas{position:fixed;top:0;left:0;z-index:10000000;}
  2070.     #MPtips{all:initial!important;position:fixed!important;z-index:9999996!important;top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;font-family:MParrow,"Arial",sans-serif!important;color:white!important;white-space:nowrap!important;line-height:normal!important;text-shadow:1px 1px 5px rgba(0,0,0,0.8)!important;text-align:center!important;padding:25px 20px 20px 20px!important;border-radius:5px!important;font-weight:bold!important; }
  2071.   `);
  2072.     //===========update any time=========
  2073.     GM_addValueChangeListener('cfg', ()=>{
  2074.         GestureHandler.applySettings(cfg);
  2075.         Hinter.applySettings(cfg);
  2076.     });
  2077.     //when close a tab, save it's url, in order to reopen it: reopenTab
  2078.     window.addEventListener('unload', function() {
  2079.         //GM_setValue('latestTab', window.location.href);
  2080.     }, false);
  2081.     //used in func: closeOtherTabs
  2082.     if(!GM_getValue('closeAll','')) GM_setValue('closeAll', Date());
  2083.     GM_addValueChangeListener('closeAll',function(name, old_value, new_value, remote){if(remote)window.close();});
  2084.     //===========update any time end=========
  2085.  
  2086.     GestureHandler.applySettings(cfg);
  2087.     Hinter.applySettings(cfg);
  2088.     GestureHandler.enable();
  2089.     Hinter.enable();
  2090.  
  2091.     //========Remind===================
  2092.     var timercon;
  2093.     function showclipboard(text) {
  2094.         server.containerDestroy();// 销毁内容面板
  2095.         // 新建内容面板
  2096.         var container = server.container();
  2097.         container.style.top = 0 + 'px';
  2098.         //if (ev.pageX + 350 <= document.body.clientWidth)// container 面板css最大宽度为250px
  2099.         container.style.right = 0 + 'px';
  2100.         //container.style.position = 'absolute';
  2101.         container.style.position = 'fixed';
  2102.         //else
  2103.         //container.style.left = document.body.clientWidth - 350 + 'px';
  2104.         document.body.appendChild(container);
  2105.         server.rendered.push(container);
  2106.  
  2107.         displaycontainer(text, container);
  2108.  
  2109.         clearTimeout(timercon);
  2110.         timercon = window.setTimeout(function(){ container.style.display = "none";}, 6000);
  2111.     }
  2112.  
  2113.  
  2114.     let ev = null;
  2115.     document.addEventListener('mouseclick', function (e) {
  2116.         ev = e;//划词鼠标结束位置
  2117.     });
  2118.  
  2119.  
  2120.     function displaycontainer(text, element) {
  2121.         element.innerHTML = text;
  2122.         element.style.display = 'block';// 显示结果
  2123.         //trans = text;
  2124.         //任何结果复制到剪切板
  2125.         //GM_setClipboard(text);
  2126.     }
  2127.  
  2128.  
  2129.  
  2130.     // 翻译server
  2131.     var server = {
  2132.         // 存放已经生成的内容面板（销毁的时候用）
  2133.         rendered: [],
  2134.         // 销毁已经生成的内容面板
  2135.         containerDestroy: function () {
  2136.             for (var i = this.rendered.length - 1; i >= 0; i--) {
  2137.                 if (this.rendered[i] && this.rendered[i].parentNode) {
  2138.                     this.rendered[i].parentNode.removeChild(this.rendered[i]);
  2139.                 }
  2140.             }
  2141.         },
  2142.         // 面板 DOM （此时还未添加到页面）
  2143.         container: function () {
  2144.             var div = document.createElement('div');
  2145.             div.setAttribute('style', '' +
  2146.                              'display:none!important;' +
  2147.                              'position:absolute!important;' +
  2148.                              'font-size:4px!important;' +
  2149.                              'overflow:auto!important;' +
  2150.                              //'background:#fff!important;' +
  2151.                              'background-color:rgba(255,255,255,0.3)!important;' +
  2152.                              'font-family:sans-serif,Arial!important;' +
  2153.                              'font-weight:normal!important;' +
  2154.                              'text-align:left!important;' +
  2155.                              'color:#000!important;' +
  2156.                              'padding:0.5em 1em!important;' +
  2157.                              //'line-height:1.5em!important;' +
  2158.                              'border-radius:3px!important;' +
  2159.                              'border:1px solid #ccc!important;' +
  2160.                              //'box-shadow:4px 4px 8px #888!important;' +
  2161.                              'max-width:350px!important;' +
  2162.                              'max-height:1216px!important;' +
  2163.                              'z-index:2147483647!important;' +
  2164.                              '');
  2165.             return div;
  2166.         }
  2167.     };// server结束
  2168.  
  2169.  
  2170.  
  2171. })();

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址