CSS Gradient Paste Image

Add a paste image option to CSS Gradient and upload the image using the site's upload button

Dovrai installare un'estensione come Tampermonkey, Greasemonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Violentmonkey per installare questo script.

Dovrai installare un'estensione come Tampermonkey o Userscripts per installare questo script.

Dovrai installare un'estensione come ad esempio Tampermonkey per installare questo script.

Dovrai installare un gestore di script utente per installare questo script.

(Ho già un gestore di script utente, lasciamelo installare!)

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione come ad esempio Stylus per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

Dovrai installare un'estensione per la gestione degli stili utente per installare questo stile.

(Ho già un gestore di stile utente, lasciamelo installare!)

// ==UserScript==
// @name         CSS Gradient Paste Image
// @namespace    CSS Clipboard Upload
// @version      1.0
// @description  Add a paste image option to CSS Gradient and upload the image using the site's upload button
// @author       𝓝𝑒ⓦ 𝓙ⓐ¢𝓀🕹️
// @match        https://cssgradient.io/*
// @license      MIT
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Wait until the DOM is fully loaded
    window.addEventListener('load', function() {
        // Function to create the "Paste Image" button
        function createPasteButton() {
            const div = document.querySelector('.app-options__content');
            if (div) {
                const pasteOption = document.createElement('div');
                pasteOption.className = 'app-option';

                const pasteButton = document.createElement('button');
                pasteButton.className = 'app-option__button';
                pasteButton.innerText = 'Paste Image';
                pasteOption.appendChild(pasteButton);

                // Add the paste option to the div
                div.appendChild(pasteOption);

                // Add event listener for paste event
                pasteButton.addEventListener('click', function() {
                    document.addEventListener('paste', function(event) {
                        const items = (event.clipboardData || event.originalEvent.clipboardData).items;
                        for (const item of items) {
                            if (item.kind === 'file' && item.type.startsWith('image/')) {
                                const blob = item.getAsFile();
                                const fileInput = document.querySelector('.js-upload');
                                const dataTransfer = new DataTransfer();
                                dataTransfer.items.add(blob);
                                fileInput.files = dataTransfer.files;

                                // Trigger the change event to simulate uploading
                                const event = new Event('change');
                                fileInput.dispatchEvent(event);
                            }
                        }
                    }, { once: true });
                });
            } else {
                console.log('Target div not found');
            }
        }

        // Add the paste button to the page
        createPasteButton();
    });
})();