☰

Automatic URL Decoder

Декодирует все найденные на странице ссылки, похожие на "%D0%BF%D1%80%D0%B8%D0%B2%D0%B5%D1%82%20%D0%BC%D0%B8%D1%80", в удобочитаемое "привет мир"

  1. // ==UserScript==
  2. // @name Automatic URL Decoder
  3. // @namespace https://github.com/T1mL3arn
  4. // @author T1mL3arn
  5. // @description:ru Декодирует все найденные на странице ссылки, похожие на "%D0%BF%D1%80%D0%B8%D0%B2%D0%B5%D1%82%20%D0%BC%D0%B8%D1%80", в удобочитаемое "привет мир"
  6. // @description:en It decodes all percent-encoded links on current page.
  7. // @match *://*/*
  8. // @exclude-match https://github.com/t1ml3arn-userscript-js/Automatic-URL-Decoder
  9. // @exclude https://github.com/t1ml3arn-userscript-js/Automatic-URL-Decoder
  10. // @exclude-match https://greasyfork.org/en/scripts/40305-automatic-url-decoder
  11. // @exclude https://greasyfork.org/en/scripts/40305-automatic-url-decoder
  12. // @version 2.1.2
  13. // @run-at document-end
  14. // @license GPLv3
  15. // @supportURL https://github.com/T1mL3arn/Automatic-URL-Decoder/issues
  16. // @homepageURL https://github.com/T1mL3arn/Automatic-URL-Decoder
  17. // @description Декодирует все найденные на странице ссылки, похожие на "%D0%BF%D1%80%D0%B8%D0%B2%D0%B5%D1%82%20%D0%BC%D0%B8%D1%80", в удобочитаемое "привет мир"
  18. // ==/UserScript==
  19.  
  20. (() => {
  21.   
  22.   const DECODED_ELT_CLASS = 'auto-url-decoder-s739';
  23.   
  24.   // Predefined css styles for decoded links //
  25.   // To change css find `decodedNodeCSS` variable
  26.   // and set one of the style below to it.
  27.   // Set `null` to `decodedNodeCSS` to disable styling.
  28.  
  29.   const underlineCss = `
  30.   .${DECODED_ELT_CLASS} {
  31.     border-bottom: 2px solid currentColor !important;
  32.     margin-bottom: -2px !important;
  33.   }`;
  34.   const CSS_greenBackground = getDefaultBackgroundCSS('#deffc3');
  35.   const CSS_redBackground = getDefaultBackgroundCSS('#fcd7d7');
  36.   const CSS_blueBackground = getDefaultBackgroundCSS('#d7ebfc');
  37.   // ----------- //
  38.  
  39.   function addStyle(css) {
  40.     const id = 'auto-url-decoder-style-elt'; 
  41.     const style = document.getElementById(id) || document.head.appendChild(document.createElement('style'));
  42.     style.id = id;
  43.     style.textContent = css;
  44.   }
  45.  
  46.   function getDefaultBackgroundCSS(color) {
  47.     return `
  48.     .${DECODED_ELT_CLASS} {
  49.       background-color: ${color} !important;
  50.       padding: 2px 2px !important;
  51.       margin: 0 -2px !important;
  52.     }`;
  53.   }
  54.  
  55.   function fixLinks(node) {
  56.     if (node.nodeType === 3) {
  57.       let content = node.textContent;
  58.       if (content != '') {
  59.         if (linkEregLocal.test(content) && percentEncodingEreg.test(content)) {
  60.           if (decodedNodeCSS != null) replaceAndStyleLink(node);
  61.           else {
  62.             try {
  63.               let decoded = content.replace(linkEreg, decodeURIComponent);
  64.               if (decoded.length != content.length) node.textContent = decoded;
  65.             } catch (e) {
  66.               // URI mailformed, hust skip it
  67.             }
  68.           }
  69.         }
  70.       }
  71.     } else if (node.nodeType === 1 && node.childNodes.length > 0 && isElementAllowed(node)) {
  72.       node.childNodes.forEach(fixLinks);
  73.     }
  74.   }
  75.   
  76.   function isElementAllowed(elt) {
  77.     return blockedTagsList.indexOf(elt.tagName) == -1 && !elt.matches(blockedClassesSelector);
  78.   }
  79.  
  80.   function replaceAndStyleLink(node) {
  81.     let match;
  82.     let sibling = node;
  83.     let content = node.textContent;
  84.     while ((match = linkEreg.exec(content)) != null) {
  85.       let fullMatch = match[0];
  86.       let decoded;
  87.  
  88.       try {
  89.         decoded = decodeURIComponent(fullMatch);
  90.       } catch (e) {
  91.         content = content.substring(linkEreg.lastIndex);
  92.         linkEreg.lastIndex = 0;
  93.         continue;
  94.       }
  95.  
  96.       if (decoded.length != fullMatch.length) {
  97.         let span = document.createElement('span');
  98.         span.classList.add(DECODED_ELT_CLASS);
  99.  
  100.         if (storeOriginalURL) span.dataset.urlDecOriginalUrl = fullMatch;
  101.   
  102.         let range = document.createRange();
  103.         range.setStart(sibling, linkEreg.lastIndex - match[0].length);
  104.         range.setEnd(sibling, linkEreg.lastIndex);
  105.         range.surroundContents(span);
  106.         
  107.         content = content.substring(linkEreg.lastIndex);
  108.         span.textContent = decoded;
  109.         linkEreg.lastIndex = 0;
  110.         counter++;
  111.  
  112.         sibling = getNextTextSibling(span);
  113.         if (sibling == null)  break;
  114.       }
  115.     }
  116.   }
  117.   
  118.   function getNextTextSibling(node) {
  119.     let next = node.nextSibling;
  120.     while (next != null) {
  121.       if (next.nodeType == 3) return next;
  122.       else                    next = node.nextSibling;
  123.     }
  124.     return null;
  125.   }
  126.  
  127.   let linkEreg = /(?:[a-z][a-z0-9-+.]+:\/\/|www\.).+?(?=\s|$)/gi;
  128.   let linkEregLocal = /(?:[a-z][a-z0-9-+.]+:\/\/|www\.).+?(?=\s|$)/i;
  129.   let percentEncodingEreg = /%[a-f0-9]{2}/i;
  130.   let obsOptions = { childList: true, subtree: true };
  131.   let blockedTagsList = 'NOSCRIPT OPTION SCRIPT STYLE TEXTAREA SVG CANVAS BUTTON SELECT TEMPLATE METER PROGRESS MATH TIME HEAD CODE PRE'.split(' ');
  132.   
  133.   ///NOTE Use 'foo' (or any other dummy class) in this selector
  134.   // if you need to make this variable "empty"
  135.   // It allows to avoid  SyntaxError: '' is not a valid selector
  136.   let blockedClassesSelector = `${DECODED_ELT_CLASS}`.split(' ').map(class_ => `.${class_}`).join(', ');
  137.  
  138.   let counter = 0;
  139.   let storeOriginalURL = false;
  140.   let decodedNodeCSS = CSS_greenBackground;
  141.   
  142.   let obs = new MutationObserver((changes, obs) => {
  143.     counter = 0;
  144.     obs.disconnect();
  145.     changes.forEach((change) => change.addedNodes.forEach((node) => fixLinks(node)) );
  146.     obs.observe(document.body, obsOptions);
  147.     //console.log('[ URL  Decoder ] Decoded: ', counter);
  148.   });
  149.   
  150.   if (decodedNodeCSS != null) addStyle(decodedNodeCSS);
  151.   
  152.   counter = 0;
  153.   fixLinks(document.body);
  154.   //console.log('[ URL  Decoder ] Decoded: ', counter);
  155.   obs.observe(document.body, obsOptions);
  156. })();