☰

Gartic Phone Auto Draw

Adds a small GUI for auto-drawing in Gartic Phone, including image upload and drag & drop

目前为 2025-03-26 提交的版本，查看 最新版本。

// ==UserScript==
// @name         Gartic Phone Auto Draw
// @namespace    https://greasyfork.org/en/users/fdslalkad
// @version      1.1
// @description  Adds a small GUI for auto-drawing in Gartic Phone, including image upload and drag & drop
// @author       fdslalkad
// @match        *://garticphone.com/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    // Create GUI
    let gui = document.createElement('div');
    gui.style.position = 'fixed';
    gui.style.top = '10px';
    gui.style.right = '10px';
    gui.style.background = 'rgba(0,0,0,0.8)';
    gui.style.color = 'white';
    gui.style.padding = '10px';
    gui.style.borderRadius = '5px';
    gui.style.zIndex = '10000';
    gui.innerHTML = `
        <button id="autoDrawBtn">Auto Draw</button>
        <br>
        <input type="file" id="uploadImage" accept="image/*"><br>
        <input type="text" id="imageUrl" placeholder="Image URL">
        <button id="loadImageBtn">Load Image</button>
    `;
    document.body.appendChild(gui);

    // Auto Draw Function (Simple Example)
    function autoDraw(image) {
        let canvas = document.querySelector('canvas');
        if (!canvas) {
            alert('Canvas not found!');
            return;
        }
        let ctx = canvas.getContext('2d');
        ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
    }

    // Handle Image Upload
    document.getElementById('uploadImage').addEventListener('change', function(event) {
        let file = event.target.files[0];
        if (file) {
            let img = new Image();
            img.onload = () => autoDraw(img);
            img.src = URL.createObjectURL(file);
        }
    });

    // Handle Image URL Input
    document.getElementById('loadImageBtn').addEventListener('click', function() {
        let url = document.getElementById('imageUrl').value;
        if (url) {
            let img = new Image();
            img.crossOrigin = 'Anonymous';
            img.onload = () => autoDraw(img);
            img.src = url;
        }
    });

    // Drag & Drop Image Support
    document.addEventListener('dragover', function(event) {
        event.preventDefault();
    });

    document.addEventListener('drop', function(event) {
        event.preventDefault();
        let file = event.dataTransfer.files[0];
        if (file) {
            let img = new Image();
            img.onload = () => autoDraw(img);
            img.src = URL.createObjectURL(file);
        }
    });

    // Button Click Event (for placeholder drawing)
    document.getElementById('autoDrawBtn').addEventListener('click', function() {
        let canvas = document.querySelector('canvas');
        if (!canvas) {
            alert('Canvas not found!');
            return;
        }
        let ctx = canvas.getContext('2d');
        ctx.beginPath();
        ctx.arc(100, 100, 50, 0, Math.PI * 2);
        ctx.stroke();
    });
})();