feat: reset button

1 files changed, 8 insertions, 5 deletions

diff --git a/index.js b/index.js
index ff30475..8dabb25 100644
--- a/index.js
+++ b/index.js
@@ -8,8 +8,8 @@ const canvasOffsetY = canvas.offsetTop;
 canvas.width = window.innerWidth - canvasOffsetX * 2;
 canvas.height = window.innerHeight - canvasOffsetY * 2;
 
-reset.style.top = canvasOffsetY + "px";
-reset.style.left = canvas.width - canvasOffsetX + "px";
+reset.style.top = canvasOffsetY * 2 + "px";
+reset.style.right = canvasOffsetX * 2 + "px";
 
 let isPainting = false;
 let lineWidth = 2;
@@ -26,7 +26,7 @@ const draw = (x, y) => {
     }
     
 
-    // ctx.lineTo(x - canvasOffsetX, y - canvasOffsetY);
+    ctx.lineTo(x - canvasOffsetX, y - canvasOffsetY);
     drawings.push({x : (x - canvasOffsetX)/canvas.width, y : (y - canvasOffsetY)/canvas.height});
     ctx.stroke();
     ctx.beginPath();
@@ -62,7 +62,7 @@ canvas.addEventListener('mousedown', (e) => {
 
 canvas.addEventListener('touchstart', (e) => {
     isPainting = true;
-    draw(e.targetTouches[0].clientX, e.targetTouches[0].clientY);
+    drawCross(e.targetTouches[0].clientX, e.targetTouches[0].clientY);
 });
 
 /* canvas.addEventListener('touchend', (e) => {
@@ -73,7 +73,10 @@ canvas.addEventListener('touchstart', (e) => {
 }); */
 
 // canvas.addEventListener('touchmove', (e) => draw(e.targetTouches[0].clientX, e.targetTouches[0].clientY));
-
+reset.onclick = () => {
+    drawings = [];
+    redrawCanvas();
+}
 function redrawCanvas() {
     canvas.width = window.innerWidth - canvasOffsetX * 2;
     canvas.height = window.innerHeight - canvasOffsetY * 2;