console.log("load main.js success!");
const canvas = document.getElementById("c");
const ctx = canvas.getContext("2d");

function render() {
	ctx.clearRect(0, 0, canvas.width, canvas.height);

	ctx.fillStyle = "#eee";
	ctx.fillRect(0, 0, canvas.width, canvas.height);

	ctx.beginPath();
	ctx.moveTo(20, 20);
	ctx.lineTo(200, 50);
	ctx.strokeStyle = 'blue';
	ctx.lineWidth = 4;
	ctx.stroke();

	ctx.font = "20px Arial";
	ctx.fillStyle = "black";
	ctx.fillText("Canvas", 20, 100);

	requestAnimationFrame(render);
}

render();

canvas.addEventListener("click", (e) => {
	const rect = canvas.getBoundingClientRect();
	const x = e.clientX - rect.left;
	const y = e.clientY - rect.top;
});