mirror of
https://github.com/sigmasternchen/88x31breakout
synced 2025-03-15 07:59:00 +00:00
improve object model
This commit is contained in:
parent
efc8119c94
commit
ab26ce4074
4 changed files with 14 additions and 8 deletions
|
@ -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) =>
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
|
@ -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);
|
||||
}
|
||||
}
|
|
@ -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();
|
||||
});
|
Loading…
Reference in a new issue