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