Git_Mirror/Werewolf
1
0
Fork 0
mirror of https://github.com/AlecM33/Werewolf.git synced 2025-12-26 15:57:50 +01:00
Code Issues Packages Projects Releases Wiki Activity

cleaner styling, display start game prompt

Browse Source
This commit is contained in:
Alec
2021-11-16 22:42:44 -05:00
parent d9ae7db7b9
commit b6edc941fc
19 changed files with 320 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
client/modules/GameCreationStepManager.js
View File

@@ -247,12 +247,19 @@ function renderReviewAndCreateStep(containerId, stepNumber, game) {
div.setAttribute("id", "step-" + stepNumber);
div.innerHTML =
"<label for='mod-option'>Moderation</label>" +
"<div id='mod-option' class='review-option'></div>" +
"<label for='timer-option'>Timer</label>" +
"<div id='timer-option' class='review-option'></div>" +
"<label for='roles-option'>Game Deck</label>" +
"<div id='roles-option' class='review-option'></div>";
"<div>" +
"<label for='mod-option'>Moderation</label>" +
"<div id='mod-option' class='review-option'></div>" +
"</div>" +
"<div>" +
"<label for='timer-option'>Timer</label>" +
"<div id='timer-option' class='review-option'></div>" +
"</div>" +
"<div>" +
"<label for='roles-option'>Game Deck</label>" +
"<div id='roles-option' class='review-option'></div>" +
"</div>";
div.querySelector('#mod-option').innerText = game.hasDedicatedModerator
? "I will be the dedicated mod. Don't deal me a card."

10
client/modules/GameStateRenderer.js
View File

@@ -1,4 +1,5 @@
import {globals} from "../config/globals.js";
import { globals } from "../config/globals.js";
import { toast } from "./Toast.js";
export class GameStateRenderer {
constructor(gameState) {
@@ -30,9 +31,14 @@ export class GameStateRenderer {
renderLobbyHeader() {
let title = document.createElement("h1");
title.innerText = "Lobby";
document.body.prepend(title);
document.getElementById("game-title").appendChild(title);
let gameLinkContainer = document.getElementById("game-link");
gameLinkContainer.innerText = window.location;
gameLinkContainer.addEventListener('click', () => {
navigator.clipboard.writeText(gameLinkContainer.innerText).then(() => {
toast('Link copied!', 'success', true);
});
});
let copyImg = document.createElement("img");
copyImg.setAttribute("src", "../images/copy.svg");
gameLinkContainer.appendChild(copyImg);

4
client/modules/Templates.js
View File

@@ -20,5 +20,9 @@ export const templates = {
"<div id='lobby-footer'>" +
"<div id='game-deck'></div>" +
"</div>" +
"</div>",
START_GAME_PROMPT:
"<div id='start-game-prompt'>" +
"<button id='start-game-button'>Start Game</button>" +
"</div>"
}

2
client/modules/Toast.js
View File

@@ -7,7 +7,7 @@ export const toast = (message, type, positionAtTop = true) => {
function buildAndInsertMessageElement (message, type, positionAtTop) {
cancelCurrentToast();
let backgroundColor;
const position = positionAtTop ? 'top:4rem;' : 'bottom: 35px;';
const position = positionAtTop ? 'top:3rem;' : 'bottom: 35px;';
switch (type) {
case 'warning':
backgroundColor = '#fff5b1';

9
client/modules/UserUtility.js
View File

@@ -1,9 +1,14 @@
import { globals } from '../config/globals.js';
/*
we will use sessionStorage during local development to aid in testing, vs. localStorage for production.
sessionStorage does not persist across tabs, allowing developers to join a game as different players from different windows.
*/
export const UserUtility = {
createNewAnonymousUserId (force = true, environment) {
let newId, currentId;
if (environment === globals.ENVIRONMENT.LOCAL) {
currentId = sessionStorage.getItem(globals.PLAYER_ID_COOKIE_KEY);
} else {
@@ -23,7 +28,7 @@ export const UserUtility = {
},
setAnonymousUserId (id, environment) {
if (environment === globals.ENVIRONMENT.LOCAL) { // use sessionStorage for cookie during local development to aid in testing.
if (environment === globals.ENVIRONMENT.LOCAL) {
sessionStorage.setItem(globals.PLAYER_ID_COOKIE_KEY, id);
} else {
localStorage.setItem(globals.PLAYER_ID_COOKIE_KEY, id);
@@ -32,7 +37,7 @@ export const UserUtility = {
validateAnonUserSignature (environment) {
let userSig;
if (environment === globals.ENVIRONMENT.LOCAL) { // use sessionStorage for cookie during local development to aid in testing.
if (environment === globals.ENVIRONMENT.LOCAL) {
userSig = sessionStorage.getItem(globals.PLAYER_ID_COOKIE_KEY);
} else {
userSig = localStorage.getItem(globals.PLAYER_ID_COOKIE_KEY);