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

Versión del día 29/04/2024. Echa un vistazo a la versión más reciente.

Tendrás que instalar una extensión para tu navegador como Tampermonkey, Greasemonkey o Violentmonkey si quieres utilizar este script.

You will need to install an extension such as Tampermonkey to install this script.

Necesitarás instalar una extensión como Tampermonkey o Violentmonkey para instalar este script.

Necesitarás instalar una extensión como Tampermonkey o Userscripts para instalar este script.

Necesitará instalar una extensión como Tampermonkey para instalar este script.

Necesitarás instalar una extensión para administrar scripts de usuario si quieres instalar este script.

(Ya tengo un administrador de scripts de usuario, déjame instalarlo)

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión como Stylus para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

Necesitará instalar una extensión del gestor de estilos de usuario para instalar este estilo.

(Ya tengo un administrador de estilos de usuario, déjame instalarlo)

// ==UserScript==
// @name         Copy Page URL Window with Keybind Option and Alert Timeout
// @namespace    http://your.namespace.com
// @license      CC
// @version      2.0
// @description  Adds a floating window to copy the current page's URL to the clipboard and change keybinds with an alert timeout
// @author       Speed_Racer
// @match        *://*/*
// @grant        GM_addStyle
// @grant        GM_getValue
// @grant        GM_setValue
// ==/UserScript==

(function() {
    'use strict';

    // Default keybind
    var keybind = 'Shift + Alt';

    // Create a floating window
    var floatingWindow = document.createElement("div");
    floatingWindow.id = "floating-window";
    floatingWindow.style.display = "none"; // Initially hidden
    document.body.appendChild(floatingWindow);

    // Apply styles
    GM_addStyle(`
        #floating-window {
            position: fixed;
            bottom: 20px;
            right: 20px;
            width: 79px;
            height: 50px;
            background-color: lightgray;
            border: 1px solid black;
            padding: 5px;
            z-index: 9999;
            transition: opacity 0.5s;
            opacity: 0;
        }

        #floating-window:hover {
            opacity: 1;
        }

        #floating-window button, #floating-window input {
            margin-top: 5px;
            width: 72px;
            color: black;
            background-color: white;
        }
    `);

    var timer; // Timer variable

    // Function to show the floating window
    function showFloatingWindow() {
        clearTimeout(timer); // Clear the hide timer
        floatingWindow.style.display = "block"; // Show the window
    }

    // Function to hide the floating window
    function hideFloatingWindow() {
        floatingWindow.style.display = "none"; // Hide the window
    }

    // Add event listener to show the floating window when mouse enters
    floatingWindow.addEventListener("mouseenter", showFloatingWindow);

    // Add event listener to hide the floating window when mouse leaves
    floatingWindow.addEventListener("mouseleave", function() {
        // Set a timer to hide the window after 10 seconds of inactivity
        timer = setTimeout(function() {
            hideFloatingWindow();
        }, 10000);
    });

    // Function to handle the button click
    function handleCopyButtonClick() {
        copyURLToClipboard();
    }

    // Function to handle the key press event
    function handleKeyPress(event) {
        // Check if the event key matches the current keybind
        if (event.shiftKey && event.key === keybind.split(' + ')[1]) {
            copyURLToClipboard();
        }
    }

    // Function to copy the current page's URL to the clipboard
    function copyURLToClipboard() {
        var currentURL = window.location.href;

        // Copy the URL to the clipboard
        navigator.clipboard.writeText(currentURL)
            .then(function() {
                console.log('URL copied to clipboard: ' + currentURL);
                var alertMessage = 'URL copied to clipboard!';
                showAlert(alertMessage);
            })
            .catch(function(error) {
                console.error('Failed to copy URL to clipboard: ', error);
                var errorMessage = 'Failed to copy URL to clipboard.';
                showAlert(errorMessage);
            });
    }

    // Function to show an alert with a timeout
    function showAlert(message) {
        var alertBox = document.createElement('div');
        alertBox.className = 'alert';
        alertBox.textContent = message;
        alertBox.style.position = 'fixed';
        alertBox.style.top = '0';
        alertBox.style.left = '50%';
        alertBox.style.transform = 'translateX(-50%)';
        alertBox.style.color = 'black'; // Text color
        alertBox.style.backgroundColor = 'white'; // Background color
        alertBox.style.padding = '10px';
        alertBox.style.border = '1px solid black';
        alertBox.style.zIndex = '10000';

        document.body.appendChild(alertBox);

        // Hide the alert after 5 seconds
        setTimeout(function() {
            alertBox.style.display = 'none';
        }, 5000);
    }

    // Add the copy button to the floating window
    var copyButton = document.createElement("button");
    copyButton.textContent = "Copy URL";
    copyButton.addEventListener("click", handleCopyButtonClick);
    floatingWindow.appendChild(copyButton);

    // Add an input field to change the keybind
    var keybindInput = document.createElement("input");
    keybindInput.type = "text";
    keybindInput.value = keybind;
    keybindInput.addEventListener("change", function(event) {
        keybind = event.target.value;
        var keybindChangeMessage = "Keybind changed to: " + keybind;
        showAlert(keybindChangeMessage);
    });
    floatingWindow.appendChild(keybindInput);

    // Add event listener to listen for keydown events
    document.addEventListener('keydown', handleKeyPress);
})();