import { gameSize, empty, p1Color, p2Color } from './constants';
import { State, GameObject } from './interfaces';
const createElem = (gameObject: GameObject) => {
const elem = document.createElement('div');
elem.style.display = 'inline-block';
elem.style.marginLeft = '10px';
elem.style.height = '6px';
elem.style.width = '6px';
elem.style.color = gameObject.c;
elem.innerText = gameObject === empty ? ' ' : gameObject.g;
const paintPlayerScore = (score: number, color: string) => {
const scoreElem = document.createElement('span');
scoreElem.innerHTML = `P1: ${score} `;
scoreElem.style.color = color;
document.body.appendChild(scoreElem);
const paintScores = (state: State) => {
document.body.innerHTML = 'Scores: ';
paintPlayerScore(state.players[0].s, p1Color);
paintPlayerScore(state.players[1].s, p2Color);
document.body.innerHTML += 'This game requires 2 players :)';
document.body.innerHTML += '<br/>';
document.body.innerHTML += 'Player 1 controls: wsad, fire: c';
document.body.innerHTML += '<br/>';
document.body.innerHTML += 'Player 2 controls: ikjl, fire: n';
.map(_ => Array(gameSize).fill(empty));
const paintGame = (state: State) => {
const game = emptyGame();
state.players.forEach(p => (game[p.x][p.y] = { g: p.g, c: p.c }));
state.shots.forEach(s => (game[s.x][s.y] = { g: '*', c: 'black' }));
const rowContainer = document.createElement('div');
row.forEach(col => rowContainer.appendChild(createElem(col)));
document.body.appendChild(rowContainer);
export const paint = (state: State) => {
document.body.innerHTML += '<br/>';