manuth/ConnectForce
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Render game using SJDON

Browse source
This commit is contained in:
Manuel Thalmann 2022-12-15 00:43:15 +01:00
parent 2aa9bf5b4b
commit 399fa7257c
No known key found for this signature in database
GPG key ID: 5FD9AD3CCDDBD27B
1 changed files with 42 additions and 44 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

86
packages/game/src/js/Game.js
View file

@ -1,5 +1,6 @@
import { Constants } from "./Constants.js"; import { Constants } from "./Constants.js";
import { elt } from "./elt.js"; import { elt } from "./elt.js";
import { render } from "./SJDON.js";
import { State } from "./State.js"; import { State } from "./State.js";
/** /**
@ -145,55 +146,52 @@ export class Game
let board = this.#board; let board = this.#board;
board.innerHTML = ""; board.innerHTML = "";
for (let y = 0; y < Game.#height; y++) render(
{ [
for (let x = 0; x < Game.#width; x++) "div",
{ ...this.board.flatMap(
/** @type {Node[]} */ (row, y) =>
let children = []; {
let playerId = this.board[y][x]; return row.map(
(cell, x) =>
if (playerId !== "")
{
children.push(
elt(
"div",
{ {
class: `piece ${Constants.PLAYER_NAMES[playerId]}` return /** @type {NodeDescriptor} */ ([
})); "div",
} {
className: "field",
onclick: () =>
{
if (this.addChip(x, y))
{
this.state.turnCount++;
this.draw();
}
}
},
...(
cell !== "" ?
[
/** @type {NodeDescriptor} */ (["div", { className: `piece ${Constants.PLAYER_NAMES[cell]}` }])
] :
[])
]);
});
}),
["div", { style: "clear: both;" }]
],
board);
let field = elt( this.#log.innerHTML = "";
"div",
{
class: "field"
},
...children);
field.onclick = () => render(
{ [
if (this.addChip(x, y))
{
this.state.turnCount++;
this.draw();
}
};
board.appendChild(field);
}
}
board.appendChild(
elt(
"div", "div",
{ {
style: "clear: both;" className: this.state.currentPlayer
})); },
`It's player "${Constants.PLAYER_NAMES[this.state.currentPlayer]}"s turn`
this.#log.className = ""; ],
this.#log.classList.add(this.state.currentPlayer); this.#log);
this.#log.innerHTML = "";
this.#log.textContent = `It's player "${Constants.PLAYER_NAMES[this.state.currentPlayer]}"s turn`;
} }
/** /**