fix failure to attach event listener

This commit is contained in:
AlecM33
2021-12-29 15:47:46 -05:00
parent 94a6ac595b
commit 9ba1cff82c
4 changed files with 40 additions and 29 deletions

View File

@@ -30,7 +30,7 @@ export class GameStateRenderer {
}
let playerCount = this.stateBucket.currentGameState.people.length;
document.querySelector("label[for='lobby-players']").innerText =
"People (" + playerCount + "/" + getGameSize(this.stateBucket.currentGameState.deck) + " Players)";
"Participants (" + playerCount + "/" + getGameSize(this.stateBucket.currentGameState.deck) + " Players)";
}
renderLobbyHeader() {
@@ -92,19 +92,7 @@ export class GameStateRenderer {
}
renderModeratorView() {
let div = document.createElement("div");
div.innerHTML = templates.END_GAME_PROMPT;
div.querySelector("#end-game-button").addEventListener('click', (e) => {
e.preventDefault();
if (confirm("End the game?")) {
this.socket.emit(
globals.COMMANDS.END_GAME,
this.stateBucket.currentGameState.accessCode
);
}
});
document.getElementById("game-content").appendChild(div);
createEndGamePromptComponent(this.socket, this.stateBucket);
let modTransferButton = document.getElementById("mod-transfer-button");
modTransferButton.addEventListener(
@@ -121,9 +109,7 @@ export class GameStateRenderer {
}
renderTempModView() {
let div = document.createElement("div");
div.innerHTML = templates.END_GAME_PROMPT;
document.body.appendChild(div);
createEndGamePromptComponent(this.socket, this.stateBucket)
renderPlayerRole(this.stateBucket.currentGameState);
this.renderPlayersWithNoRoleInformationUnlessRevealed(true);
@@ -463,3 +449,18 @@ function removeExistingPlayerElements(killPlayerHandlers, revealRoleHandlers) {
el.remove();
});
}
function createEndGamePromptComponent(socket, stateBucket) {
let div = document.createElement("div");
div.innerHTML = templates.END_GAME_PROMPT;
div.querySelector("#end-game-button").addEventListener('click', (e) => {
e.preventDefault();
if (confirm("End the game?")) {
socket.emit(
globals.COMMANDS.END_GAME,
stateBucket.currentGameState.accessCode
);
}
});
document.getElementById("game-content").appendChild(div);
}

View File

@@ -190,7 +190,7 @@ input {
align-items: center;
justify-content: center;
position: fixed;
z-index: 1000;
z-index: 55000;
padding: 10px;
border-radius: 3px;
font-family: 'signika-negative', sans-serif;
@@ -218,6 +218,7 @@ input {
background-color: #333243;
border-bottom: 2px solid #57566a;
height: 51px;
z-index: 53000;
}
#desktop-links > a:nth-child(1), #mobile-links a:nth-child(1) {

View File

@@ -45,7 +45,7 @@
flex-wrap: wrap;
display: flex;
width: 95%;
margin: 1em auto 85px auto;
margin: 1em auto 100px auto;
}
#game-state-container h2 {
@@ -278,6 +278,8 @@ h1 {
min-width: 5em;
display: flex;
justify-content: center;
align-items: center;
height: 43px;
}
#game-timer.low {
@@ -580,6 +582,7 @@ label[for='moderator'] {
border: 2px transparent;
border-radius: 3px;
color: #d7d7d7;
font-family: signika-negative, sans-serif;
}
.make-mod-button:hover {
@@ -663,7 +666,7 @@ label[for='moderator'] {
padding: 10px 10px 0 10px;
border-radius: 3px;
min-height: 25em;
max-width: 25em;
max-width: 35em;
min-width: 17em;
margin-top: 1em;
}
@@ -711,6 +714,7 @@ label[for='moderator'] {
#game-timer {
font-size: 30px;
height: 38px;
}
#players-alive-label {