☰

OFans.party IPFS Gateway Switcher

IPFS gateway switcher for ofans.party.

  1. // ==UserScript==
  2. // @name        OFans.party IPFS Gateway Switcher
  3. // @namespace   Violentmonkey Scripts
  4. // @description IPFS gateway switcher for ofans.party.
  5. // @match       https://ofans.party/*
  6. // @grant       GM_xmlhttpRequest
  7. // @grant       GM_getValue
  8. // @grant       GM_setValue
  9. // @grant       GM_deleteValue
  10. // @grant       unsafeWindow
  11. // @run-at      document-start
  12. // @version     0.9
  13. // @author      sudorain
  14. // @noframes
  15. // ==/UserScript==
  16.  
  17. // A (somewhat working) polyfill for beforescriptexecute event
  18. // https://github.com/jspenguin2017/Snippets/blob/master/onbeforescriptexecute.html
  19. (() => {
  20.   'use strict';
  21.  
  22.   if (navigator.userAgent.indexOf("Chrome") !== -1) {
  23.     const Event = class {
  24.       constructor(script, target) {
  25.         this.script = script;
  26.         this.target = target;
  27.  
  28.         this._cancel = false;
  29.         this._replace = null;
  30.         this._stop = false;
  31.       }
  32.  
  33.       preventDefault() {
  34.         this._cancel = true;
  35.       }
  36.       stopPropagation() {
  37.         this._stop = true;
  38.       }
  39.       replacePayload(payload) {
  40.         this._replace = payload;
  41.       }
  42.     };
  43.  
  44.     let callbacks = [];
  45.     window.addBeforeScriptExecuteListener = (f) => {
  46.       if (typeof f !== 'function') {
  47.         throw new Error('Event handler must be a function.');
  48.       }
  49.       callbacks.push(f);
  50.     };
  51.     window.removeBeforeScriptExecuteListener = (f) => {
  52.       let i = callbacks.length;
  53.       while (i--) {
  54.         if (callbacks[i] === f) {
  55.           callbacks.splice(i, 1);
  56.         }
  57.       }
  58.     };
  59.  
  60.     const dispatch = (script, target) => {
  61.       if (script.tagName !== 'SCRIPT') {
  62.         return;
  63.       }
  64.  
  65.       const e = new Event(script, target);
  66.  
  67.       if (typeof window.onbeforescriptexecute === 'function') {
  68.         try {
  69.           window.onbeforescriptexecute(e);
  70.         } catch (err) {
  71.           console.error(err);
  72.         }
  73.       }
  74.  
  75.       for (const func of callbacks) {
  76.         if (e._stop) {
  77.           break;
  78.         }
  79.         try {
  80.           func(e);
  81.         } catch (err) {
  82.           console.error(err);
  83.         }
  84.       }
  85.  
  86.       if (e._cancel) {
  87.         script.textContent = '';
  88.         script.remove();
  89.       } else if (typeof e._replace === 'string') {
  90.         script.textContent = e._replace;
  91.       }
  92.     };
  93.     const observer = new MutationObserver((mutations) => {
  94.       for (const m of mutations) {
  95.         for (const n of m.addedNodes) {
  96.           dispatch(n, m.target);
  97.         }
  98.       }
  99.     });
  100.     observer.observe(document, {
  101.       childList: true,
  102.       subtree: true,
  103.     });
  104.   }
  105.  
  106. })();
  107.  
  108. (async () => {
  109.   'use strict';
  110.  
  111.   var loaded, regex_main_js, regex_ipfs, ipfs_replace, gateways_json, public_gateways, current_gateway, gallery_mode, posts_find, posts_replace;
  112.  
  113.   // A site displaying public IPFS gateways and their online/offline status.
  114.   // https://ipfs.github.io/public-gateway-checker/
  115.   gateways_json = 'https://ipfs.github.io/public-gateway-checker/gateways.json';
  116.  
  117.   public_gateways = await GM_getValue('public_gateways');
  118.   current_gateway = await GM_getValue('current_gateway');
  119.   gallery_mode = await GM_getValue('gallery_mode') || false;
  120.  
  121.   loaded = false;
  122.   regex_main_js = new RegExp(/main\.[a-z0-9]+\.chunk\.js/);
  123.   regex_ipfs = new RegExp(/ipfsHost:"(.*?)"/g);
  124.   ipfs_replace = `ipfsHost:"${current_gateway}"`
  125.  
  126.   posts_find = `Object(a.jsxs)("div",{className:"container",children:[o,this.state.posts&&this.state.posts.map((function(t,s){return r++,Object(a.jsxs)("div",{className:"row post",of_id:t.post_id,children:[r%15==0&&e.renderAd(),Object(a.jsxs)("div",{className:"col-lg-6 postText",children:[e.renderPostDate(t),Object(a.jsx)("br",{}),e.renderPostText(t)]}),Object(a.jsx)("div",{className:"col-lg-6",style:{textAlign:"center"},children:t.media&&t.media.map((function(t,s){return t.ipfs_media_hash?Object(a.jsx)("a",{href:e.state.ipfsHost+t.ipfs_media_hash,children:Object(a.jsx)("img",{src:e.state.ipfsHost+t.ipfs_thumb_hash,loading:"lazy",className:"mediaThumb"})},t.id.toString()):Object(a.jsx)("div",{style:{backgroundColor:"grey",height:"144px",width:"144px",margin:"0.5em",position:"relative"},title:"Importing...",children:Object(a.jsxs)("span",{style:{color:"white",fontSize:"2em",fontWeight:"bold",position:"absolute",top:"50%",left:"50%",margin:"-25px 0 0 -25px",height:"50px",width:"50px"},children:[" ",Object(a.jsx)(c.a,{icon:["fa","download"]})," "]})})}))})]},t.id.toString())}))]})`
  127.   posts_replace = `Object(a.jsxs)("div",{className:"container",children:[o,Object(a.jsxs)("div",{className:"row row-cols-5 align-items-stretch no-gutters",children:[this.state.posts&&this.state.posts.map((function(t,s){return r++,t.media&&t.media.map((function(t,s){return t.ipfs_media_hash?Object(a.jsx)("div",{className:"col d-flex",children:Object(a.jsx)("div",{className:"d-flex justify-content-center align-items-center w-100 m-1 bg-light",style:{"min-height": "150px"},children:[Object(a.jsx)("span",{className:"position-absolute text-white fa fa-3x fa-fw fa-"+(t.type=="video"?"play-circle":t.type+" d-none"),style:{"text-shadow": "0 0 24px rgb(0 0 0 / 50%)"}}),Object(a.jsx)("a",{href:e.state.ipfsHost+t.ipfs_media_hash,target:"_blank",children:Object(a.jsx)("img",{src:e.state.ipfsHost+t.ipfs_thumb_hash,loading:"lazy",className:"img-fluid"})},t.id.toString())]})}):Object(a.jsx)("div",{className:"col d-flex",children:Object(a.jsx)("div",{className:"d-flex justify-content-center align-items-center w-100 m-1 bg-secondary",style:{"min-height": "150px"},title:"Importing...",children:Object(a.jsx)("span",{className:"text-white fa fa-3x fa-fw fa-download",style:{"text-shadow": "0 0 24px rgb(0 0 0 / 50%)"}})})})}))}))]})]})`
  128.  
  129.   await GM_xmlhttpRequest({
  130.     method: 'GET',
  131.     url: gateways_json,
  132.     onload: function (response) {
  133.       public_gateways = response.responseText.replace(/:hash/g, '');
  134.       GM_setValue('public_gateways', public_gateways)
  135.     }
  136.   });
  137.  
  138.   if (navigator.userAgent.indexOf("Chrome") !== -1) {
  139.     window.onbeforescriptexecute = (e) => {
  140.       const script = e.script.outerHTML;
  141.       if (regex_main_js.test(script) && !loaded && (current_gateway || gallery_mode)) {
  142.         const source = e.script.attributes.src.value;
  143.         e.preventDefault()
  144.         e.stopPropagation()
  145.         modifyScript(source)
  146.       }
  147.     }
  148.   } else if (navigator.userAgent.indexOf("Firefox") !== -1) {
  149.     window.addEventListener('beforescriptexecute', function (e) {
  150.       const source = e.target.src;
  151.       if (regex_main_js.test(source) && !loaded && (current_gateway || gallery_mode)) {
  152.         e.preventDefault()
  153.         e.stopPropagation()
  154.         modifyScript(source)
  155.       }
  156.     })
  157.   }
  158.  
  159.   document.addEventListener('DOMContentLoaded', function () {
  160.  
  161.     let css = `
  162.       .custom-scrollbar::-webkit-scrollbar {
  163.         width: 5px;
  164.       }
  165.  
  166.       .custom-scrollbar::-webkit-scrollbar-track {
  167.         background: #dee2e6; 
  168.       }
  169.  
  170.       .custom-scrollbar::-webkit-scrollbar-thumb {
  171.         background: #888; 
  172.       }
  173.  
  174.       .custom-scrollbar::-webkit-scrollbar-thumb:hover {
  175.         background: #555; 
  176.       }
  177.     `;
  178.  
  179.     let style = createElement('style', {}, css);
  180.     document.head.append(style);
  181.  
  182.     let gateways = JSON.parse(public_gateways)
  183.     gateways.sort(function (gateway) {
  184.       if (gateway === current_gateway) return -1;
  185.     });
  186.  
  187.     let party = createElement('div',
  188.       { class: 'position-fixed fixed-bottom float-left text-monospace mb-3 ml-3', style: 'width: fit-content;width: -moz-fit-content;' },
  189.       createElement('div',
  190.         { id: 'switch', class: 'btn-group dropup' },
  191.         createElement('button',
  192.           { class: 'btn btn-dark dropdown-toggle', 'data-toggle': 'dropdown', 'aria-haspopup': 'true', 'aria-expanded': 'false', reference: 'parent' },
  193.           'Gateways',
  194.           createElement('span',
  195.             { class: 'badge badge-light ml-2' },
  196.             gateways.length
  197.           )
  198.         ),
  199.         createElement('div',
  200.           { class: 'dropdown-menu overflow-auto custom-scrollbar shadow-lg px-0 pt-0 pb-2 mb-3', style: 'max-height: 388px' },
  201.           createElement('h6',
  202.             { class: 'bg-light text-dark shadow-sm sticky-top dropdown-header border-bottom py-3 mb-2' },
  203.             'Gateway Switcher',
  204.             createElement('a',
  205.               { class: 'float-right text-success', href: 'https://ipfs.github.io/public-gateway-checker/', target: '_blank' },
  206.               'Public Gateway Checker'
  207.             )
  208.           ),
  209.           createElement('button',
  210.             { 'data-value': '', class: `dropdown-item border-bottom button-switch ${!current_gateway ? ' active' : ' text-dark'}`, type: 'button' },
  211.             'Default'
  212.           ),
  213.           ...gateways.map((gateway, index) => {
  214.             let current = current_gateway == gateway;
  215.             let url = gateway.match(/(?<protocol>.*?:\/\/)(?<origin>.*)/);
  216.             return createElement('button',
  217.               { 'data-value': gateway, class: `dropdown-item border-bottom button-switch ${current ? ' active' : ' text-dark'}`, type: 'button' },
  218.               createElement('small',
  219.                 { class: `${current ? ' ' : ' text-black-50'}` },
  220.                 url.groups.protocol
  221.               ),
  222.               url.groups.origin
  223.             )
  224.           })
  225.         )
  226.       ),
  227.       createElement('button',
  228.         { class: `btn button-gallery ml-2 ${gallery_mode ? ' btn-info' : ' btn-dark'}` },
  229.         'Gallery Mode',
  230.         createElement('span',
  231.           { class: 'badge badge-light ml-2' },
  232.           `${gallery_mode ? 'On' : 'Off'}`
  233.         )
  234.       )
  235.     );
  236.  
  237.     document.body.append(party)
  238.  
  239.   });
  240.  
  241.   document.addEventListener('click', switchGateway);
  242.  
  243.   function switchGateway(e) {
  244.     const class_list = e.target.classList;
  245.     const data_set = e.target.dataset;
  246.     if (class_list.contains('button-switch')) {
  247.       const value = data_set.value;
  248.       if (value) {
  249.         GM_setValue('current_gateway', value)
  250.       } else {
  251.         GM_deleteValue('current_gateway')
  252.       }
  253.       location.reload()
  254.     } else if (class_list.contains('button-gallery')) {
  255.       GM_setValue('gallery_mode', !gallery_mode)
  256.       location.reload()
  257.     }
  258.   }
  259.  
  260.   function modifyScript(source) {
  261.     GM_xmlhttpRequest({
  262.       method: 'GET',
  263.       url: source,
  264.       onload: async function (response) {
  265.         loaded = !loaded
  266.  
  267.         var text = response.responseText
  268.         text = text.replace(regex_ipfs, ipfs_replace)
  269.         if (current_gateway) {
  270.           text = text.replace(regex_ipfs, ipfs_replace)
  271.         }
  272.         if (gallery_mode) {
  273.           text = text.replace(posts_find, posts_replace);
  274.         }
  275.         let newScript = createElement('script', { type: 'text/javascript', id: 'main' }, text);
  276.         document.head.append(newScript);
  277.       }
  278.     })
  279.   }
  280.  
  281.   function createElement(type, attributes, ...children) {
  282.     let element = document.createElement(type)
  283.  
  284.     Object.keys(attributes).forEach(key => element.setAttribute(key, attributes[key]))
  285.  
  286.     children.forEach(child => {
  287.       if (typeof child === 'string' || typeof child === 'number') {
  288.         element.appendChild(document.createTextNode(child))
  289.       } else {
  290.         element.appendChild(child)
  291.       }
  292.     })
  293.  
  294.     return element
  295.   }
  296.  
  297. })();