change language of restart button, add confirmation

This commit is contained in:
AlecM33
2022-12-13 17:24:05 -05:00
parent eb1baa0c3a
commit 5b94e535bc
2 changed files with 8 additions and 12 deletions

View File

@@ -230,7 +230,7 @@ export const HTMLFragments = {
<div id='game-player-list'></div>
</div>`,
RESTART_GAME_BUTTON:
'<button id=\'restart-game\' class=\'app-button\'>Restart Game 🔄</button>',
'<button id=\'restart-game\' class=\'app-button\'>Play Again 🔄</button>',
CREATE_GAME_DECK:
`<div id='deck-container'>
<div>

View File

@@ -3,6 +3,7 @@ import { HTMLFragments } from '../../front_end_components/HTMLFragments.js';
import { XHRUtility } from '../../utility/XHRUtility.js';
import { UserUtility } from '../../utility/UserUtility.js';
import { toast } from '../../front_end_components/Toast.js';
import { Confirmation } from '../../front_end_components/Confirmation';
export class Ended {
constructor (containerId, stateBucket, socket) {
@@ -10,12 +11,7 @@ export class Ended {
this.socket = socket;
this.container = document.getElementById(containerId);
this.container.innerHTML = HTMLFragments.END_OF_GAME_VIEW;
this.restartGameHandler = (e) => {
e.preventDefault();
const button = document.getElementById('restart-game');
button.removeEventListener('click', this.restartGameHandler);
button.classList.add('submitted');
button.innerText = 'Restarting...';
this.restartGameHandler = () => {
XHRUtility.xhr(
'/api/games/' + this.stateBucket.currentGameState.accessCode + '/restart',
'PATCH',
@@ -31,10 +27,6 @@ export class Ended {
toast('Game restarted!', 'success', true, true, 'medium');
})
.catch((res) => {
const button = document.getElementById('restart-game');
button.innerText = 'Restart Game 🔄';
button.classList.remove('submitted');
button.addEventListener('click', this.restartGameHandler);
toast(res.content, 'error', true, true, 'medium');
});
};
@@ -48,7 +40,11 @@ export class Ended {
const restartGameContainer = document.createElement('div');
restartGameContainer.innerHTML = HTMLFragments.RESTART_GAME_BUTTON;
const button = restartGameContainer.querySelector('#restart-game');
button.addEventListener('click', this.restartGameHandler);
button.addEventListener('click', () => {
Confirmation('Restart the game, dealing everyone new roles?', () => {
this.restartGameHandler();
});
});
document.getElementById('end-of-game-buttons').prepend(restartGameContainer);
}
this.renderPlayersWithRoleInformation();