From ab26ce4074cd8756fbaac6965a10680be1c2e157 Mon Sep 17 00:00:00 2001 From: sigmasternchen Date: Tue, 29 Oct 2024 22:00:12 +0100 Subject: [PATCH] improve object model --- src/game/Banner.ts | 6 +++++- src/game/Game.ts | 8 +++----- src/game/Paddle.ts | 6 +++++- src/index.ts | 2 +- 4 files changed, 14 insertions(+), 8 deletions(-) diff --git a/src/game/Banner.ts b/src/game/Banner.ts index bed4359..e47404a 100644 --- a/src/game/Banner.ts +++ b/src/game/Banner.ts @@ -6,7 +6,7 @@ import {Position} from "./Position"; export class Banner { private readonly position: Position; private readonly banner: string; - public readonly element: HTMLElement; + private readonly element: HTMLElement; constructor(position: Position, banner: string) { this.position = position; @@ -27,6 +27,10 @@ export class Banner { this.element.setAttribute("src", image.src); }) } + + public setup(gameElement: HTMLElement): void { + gameElement.appendChild(this.element); + } } export const makeBanners = (numberOfBanners: number, positioning: (i: number) => Position) => diff --git a/src/game/Game.ts b/src/game/Game.ts index e04ac5b..d054f12 100644 --- a/src/game/Game.ts +++ b/src/game/Game.ts @@ -17,10 +17,8 @@ export class Game { return Promise.all(this.banners.map(banner => banner.load())).then(() => {}); } - public draw(): void { - this.banners.forEach(banner => { - this.root.appendChild(banner.element); - }); - this.root.appendChild(this.paddle.element); + public setup(): void { + this.banners.forEach(banner => banner.setup(this.root)); + this.paddle.setup(this.root); } } \ No newline at end of file diff --git a/src/game/Paddle.ts b/src/game/Paddle.ts index 89ef985..1d93a94 100644 --- a/src/game/Paddle.ts +++ b/src/game/Paddle.ts @@ -2,7 +2,7 @@ export class Paddle { private position: number; private size: number; - public readonly element: HTMLElement; + private readonly element: HTMLElement; constructor() { this.position = ((88 + 1) * 11 + 1) / 2; @@ -13,4 +13,8 @@ export class Paddle { this.element.style.left = this.position + "px"; this.element.style.width = this.size + "px"; } + + public setup(gameElement: HTMLElement): void { + gameElement.appendChild(this.element); + } } \ No newline at end of file diff --git a/src/index.ts b/src/index.ts index ba7c169..921c678 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,5 +3,5 @@ import {Game} from "./game/Game"; window.addEventListener("load", async () => { const game = new Game(document.getElementById("game")); await game.load(); - game.draw(); + game.setup(); }); \ No newline at end of file