neutral loading toasts

This commit is contained in:
AlecM33
2023-09-05 14:20:30 -04:00
parent b432c65d25
commit 817f6928df
6 changed files with 25 additions and 32 deletions

View File

@@ -262,7 +262,7 @@ export const HTMLFragments = {
<div class='game-player-role'></div>
</div>`,
INITIAL_GAME_DOM:
`<div id='game-title'></div>
`
<div id='client-container'>
<label for='client'>You</label>
<div id='client'>
@@ -273,6 +273,7 @@ export const HTMLFragments = {
<img alt="edit name" src="../../images/pencil.svg"/>
</button>
</div>
<div id='lobby-title' style="display:none;">Lobby</div>
<div id='game-state-container'></div>`,
// via https://loading.io/css/
SPINNER:

View File

@@ -506,6 +506,7 @@ function createEndGamePromptComponent (socket, stateBucket) {
div.querySelector('#end-game-button').addEventListener('click', (e) => {
e.preventDefault();
Confirmation('End the game?', () => {
toast('Ending...', 'neutral', true, false);
socket.emit(
SOCKET_EVENTS.IN_GAME_MESSAGE,
EVENT_IDS.END_GAME,
@@ -553,6 +554,7 @@ function renderPotentialMods (gameState, group, transferModHandlers, socket) {
if (e.type === 'click' || e.code === 'Enter') {
ModalManager.dispelModal('transfer-mod-modal', 'transfer-mod-modal-background');
Confirmation('Transfer moderator powers to \'' + member.name + '\'?', () => {
toast('Transferring...', 'neutral', true, false);
const transferPrompt = document.getElementById('transfer-mod-prompt');
if (transferPrompt !== null) {
transferPrompt.innerHTML = '';
@@ -562,19 +564,8 @@ function renderPotentialMods (gameState, group, transferModHandlers, socket) {
EVENT_IDS.TRANSFER_MODERATOR,
gameState.accessCode,
{ personId: member.id },
(err) => {
if (err) {
console.error(err);
socket.emit(
SOCKET_EVENTS.IN_GAME_MESSAGE,
EVENT_IDS.FETCH_GAME_STATE,
gameState.accessCode,
{ personId: gameState.client.cookie },
(gameState) => {
SharedStateUtil.gameStateAckFn(gameState, socket);
}
);
}
() => {
toast('Transferred!', 'success', true, true);
}
);
});

View File

@@ -24,25 +24,14 @@ export class Lobby {
return;
}
Confirmation('Start game and deal roles?', () => {
socket.timeout(5000).emit(
toast('Starting...', 'neutral', true, false);
socket.emit(
SOCKET_EVENTS.IN_GAME_MESSAGE,
EVENT_IDS.START_GAME,
stateBucket.currentGameState.accessCode,
null,
(err) => {
if (err) {
socket.emit(
SOCKET_EVENTS.IN_GAME_MESSAGE,
EVENT_IDS.FETCH_GAME_STATE,
stateBucket.currentGameState.accessCode,
{ personId: stateBucket.currentGameState.client.cookie },
(gameState) => {
SharedStateUtil.gameStateAckFn(gameState, socket);
}
);
} else {
this.removeStartGameFunctionalityIfPresent();
}
() => {
this.removeStartGameFunctionalityIfPresent();
}
);
});

View File

@@ -36,13 +36,14 @@ export const SharedStateUtil = {
).catch((res) => {
toast(res.content, 'error', true, true, 'medium');
});
toast('Resetting to Lobby...', 'neutral', true, false);
},
createReturnToLobbyButton: (stateBucket) => {
const returnToLobbyButton = document.createElement('button');
returnToLobbyButton.classList.add('app-button');
returnToLobbyButton.setAttribute('id', 'return-to-lobby-button');
returnToLobbyButton.innerText = 'Return to Lobby';
returnToLobbyButton.innerText = 'Reset to Lobby';
returnToLobbyButton.addEventListener('click', () => {
Confirmation('Return everyone to the Lobby?', () => {
SharedStateUtil.restartHandler(stateBucket, STATUS.LOBBY);

View File

@@ -146,6 +146,7 @@ function processGameState (
switch (currentGameState.status) {
case STATUS.LOBBY:
document.getElementById('lobby-title').style.display = 'flex';
const lobby = new Lobby('game-state-container', stateBucket, socket);
if (refreshPrompt) {
lobby.removeStartGameFunctionalityIfPresent();
@@ -167,6 +168,7 @@ function processGameState (
}
break;
case STATUS.IN_PROGRESS:
document.getElementById('lobby-title').style.display = 'none';
if (refreshPrompt) {
document.querySelector('#game-control-prompt')?.remove();
document.querySelector('#leave-game-prompt')?.remove();
@@ -177,6 +179,7 @@ function processGameState (
inProgressGame.setUserView(currentGameState.client.userType);
break;
case STATUS.ENDED: {
document.getElementById('lobby-title').style.display = 'none';
if (refreshPrompt) {
document.querySelector('#game-control-prompt')?.remove();
}

View File

@@ -578,8 +578,16 @@ h1 {
margin-left: 0.5em;
}
#game-title {
margin: 0 auto;
#lobby-title {
margin: 0.5em auto 0 auto;
font-family: 'signika-negative', sans-serif;
color: #d7d7d7;
font-size: 25px;
filter: drop-shadow(2px 2px 4px black);
border: 1px solid #46455299;
background: #4645525c;
padding: 2px 10px;
border-radius: 5px;
}
#client-container {