diff options
Diffstat (limited to 'src/main.js')
| -rw-r--r-- | src/main.js | 30 |
1 files changed, 20 insertions, 10 deletions
diff --git a/src/main.js b/src/main.js index d618d05..4527a90 100644 --- a/src/main.js +++ b/src/main.js @@ -1,27 +1,37 @@ +import Terrain from './Terrain.js'; import Canvas from './Canvas.js'; const $ = id => document.getElementById(id) window.onload = () => { const canvas = new Canvas('root'); + const terrain = new Terrain(); + + const BRUSH_RADIUS = 80; + let brushing = false; + canvas.onMouseDown = e => { + if (e.button == 0) brushing = true; + }; + canvas.onMouseUp = e => { + if (e.button == 0) brushing = false; + }; const pos = canvas.mouse.drawingPos; - canvas.onMouseMove = () => canvas.draw(); + canvas.onMouseMove = () => { + if (brushing) + terrain.applyBrush(pos.x, pos.y, (pt, strength) => { + pt.hue += 10 * strength; + }, 1, canvas.pixelsToUnits(BRUSH_RADIUS)); + canvas.draw(); + }; canvas.onDraw = ct => { - ct.fillStyle = '#f00'; - ct.fillRect(0, 0, 1/3, 1/3); - ct.fillStyle = '#0f0'; - ct.fillRect(2/3, 0, 1/3, 1/3); - ct.fillStyle = '#ff0'; - ct.fillRect(0, 2/3, 1/3, 1/3); - ct.fillStyle = '#00f'; - ct.fillRect(2/3, 2/3, 1/3, 1/3); + terrain.renderGrid(ct); ct.strokeStyle = '#fff'; ct.lineWidth = canvas.pixelsToUnits(1); ct.beginPath(); - ct.arc(pos.x, pos.y, canvas.pixelsToUnits(30), 0, 2*Math.PI); + ct.arc(pos.x, pos.y, canvas.pixelsToUnits(BRUSH_RADIUS), 0, 2*Math.PI); ct.closePath(); ct.stroke(); }; |