☰

12ft.io Button

Adds a button to load the page with 12ft.io/

  1. // ==UserScript==
  2. // @name         12ft.io Button
  3. // @namespace    http://tampermonkey.net/
  4. // @version      1.0.2
  5. // @description  Adds a button to load the page with 12ft.io/
  6. // @author       ils94
  7. // @match        *://*/*
  8. // @grant        none
  9. // @license MIT
  10. // ==/UserScript==
  11.  
  12. (function() {
  13.     'use strict';
  14.  
  15.     function addButton() {
  16.         if (document.getElementById('twelveFtButton')) return;
  17.  
  18.         let button = document.createElement('button');
  19.         button.id = 'twelveFtButton';
  20.         button.innerText = '12ft.io';
  21.         button.style.position = 'fixed';
  22.         button.style.bottom = '20px';
  23.         button.style.right = '20px';
  24.         button.style.zIndex = '9999';
  25.         button.style.width = '60px';
  26.         button.style.height = '60px';
  27.         button.style.borderRadius = '50%';
  28.         button.style.display = 'flex';
  29.         button.style.alignItems = 'center';
  30.         button.style.justifyContent = 'center';
  31.         button.style.fontSize = '14px';
  32.         button.style.fontWeight = 'bold';
  33.         button.style.backgroundColor = '#ff9800';
  34.         button.style.color = '#fff';
  35.         button.style.border = 'none';
  36.         button.style.boxShadow = '0px 4px 6px rgba(0, 0, 0, 0.2)';
  37.         button.style.cursor = 'pointer';
  38.         button.style.transition = 'transform 0.2s ease, box-shadow 0.2s ease';
  39.  
  40.         button.addEventListener('mouseover', function() {
  41.             button.style.transform = 'scale(1.1)';
  42.             button.style.boxShadow = '0px 6px 10px rgba(0, 0, 0, 0.3)';
  43.         });
  44.  
  45.         button.addEventListener('mouseout', function() {
  46.             button.style.transform = 'scale(1)';
  47.             button.style.boxShadow = '0px 4px 6px rgba(0, 0, 0, 0.2)';
  48.         });
  49.  
  50.         button.addEventListener('click', function() {
  51.             window.location.href = 'https://12ft.io/' + window.location.href;
  52.         });
  53.  
  54.         document.body.appendChild(button);
  55.     }
  56.  
  57.     function waitForBody() {
  58.         if (document.body) {
  59.             addButton();
  60.         } else {
  61.             new MutationObserver((mutations, observer) => {
  62.                 if (document.body) {
  63.                     observer.disconnect();
  64.                     addButton();
  65.                 }
  66.             }).observe(document.documentElement, {
  67.                 childList: true
  68.             });
  69.         }
  70.     }
  71.  
  72.     if (!window.location.href.startsWith('https://12ft.io/')) {
  73.         waitForBody();
  74.     }
  75. })();