35 lines
1.2 KiB
TypeScript
35 lines
1.2 KiB
TypeScript
import { initKeyboardInput } from './game/input';
|
|
import { canvas, setupCanvas } from './game/canvas';
|
|
import { createPaddle } from './game/objects/paddle';
|
|
import { initGame } from './game/game';
|
|
import { createBall } from './game/objects/ball';
|
|
|
|
const playButton = document.getElementById('playButton');
|
|
const usernameInput = document.getElementById('username');
|
|
|
|
playButton?.addEventListener('click', () => {
|
|
const username = (usernameInput as HTMLInputElement)?.value;
|
|
if (!username) {
|
|
alert('Please enter a username');
|
|
return;
|
|
}
|
|
|
|
const colorPicker = document.getElementById('colorPicker');
|
|
const color = (colorPicker as HTMLInputElement)?.value;
|
|
|
|
if (document.getElementById('gameControls')) {
|
|
document.getElementById('gameControls')!.style.display = 'none';
|
|
}
|
|
const gameCanvas = document.getElementById('gameCanvas') as HTMLCanvasElement;
|
|
gameCanvas.style.display = "";
|
|
|
|
// Setup canvas and initialize input
|
|
setupCanvas();
|
|
initKeyboardInput();
|
|
|
|
// Create paddle and start game
|
|
const paddle = createPaddle(canvas.width / 2, canvas.height - 200, color, username);
|
|
const ball = createBall(canvas.width / 2, canvas.height / 2);
|
|
initGame(paddle, ball);
|
|
});
|
|
|