BF - Link Shortener with Is Gd

Adds an option to the Tampermonkey menu to shorten links with is.gd, optimized for mobile, with an elegant design.

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name         BF - Link Shortener with Is Gd
// @name:pt-BR   BF - Encurtador de Links
// @namespace    https://github.com/BrunoFortunatto
// @version      1.3
// @description  Adds an option to the Tampermonkey menu to shorten links with is.gd, optimized for mobile, with an elegant design.
// @description:pt-BR Adiciona uma opção ao menu do Tampermonkey para encurtar links da página atual usando is.gd, otimizado para dispositivos móveis e com um design moderno e elegante.
// @author       Bruno Fortunato
// @match        *://*/*
// @grant        GM_xmlhttpRequest
// @grant        GM_registerMenuCommand
// @connect      is.gd
// @license      MIT
// ==/UserScript==

(function() {
    'use strict';

    // Garante que o script só seja executado no frame principal (evita duplicação em iframes)
    if (window.top !== window.self) {
        return;
    }

    // Adiciona opção ao menu do Tampermonkey
    GM_registerMenuCommand("🔗 Encurtar Link", showOverlay);

    function showOverlay() {
        // Se já existe um overlay, remove para evitar duplicatas
        const existingOverlay = document.getElementById('isgd-shortener-overlay');
        if (existingOverlay) {
            existingOverlay.remove();
        }

        let overlay = document.createElement('div');
        overlay.id = 'isgd-shortener-overlay'; // Adiciona um ID para fácil referência
        overlay.style.cssText = `
            position: fixed;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            background: rgba(0, 0, 0, 0.7); /* Fundo mais escuro */
            z-index: 2147483647; /* VALOR MÁXIMO POSSÍVEL PARA Z-INDEX */
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0; /* Começa invisível */
            transition: opacity 0.3s ease-in-out; /* Transição de fade-in */
            font-family: 'Segoe UI', 'Roboto', sans-serif; /* Fonte mais moderna */
            backdrop-filter: blur(5px); /* Efeito de desfoque no fundo */
        `;
        // Força o reflow para a transição funcionar
        void overlay.offsetWidth;
        overlay.style.opacity = '1';

        let box = document.createElement('div');
        box.style.cssText = `
            background: #282C34; /* Fundo mais escuro e elegante para a caixa */
            color: #E0E0E0; /* Cor do texto mais suave */
            padding: 30px; /* Mais padding */
            border-radius: 15px; /* Bordas mais arredondadas */
            box-shadow: 0px 8px 25px rgba(0, 0, 0, 0.6); /* Sombra mais pronunciada */
            text-align: center;
            width: 90%;
            max-width: 400px; /* Aumenta um pouco a largura máxima */
            display: flex;
            flex-direction: column;
            align-items: center;
            transform: translateY(20px); /* Começa um pouco abaixo */
            opacity: 0; /* Começa invisível */
            transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; /* Transição para a caixa */
        `;
        // Força o reflow para a transição funcionar
        void box.offsetWidth;
        box.style.opacity = '1';
        box.style.transform = 'translateY(0)';


        let title = document.createElement('h2');
        title.innerText = '🔗 Link Encurtado';
        title.style.cssText = `
            color: #61AFEF; /* Um tom de azul para o título */
            font-size: 24px; /* Tamanho maior para o título */
            margin-bottom: 20px;
            font-weight: 600; /* Mais negrito */
            display: flex;
            align-items: center;
            gap: 10px; /* Espaço entre o ícone e o texto */
        `;
        box.appendChild(title);

        let loadingText = document.createElement('p');
        loadingText.innerText = 'Gerando link curto...';
        loadingText.style.cssText = `
            color: #ABB2BF; /* Cor suave para o texto de carregamento */
            font-size: 16px;
            margin-bottom: 20px;
        `;
        box.appendChild(loadingText);

        GM_xmlhttpRequest({
            method: "GET",
            url: `https://is.gd/create.php?format=simple&url=${encodeURIComponent(window.location.href)}`,
            onload: function(response) {
                loadingText.remove(); // Remove o texto de carregamento

                let shortLink = document.createElement('input');
                shortLink.value = response.responseText;
                shortLink.style.cssText = `
                    width: 100%;
                    padding: 12px 15px; /* Mais padding */
                    margin-bottom: 20px;
                    border: 1px solid #4B5263; /* Borda sutil */
                    border-radius: 8px; /* Bordas mais arredondadas */
                    background: #3B4048; /* Fundo mais escuro para o input */
                    color: #98C379; /* Cor verde para o link */
                    text-align: center;
                    font-size: 17px; /* Tamanho da fonte levemente maior */
                    font-weight: 500;
                    cursor: text;
                    box-sizing: border-box; /* Inclui padding na largura */
                    transition: all 0.2s ease-in-out;
                `;
                shortLink.readOnly = true;
                shortLink.onclick = function() {
                    this.select(); // Seleciona o texto ao clicar
                };
                shortLink.onfocus = function() {
                     this.style.borderColor = '#61AFEF'; /* Borda azul ao focar */
                };
                shortLink.onblur = function() {
                     this.style.borderColor = '#4B5263'; /* Volta à cor original */
                };
                box.appendChild(shortLink);

                let buttonContainer = document.createElement('div');
                buttonContainer.style.cssText = `
                    display: flex;
                    flex-direction: column;
                    width: 100%;
                    gap: 10px; /* Espaço entre os botões */
                `;
                box.appendChild(buttonContainer);

                let copyButton = document.createElement('button');
                copyButton.innerText = '📋 Copiar Link';
                copyButton.style.cssText = `
                    width: 100%;
                    padding: 12px 20px;
                    border: none;
                    border-radius: 8px;
                    background: #C678DD; /* Roxo para o botão copiar */
                    color: #FFFFFF;
                    font-weight: bold;
                    font-size: 16px;
                    cursor: pointer;
                    transition: background 0.2s ease-in-out, transform 0.1s ease-in-out;
                `;
                copyButton.onmouseover = () => copyButton.style.background = '#9963B5';
                copyButton.onmouseout = () => copyButton.style.background = '#C678DD';
                copyButton.onmousedown = () => copyButton.style.transform = 'scale(0.98)';
                copyButton.onmouseup = () => copyButton.style.transform = 'scale(1)';

                copyButton.onclick = function() {
                    shortLink.select();
                    document.execCommand('copy');
                    copyButton.innerText = '✅ Copiado!';
                    copyButton.style.background = '#98C379'; // Verde ao copiar
                    setTimeout(() => {
                        copyButton.innerText = '📋 Copiar Link';
                        copyButton.style.background = '#C678DD';
                    }, 2000);
                };
                buttonContainer.appendChild(copyButton);

                let shareButton = document.createElement('button');
                shareButton.innerText = '📤 Compartilhar';
                shareButton.style.cssText = `
                    width: 100%;
                    padding: 12px 20px;
                    border: none;
                    border-radius: 8px;
                    background: #56B6C2; /* Ciano para o botão compartilhar */
                    color: #FFFFFF;
                    font-weight: bold;
                    font-size: 16px;
                    cursor: pointer;
                    transition: background 0.2s ease-in-out, transform 0.1s ease-in-out;
                `;
                shareButton.onmouseover = () => shareButton.style.background = '#458E97';
                shareButton.onmouseout = () => shareButton.style.background = '#56B6C2';
                shareButton.onmousedown = () => shareButton.style.transform = 'scale(0.98)';
                shareButton.onmouseup = () => shareButton.style.transform = 'scale(1)';

                shareButton.onclick = function() {
                    if (navigator.share) {
                        navigator.share({
                            title: 'Link Encurtado',
                            text: 'Aqui está seu link encurtado:',
                            url: shortLink.value
                        }).catch(error => console.log('Erro ao compartilhar:', error));
                    } else {
                        alert('Compartilhamento não suportado neste navegador. Você pode copiar o link manualmente.');
                    }
                };
                buttonContainer.appendChild(shareButton);

                let closeButton = document.createElement('button');
                closeButton.innerText = '❌ Fechar';
                closeButton.style.cssText = `
                    width: 100%;
                    margin-top: 20px; /* Mais espaço acima do botão fechar */
                    padding: 12px 20px;
                    border: none;
                    border-radius: 8px;
                    background: #E06C75; /* Vermelho suave para o botão fechar */
                    color: #FFFFFF;
                    font-weight: bold;
                    font-size: 16px;
                    cursor: pointer;
                    transition: background 0.2s ease-in-out, transform 0.1s ease-in-out;
                `;
                closeButton.onmouseover = () => closeButton.style.background = '#C15C65';
                closeButton.onmouseout = () => closeButton.style.background = '#E06C75';
                closeButton.onmousedown = () => closeButton.style.transform = 'scale(0.98)';
                closeButton.onmouseup = () => closeButton.style.transform = 'scale(1)';

                closeButton.onclick = function() {
                    // Transição de fade-out ao fechar
                    box.style.opacity = '0';
                    box.style.transform = 'translateY(20px)';
                    overlay.style.opacity = '0';
                    setTimeout(() => {
                        document.body.removeChild(overlay);
                    }, 300); // Espera a transição terminar antes de remover
                };
                box.appendChild(closeButton);
            }
        });

        overlay.appendChild(box);
        document.body.appendChild(overlay);

        // Adiciona um listener para fechar o overlay ao clicar fora da caixa
        overlay.addEventListener('click', function(event) {
            if (event.target === overlay) {
                // Simula o clique no botão de fechar
                const closeBtn = box.querySelector('button[onclick*="document.body.removeChild(overlay)"]');
                if (closeBtn) {
                    closeBtn.click();
                }
            }
        });
    }

})();