Enable image pasting from clipboard in Poe

Simulate drag and drop when pasting an image from the clipboard

您需要先安裝使用者腳本管理器擴展,如 TampermonkeyGreasemonkeyViolentmonkey 之後才能安裝該腳本。

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

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyViolentmonkey 後才能安裝該腳本。

您需要先安裝使用者腳本管理器擴充功能,如 TampermonkeyUserscripts 後才能安裝該腳本。

你需要先安裝一款使用者腳本管理器擴展,比如 Tampermonkey,才能安裝此腳本

您需要先安裝使用者腳本管理器擴充功能後才能安裝該腳本。

(我已經安裝了使用者腳本管理器,讓我安裝!)

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展,比如 Stylus,才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

你需要先安裝一款使用者樣式管理器擴展後才能安裝此樣式

(我已經安裝了使用者樣式管理器,讓我安裝!)

// ==UserScript==
// @name         Enable image pasting from clipboard in Poe
// @namespace    http://tampermonkey.net/
// @version      0.2
// @description  Simulate drag and drop when pasting an image from the clipboard
// @author       You
// @match        https://poe.com/*
// @grant        none
// @license MIT
// ==/UserScript==

(function() {
    'use strict';

    // Helper function to dispatch an event
    function dispatchEvent(type, target, dataTransfer) {
        const event = new Event(type, {
            bubbles: true,
            cancelable: true
        });

        // Set the dataTransfer property if available
        if (dataTransfer) {
            event.dataTransfer = dataTransfer;
        }

        // Dispatch the event on the target element
        target.dispatchEvent(event);
    }

    // Add event listener for paste events
    window.addEventListener('paste', (event) => {
        let items = (event.clipboardData || event.originalEvent.clipboardData).items;

        for (let index in items) {
            let item = items[index];
            if (item.kind === 'file') {
                let blob = item.getAsFile();
                let dataTransfer = new DataTransfer();
                dataTransfer.items.add(blob);

                // Identify the drop zone element. You need to adjust this selector for the webpage.
                let dropZone = document.querySelector("div[class*=ChatDragDropTarget_dropTarget]");

                // Simulate the drag and drop events
                dispatchEvent('dragenter', dropZone, dataTransfer);
                dispatchEvent('dragover', dropZone, dataTransfer);
                dispatchEvent('drop', dropZone, dataTransfer);

                // Prevent the default paste action
                event.preventDefault();
            }
        }
    });
})();