ColorTubes/js/drawer.js

class Drawer
{
	#canvas;
	
	constructor(_padding, _scale)
	{
		this.padding = _padding;
		this.scale = _scale;
		
		this.#canvas = createCanvas(0, 0);
	}
	
	computeGameParams(_tubesNumbers, _tubeLevels)
	{
		let canvasWidth = _tubesNumbers * (this.scale + this.padding) + this.padding;
		let canvasHeight = 2 * this.padding + (_tubeLevels+1) * this.scale;
		
		resizeCanvas(canvasWidth, canvasHeight);
	}
	
	draw(game)
	{
		clear();

		this.drawTubes(this.padding, this.padding+this.scale, game);
	}

	drawTubes(x, y, game)
	{
		let tubeX = x;
		let tubeY = y;
		let selectionOffset = 0;
		
		for (let i = 0; i < game.tubesNumber(); i++)
		{
			let tube = game.tubeAt(i);
			selectionOffset = (tube == game.selectedTube() ? this.scale : 0);
			
			this.drawTube(tubeX, tubeY - selectionOffset, tube);
			tubeX += this.padding + this.scale;
		}
	}

	drawTube(x, y, tube)
	{
		let tubeLevels = tube.height();
		
		y += (tubeLevels-1) * this.scale;
		strokeWeight(2);
		
		for(let i = 0; i < tubeLevels; i++)
		{
			let layerY = y - i * this.scale;

			let color = tube.getColorAtLevel(i);
			color == null ? noFill() : fill(color);
			
			if (i > 0)
			{
				noStroke();
				rect(x, layerY, this.scale);
				stroke('black');
				line(x, layerY, x, layerY + this.scale);
				line(x + this.scale, layerY, x + this.scale, layerY + this.scale);
			}
			else
			{
				noStroke();
				rect(x, layerY, this.scale, this.scale/2);
				stroke('black');
				line(x, layerY, x, layerY + this.scale/2);
				line(x + this.scale, layerY, x + this.scale, layerY + this.scale/2);

				arc(x + this.scale/2, layerY + this.scale/2, this.scale, this.scale, 0, PI);
			}
		}
	}
	
	getTubeIdAt(x, y)
	{
		if (!this.isInboundsCanvas(x,y)) return -1;
		
		let idWithPadding = (x - this.padding) / (this.scale + this.padding);
		return idWithPadding % 1 > 1 - (this.padding / (this.scale + this.padding)) ? -1 : int(idWithPadding);
	}
	
	isInboundsCanvas(x, y)
	{
		return x >= this.padding
			&& y >= this.padding
			&& x < this.#canvas.width - this.padding
			&& y < this.#canvas.height - this.padding;
	}

}