Code Injector for sssh coding platform (Draggable)

A draggable script to insert code into the sssh computer science platform code editor.
줄 바꿈
// ==UserScript==
// @name         Code Injector for sssh coding platform (Draggable)
// @match        *http://course.sssh.tp.edu.tw:8080/*
// @grant        none
// @author       HarvyLiu
// @license      MIT
// @description  A draggable script to insert code into the sssh computer science platform code editor.
// @version 0.0.1.20260224144310
// @namespace https://greasyfork.org/users/1108860
// ==/UserScript==

(function() {
    'use strict';

    // 1. Create the UI Container
    const container = document.createElement('div');
    container.style = `
        position: fixed;
        top: 10px;
        right: 10px;
        z-index: 9999;
        background: #333;
        padding: 10px;
        border-radius: 8px;
        display: flex;
        flex-direction: column;
        gap: 5px;
        border: 1px solid #555;
        cursor: move; 
        user-select: none;
    `;

    // 2. Drag Logic
    let isDragging = false;
    let offsetX, offsetY;

    container.addEventListener('mousedown', (e) => {
        // Only allow dragging if clicking the container itself (not the textarea/button)
        if (e.target === container) {
            isDragging = true;
            offsetX = e.clientX - container.getBoundingClientRect().left;
            offsetY = e.clientY - container.getBoundingClientRect().top;
        }
    });

    document.addEventListener('mousemove', (e) => {
        if (isDragging) {
            // Calculate new position
            let x = e.clientX - offsetX;
            let y = e.clientY - offsetY;
            
            // Set the container position
            container.style.left = x + 'px';
            container.style.top = y + 'px';
            container.style.right = 'auto'; // Remove the initial 'right' property
        }
    });

    document.addEventListener('mouseup', () => {
        isDragging = false;
    });

    // 3. Create the Text Area
    const textArea = document.createElement('textarea');
    textArea.placeholder = "Paste your C++ code here...";
    textArea.style = "width:250px; height:150px; background:#1e1e1e; color:#0f0; border:1px solid #444; font-family:monospace; font-size:12px; cursor: text;";

    // 4. Create the Button
    const btn = document.createElement('button');
    btn.innerText = "Inject to Editor";
    btn.style = "background:#007bff; color:white; border:none; padding:5px; cursor:pointer; font-weight:bold;";

    // 5. Injection Logic
    btn.onclick = () => {
        try {
            const editorEl = document.querySelector('.ace_editor');
            if (editorEl) {
                const editor = ace.edit(editorEl);
                editor.setValue(textArea.value);
                alert("Code Injected!");
            } else {
                alert("Editor not found!");
            }
        } catch (e) {
            alert("Error: " + e.message);
        }
    };

    // 6. Add to page
    container.appendChild(textArea);
    container.appendChild(btn);
    document.body.appendChild(container);
})();