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 = () => {
		if (brushing)
			terrain.applyBrush(pos.x, pos.y, (pt, strength) => {
				pt.hue += 10 * strength;		
			}, 1, canvas.pixelsToUnits(BRUSH_RADIUS));
		canvas.draw();
	};
	
	canvas.onDraw = ct => {
		terrain.renderGrid(ct);

		ct.strokeStyle = '#fff';
		ct.lineWidth = canvas.pixelsToUnits(1);
		ct.beginPath();
		ct.arc(pos.x, pos.y, canvas.pixelsToUnits(BRUSH_RADIUS), 0, 2*Math.PI);
		ct.closePath();
		ct.stroke();
	};
	canvas.draw();
}