// ==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)