moved logic to canvas-controller.js; log cleanup; prep for load/save logic
This commit is contained in:
@@ -0,0 +1,31 @@
|
||||
const resetCanvasState = () => {
|
||||
resetRotation();
|
||||
resetCanvasBrush();
|
||||
clearCanvas();
|
||||
}
|
||||
|
||||
const resetRotation = () => { Painter.rotation = 0; }
|
||||
const clearCanvas = () => { Painter.canvasContext.clearRect(0, 0, canvas.width, canvas.height); }
|
||||
|
||||
const resetCanvasBrush = () => {
|
||||
setDefaultBrushSize();
|
||||
setDefaultBrushColor();
|
||||
setBrushToCenter();
|
||||
}
|
||||
|
||||
const setDefaultBrushSize = () => {
|
||||
Painter.brushSize = BRUSH_SIZE;
|
||||
Painter.canvasContext.lineWidth = BRUSH_SIZE;
|
||||
}
|
||||
|
||||
const setDefaultBrushColor = () => {
|
||||
Painter.brushColor = BRUSH_COLOR;
|
||||
Painter.canvasContext.fillStyle = BRUSH_COLOR;
|
||||
Painter.canvasContext.strokeStyle = BRUSH_COLOR;
|
||||
}
|
||||
|
||||
const setBrushToCenter = () => {
|
||||
Painter.x1 = Painter.canvas.width / 2
|
||||
Painter.y1 = Painter.canvas.height / 2
|
||||
Painter.canvasContext.moveTo( Painter.x1, Painter.y1 );
|
||||
}
|
||||
@@ -3,11 +3,7 @@ class BaseScriptElement extends HTMLElement {
|
||||
constructor() { super(); }
|
||||
|
||||
connectedCallback() {
|
||||
this.innerHTML = `
|
||||
<li>
|
||||
<label>${this.prefix}</label>
|
||||
</li>
|
||||
`;
|
||||
this.innerHTML = `<li> <label>${this.prefix}</label> </li>`;
|
||||
}
|
||||
|
||||
action(...args) { console.log("Hello, World!"); }
|
||||
@@ -56,7 +52,6 @@ class RepeatElement extends BaseInputScriptElement {
|
||||
|
||||
action(Painter) {
|
||||
for (let i = 0; i < this.value; i++) {
|
||||
console.log(Painter.rotation)
|
||||
for (const elm of this.children) {
|
||||
elm.action(Painter);
|
||||
}
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
const dragStartHandler = (eve) => {
|
||||
draggedElm = eve.target;
|
||||
console.debug("Node: ", draggedElm);
|
||||
eve.dataTransfer.setData("text", eve.target.tagName.toLowerCase());
|
||||
}
|
||||
|
||||
@@ -38,15 +37,6 @@ clearBttn.onclick = (eve) => {
|
||||
clearCanvas();
|
||||
}
|
||||
|
||||
saveBttn.onclick = (eve) => {
|
||||
console.log("Save");
|
||||
}
|
||||
|
||||
loadBttn.onclick = (eve) => {
|
||||
console.log("Load");
|
||||
}
|
||||
|
||||
runBttn.onclick = (eve) => {
|
||||
console.log("Run");
|
||||
runScript();
|
||||
}
|
||||
saveBttn.onclick = (eve) => { saveScript(); }
|
||||
loadBttn.onclick = (eve) => { loadScript; }
|
||||
runBttn.onclick = (eve) => { runScript(); }
|
||||
|
||||
@@ -4,46 +4,17 @@ const setupScriptRunner = () => {
|
||||
Painter.canvasContext = canvasContext;
|
||||
}
|
||||
|
||||
const saveScript = () => {
|
||||
console.log("Save");
|
||||
}
|
||||
|
||||
const loadScript = () => {
|
||||
console.log("Load");
|
||||
}
|
||||
|
||||
const runScript = () => {
|
||||
resetCanvasState();
|
||||
for (const elm of script.children) {
|
||||
elm.action(Painter);
|
||||
}
|
||||
}
|
||||
|
||||
const resetCanvasState = () => {
|
||||
resetRotation();
|
||||
resetCanvasBrush();
|
||||
clearCanvas();
|
||||
}
|
||||
|
||||
const resetCanvasBrush = () => {
|
||||
setDefaultBrushSize();
|
||||
setDefaultBrushColor();
|
||||
setBrushToCenter();
|
||||
}
|
||||
|
||||
const setDefaultBrushSize = () => {
|
||||
Painter.brushSize = BRUSH_SIZE;
|
||||
Painter.canvasContext.lineWidth = BRUSH_SIZE;
|
||||
}
|
||||
|
||||
const setDefaultBrushColor = () => {
|
||||
Painter.brushColor = BRUSH_COLOR;
|
||||
Painter.canvasContext.fillStyle = BRUSH_COLOR;
|
||||
Painter.canvasContext.strokeStyle = BRUSH_COLOR;
|
||||
}
|
||||
|
||||
const setBrushToCenter = () => {
|
||||
Painter.x1 = Painter.canvas.width / 2
|
||||
Painter.y1 = Painter.canvas.height / 2
|
||||
Painter.canvasContext.moveTo( Painter.x1, Painter.y1 );
|
||||
}
|
||||
|
||||
const clearCanvas = () => {
|
||||
Painter.canvasContext.clearRect(0, 0, canvas.width, canvas.height);
|
||||
}
|
||||
|
||||
const resetRotation = () => {
|
||||
Painter.rotation = 0;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user