Shows how to handle click events with GameCanvas.
Canvas will resize automatically if resize handling is enabled in the demo.
/**
* @demo Simple Click Handler
* @description Shows how to handle click events with GameCanvas.
* @tags interactive, click, events, basics
*/
import { GameCanvas } from "../src";
const gameCanvas = new GameCanvas("demo-canvas");
const coolColors = ['salmon', 'coral', 'navy', 'orange', 'teal', 'red', ' green', 'blue', 'indigo', 'violet', 'pink', 'purple']
gameCanvas.addClickHandler((event) => {
const { x, y } = event;
const color = coolColors[Math.floor(Math.random() * coolColors.length)];
gameCanvas.addDrawing(({ ctx }) => {
ctx.fillStyle = color;
ctx.fillRect(x - 25, y - 25, 50, 50);
});
});
gameCanvas.run();