Greasy Fork is available in English.

Кастомные интструменты для toonio

Добавляет линии и лайнфиллер

// ==UserScript==
// @name         Кастомные интструменты для toonio
// @namespace    toonio tools
// @version      1.0
// @description  Добавляет линии и лайнфиллер
// @author       Nab#9255
// @match        *://toonio.ru/editor*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=toonio.ru
// @grant        GM_addStyle
// @license      MIT
// ==/UserScript==

setTimeout(() => {
    function MousePos(e, _canvas, _scale = 1, _translateX = 0, _translateY = 0)
    {
        let rect = _canvas.getBoundingClientRect();
        return {
            x: (e.clientX - rect.left) / (rect.right - rect.left) * (_canvas.width / _scale)  - _translateX / _scale,
            y: (e.clientY - rect.top)  / (rect.bottom - rect.top) * (_canvas.height / _scale) - _translateY / _scale
        };
    }
    let linebutton = document.createElement("button");
    linebutton.id = "linebutton";
    linebutton.classList.add("control");
    linebutton.title = "Линия";
    linebutton.innerHTML = `<span class="far fa-arrows-alt-h fa-fw" style="transform: rotate(-45deg) scalex(4.5);"></span>`;
    linebutton.addEventListener("mousedown", (()=> {
        toonio.SetTool(1001);
        toonio.drawWindow.locked = true;
        linebutton.classList.add("selected");
    }))
    let lineFillerbutton = document.createElement("button");
    lineFillerbutton.id = "lineFiller";
    lineFillerbutton.classList.add("control");
    lineFillerbutton.title = "Лайн филлер";
    lineFillerbutton.innerHTML = `<span class="far fa-arrows-alt-h fa-fw" style="transform: scaleX(4.5);"></span>`;
    lineFillerbutton.addEventListener("mousedown", (()=> {
        toonio.SetTool(1000);
        toonio.drawWindow.locked = true;
        lineFillerbutton.classList.add("selected");
    }))
    setInterval(() => {
        if(toonio.drawWindow.tool.t == 1000 && !toonio.drawWindow.helpTool && !toonio.isPlaying){
            toonio.drawWindow.locked = true;
            linebutton.classList.remove("selected");
            lineFillerbutton.classList.add("selected");
        } else if(toonio.drawWindow.tool.t == 1001 && !toonio.drawWindow.helpTool && !toonio.isPlaying) {
            toonio.drawWindow.locked = true;
            linebutton.classList.add("selected");
            lineFillerbutton.classList.remove("selected");
        } else {
            toonio.drawWindow.locked = false;
            linebutton.classList.remove("selected");
            lineFillerbutton.classList.remove("selected");
        }
    })
    let manual = document.querySelector("#manual");
    manual.parentNode.insertBefore(linebutton, manual.nextSibling)
    manual.parentNode.insertBefore(lineFillerbutton, manual.nextSibling)
    manual.remove();
    document.querySelector("#fullscreen").remove();
    let shift = false;
    document.addEventListener("keydown", ((e) => {
        if (e.code = "ShiftLeft") shift = true;
    }));
    document.addEventListener("keyup", ((e) => {
        if (e.code = "ShiftLeft") shift = false;
    }));
    let line = {
        width: 5,
        col: "#000000",
        cord: []
    }
    document.querySelector("#editor").addEventListener("mousedown", ((e) => {
        let cursor = MousePos(e, toonio.drawWindow.canvas, toonio.drawWindow.scale, toonio.drawWindow.translate.x, toonio.drawWindow.translate.y);
        let curFrame = toonio.layers[toonio.curLayer].frames[toonio.curFrame];
        let curLines = toonio.layers[toonio.curLayer].frames[toonio.curFrame].lines;
        let tool = toonio.drawWindow.tool;
        if (e.button == 0 && !toonio.drawWindow.helpTool){
            if(tool.t == 1000) {
                let curColor;
                for (let i in curLines) {
                    for (let j in curLines[i].p) {
                        if (Math.abs(curLines[i].p[j].x - cursor.x) <= curLines[i].d.w * toonio.drawWindow.scale && Math.abs(curLines[i].p[j].y - cursor.y) <= curLines[i].d.w * toonio.drawWindow.scale) {
                            if (shift) curColor = curLines[i].d.c;
                            curLines[i].d.c = tool.c;
                            break;
                        }
                    }
                }
                if (shift && curColor) {
                    for (let i in curLines) {
                        if (curLines[i].d.c == curColor) {
                            curLines[i].d.c = tool.c;
                        }
                    }
                }
                toonio.Undo();
                toonio.Redo();
            }
            if(tool.t == 1001) {
                md = true;
                line.width = toonio.drawWindow.tool.w;
                line.col = toonio.drawWindow.tool.c;
                line.cord.push({
                    x: cursor.x,
                    y: cursor.y
                });
            }
        }
    }));
    let md = false;
    document.querySelector("#editor").addEventListener("mousemove", ((e) => {
        if(md){
        let cursor = MousePos(e, toonio.drawWindow.canvas, toonio.drawWindow.scale, toonio.drawWindow.translate.x, toonio.drawWindow.translate.y);
        let ctx = canvas.getContext('2d');
            ctx.beginPath();
        ctx.moveTo(line.cord[0].x, line.cord[0].y);
        ctx.lineTo(cursor.x, cursor.y);
        ctx.strokeStyle = line.col;
        ctx.lineWidth = line.width;
        ctx.stroke();
        }
    }))
    document.querySelector("#editor").addEventListener("mouseup", ((e) => {
        if (e.button == 0 && !toonio.drawWindow.helpTool && toonio.drawWindow.tool.t == 1001){
            let curLines = toonio.layers[toonio.curLayer].frames[toonio.curFrame].lines;
            md = false;
            let cursor = MousePos(e, toonio.drawWindow.canvas, toonio.drawWindow.scale, toonio.drawWindow.translate.x, toonio.drawWindow.translate.y);
            line.cord.push({
                x: cursor.x + (cursor.x - line.cord[0].x),
                y: cursor.y + (cursor.y - line.cord[0].y)
            })
            curLines.push({
                "d": {
                    "t": 1,
                    "w": line.width,
                    "c": line.col
                },
                "p": line.cord
            });
            toonio.Undo();
            toonio.Redo();
            line = {
                width: 5,
                col: "#000000",
                cord: []
            }
        }
    }));

},3000)