diff options
| -rw-r--r-- | index.js | 13 |
1 files changed, 8 insertions, 5 deletions
@@ -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; |
