From 8e9ef5ba62b8bee028428384ad5666e245eb854c Mon Sep 17 00:00:00 2001 From: Mitja Felicijan Date: Sun, 17 Feb 2019 21:53:36 +0100 Subject: content update --- tools/draw/app.js | 72 ------------------------------------------------------- 1 file changed, 72 deletions(-) delete mode 100644 tools/draw/app.js (limited to 'tools/draw/app.js') diff --git a/tools/draw/app.js b/tools/draw/app.js deleted file mode 100644 index 4c73d75..0000000 --- a/tools/draw/app.js +++ /dev/null @@ -1,72 +0,0 @@ -window.addEventListener('load', function(evt) { - - let paintStyle = getComputedStyle(document.querySelector('section')); - let canvas = document.querySelector('canvas'); - let ctx = canvas.getContext('2d'); - - canvas.width = parseInt(paintStyle.getPropertyValue('width')); - canvas.height = parseInt(paintStyle.getPropertyValue('height')); - - var mouse = { - x: 0, - y: 0 - }; - - ctx.lineWidth = 3; - ctx.lineJoin = 'round'; - ctx.lineCap = 'round'; - ctx.strokeStyle = 'limegreen'; - - canvas.addEventListener('mousemove', function(e) { - mouse.x = e.pageX - this.offsetLeft; - mouse.y = e.pageY - this.offsetTop; - }, false); - - canvas.addEventListener('mousedown', function(e) { - ctx.beginPath(); - ctx.moveTo(mouse.x, mouse.y); - canvas.addEventListener('mousemove', onPaint, false); - }, false); - - canvas.addEventListener('mouseup', function() { - canvas.removeEventListener('mousemove', onPaint, false); - }, false); - - var onPaint = function() { - ctx.lineCap = 'round'; - ctx.lineTo(mouse.x, mouse.y); - ctx.stroke(); - }; - - - document.querySelectorAll('nav button').forEach(function(button, idx) { - - if (button.dataset.method == 'color') { - button.style.background = button.dataset.value; - } - - button.addEventListener('click', function(evt) { - switch (button.dataset.method) { - case 'color': - { - ctx.strokeStyle = button.dataset.value; - break; - } - case 'size': - { - ctx.lineWidth = parseInt(button.dataset.value); - break; - } - } - }); - - }); - - document.addEventListener('keydown', function(evt) { - if (evt.keyCode == 8) { - ctx.clearRect(0, 0, canvas.width, canvas.height); - } - console.log(evt.keyCode); - }, false); - -}); -- cgit v1.2.3