diff --git a/client/src/modules/front_end_components/Confirmation.js b/client/src/modules/front_end_components/Confirmation.js
index 5ed4e44..cc2d3b4 100644
--- a/client/src/modules/front_end_components/Confirmation.js
+++ b/client/src/modules/front_end_components/Confirmation.js
@@ -1,6 +1,6 @@
import { toast } from './Toast.js';
-export const Confirmation = (message, onYes = null, innerHTML = false) => {
+export const Confirmation = (message, onYes = null, isDOMNode = false) => {
document.querySelector('#confirmation')?.remove();
document.querySelector('#confirmation-background')?.remove();
@@ -17,8 +17,8 @@ export const Confirmation = (message, onYes = null, innerHTML = false) => {
`;
- if (innerHTML) {
- confirmation.querySelector('#confirmation-message').innerHTML = message;
+ if (isDOMNode) {
+ confirmation.querySelector('#confirmation-message').prepend(message);
} else {
confirmation.querySelector('#confirmation-message').innerText = message;
}
diff --git a/client/src/modules/game_state/states/InProgress.js b/client/src/modules/game_state/states/InProgress.js
index f3e7e30..8b6d5d4 100644
--- a/client/src/modules/game_state/states/InProgress.js
+++ b/client/src/modules/game_state/states/InProgress.js
@@ -481,8 +481,9 @@ function renderPotentialMods (gameState, group, transferModHandlers, socket) {
container.setAttribute('tabindex', '0');
container.dataset.pointer = member.id;
container.innerHTML =
- '
' + member.name + '
' +
+ '' +
'' + member.userType + ' ' + globals.USER_TYPE_ICONS[member.userType] + '
';
+ container.querySelector('.potential-mod-name').innerText = member.name;
transferModHandlers[member.id] = (e) => {
if (e.type === 'click' || e.code === 'Enter') {
ModalManager.dispelModal('transfer-mod-modal', 'transfer-mod-modal-background');
diff --git a/client/src/modules/game_state/states/shared/SharedStateUtil.js b/client/src/modules/game_state/states/shared/SharedStateUtil.js
index 6b6cc3e..e2d52cb 100644
--- a/client/src/modules/game_state/states/shared/SharedStateUtil.js
+++ b/client/src/modules/game_state/states/shared/SharedStateUtil.js
@@ -133,18 +133,21 @@ export const SharedStateUtil = {
},
buildSpectatorList (spectators) {
+ const list = document.createElement('div');
if (spectators.length === 0) {
- return 'Nobody currently spectating.
';
- }
- let html = '';
- for (const spectator of spectators) {
- html += `
-
` + spectator.name + '
' +
- '
' + 'spectator' + globals.USER_TYPE_ICONS.spectator + `
-
`;
+ list.innerHTML = 'Nobody currently spectating.
';
+ } else {
+ for (const spectator of spectators) {
+ const spectatorEl = document.createElement('div');
+ spectatorEl.classList.add('spectator');
+ spectatorEl.innerHTML = '' +
+ '' + 'spectator' + globals.USER_TYPE_ICONS.spectator + '
';
+ spectatorEl.querySelector('.spectator-name').innerText = spectator.name;
+ list.appendChild(spectatorEl);
+ }
}
- return html;
+ return list;
},
setNumberOfSpectators: (number, el) => {