☰

Copy Page URL Window with Keybind Option and Alert Timeout

Adds a floating window to copy the current page's URL to the clipboard and change keybinds with an alert timeout

  1. // ==UserScript==
  2. // @name         Copy Page URL Window with Keybind Option and Alert Timeout
  3. // @namespace    http://your.namespace.com
  4. // @license       CC
  5. // @version      5.0
  6. // @description  Adds a floating window to copy the current page's URL to the clipboard and change keybinds with an alert timeout
  7. // @author       Speed_Racer
  8. // @match        *://*/*
  9. // @grant        none
  10. // ==/UserScript==
  11.  
  12.  
  13.  
  14. (function() {
  15.     'use strict';
  16.  
  17.     // Default keybind
  18.     var keybind = localStorage.getItem('keybind') || 'Shift + Alt'; // Retrieve keybind from localStorage or set default
  19.  
  20.     // Create a floating window
  21.     var floatingWindow = document.createElement("div");
  22.     floatingWindow.style.position = "fixed";
  23.     floatingWindow.style.right = "20px";
  24.     floatingWindow.style.bottom = "20px";
  25.     floatingWindow.style.width = "85px";
  26.     floatingWindow.style.height = "50px";
  27.     floatingWindow.style.backgroundColor = "lightgray";
  28.     floatingWindow.style.border = "1px solid black";
  29.     floatingWindow.style.padding = "5px";
  30.     floatingWindow.style.zIndex = "9999";
  31.     floatingWindow.style.transition = "opacity 0.5s";
  32.     floatingWindow.style.opacity = "0"; // Initially hidden
  33.  
  34.     var timer; // Timer variable
  35.  
  36.     // Function to show the floating window
  37.     function showFloatingWindow() {
  38.         clearTimeout(timer); // Clear the hide timer
  39.         floatingWindow.style.opacity = "1"; // Show the window
  40.     }
  41.  
  42.     // Function to hide the floating window
  43.     function hideFloatingWindow() {
  44.         floatingWindow.style.opacity = "0"; // Hide the window
  45.     }
  46.  
  47.     // Add event listener to show the floating window when mouse enters
  48.     floatingWindow.addEventListener("mouseenter", showFloatingWindow);
  49.  
  50.     // Add event listener to hide the floating window when mouse leaves
  51.     floatingWindow.addEventListener("mouseleave", function() {
  52.         // Set a timer to hide the window after 10 seconds of inactivity
  53.         timer = setTimeout(function() {
  54.             hideFloatingWindow();
  55.         }, 10000);
  56.     });
  57.  
  58.     // Function to handle the button click
  59.     function handleCopyButtonClick() {
  60.         copyURLToClipboard();
  61.     }
  62.  
  63.     // Function to handle the key press event
  64.     function handleKeyPress(event) {
  65.         // Check if the event key matches the current keybind
  66.         if (event.shiftKey && event.key === keybind.split(' + ')[1]) {
  67.             copyURLToClipboard();
  68.         }
  69.     }
  70.  
  71.     // Function to copy the current page's URL to the clipboard
  72.     function copyURLToClipboard() {
  73.         var currentURL = window.location.href;
  74.  
  75.         // Copy the URL to the clipboard
  76.         navigator.clipboard.writeText(currentURL)
  77.             .then(function() {
  78.                 console.log('URL copied to clipboard: ' + currentURL);
  79.                 var alertMessage = 'URL copied to clipboard!';
  80.                 showAlert(alertMessage);
  81.             })
  82.             .catch(function(error) {
  83.                 console.error('Failed to copy URL to clipboard: ', error);
  84.                 var errorMessage = 'Failed to copy URL to clipboard.';
  85.                 showAlert(errorMessage);
  86.             });
  87.     }
  88.  
  89.     // Function to show an alert with a timeout
  90.     function showAlert(message) {
  91.         var alertBox = document.createElement('div');
  92.         alertBox.className = 'alert';
  93.         alertBox.textContent = message;
  94.         alertBox.style.position = 'fixed';
  95.         alertBox.style.top = '0';
  96.         alertBox.style.left = '50%';
  97.         alertBox.style.transform = 'translateX(-50%)';
  98.         alertBox.style.color = 'black'; // Text color
  99.         alertBox.style.backgroundColor = 'white'; // Background color
  100.         alertBox.style.padding = '10px';
  101.         alertBox.style.border = '1px solid black';
  102.         alertBox.style.zIndex = '10000';
  103.  
  104.         document.body.appendChild(alertBox);
  105.  
  106.         // Hide the alert after 5 seconds
  107.         setTimeout(function() {
  108.             alertBox.style.display = 'none';
  109.         }, 5000);
  110.     }
  111.  
  112.     // Add the copy button to the floating window
  113.     var copyButton = document.createElement("button");
  114.     copyButton.textContent = "Copy URL";
  115.     copyButton.addEventListener("click", handleCopyButtonClick);
  116.     floatingWindow.appendChild(copyButton);
  117.  
  118.     // Add an input field to change the keybind
  119.     var keybindInput = document.createElement("input");
  120.     keybindInput.type = "text";
  121.     keybindInput.value = keybind;
  122.     keybindInput.style.marginTop = "5px";
  123.     keybindInput.style.width = "70px";
  124.     keybindInput.style.color = "black"; // Set the text color to black
  125.     keybindInput.style.backgroundColor = "white"; // Set the background color to white
  126.     keybindInput.addEventListener("change", function(event) {
  127.         keybind = event.target.value;
  128.         localStorage.setItem('keybind', keybind); // Save keybind to localStorage
  129.         var keybindChangeMessage = "Keybind changed to: " + keybind;
  130.         showAlert(keybindChangeMessage);
  131.     });
  132.     floatingWindow.appendChild(keybindInput);
  133.  
  134.     // Add the floating window to the document
  135.     document.body.appendChild(floatingWindow);
  136.  
  137.     // Add event listener to listen for keydown events
  138.     document.addEventListener('keydown', handleKeyPress);
  139. })();
  140.