Show game list, debug logins
This commit is contained in:
parent
9d9c8ad71f
commit
a2c2893499
@ -6,6 +6,20 @@ var playerName = ""
|
|||||||
var debugSessionToken = null
|
var debugSessionToken = null
|
||||||
const debugMode = true // Does not load session token, to allow multiple players per browser
|
const debugMode = true // Does not load session token, to allow multiple players per browser
|
||||||
|
|
||||||
|
function showDebugLogins() {
|
||||||
|
document.getElementById("login-window-inner").innerHTML +=
|
||||||
|
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('a')\">Player A</button>" +
|
||||||
|
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('b')\">Player B</button>" +
|
||||||
|
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('c')\">Player C</button>" +
|
||||||
|
"<button class=\"login-buttons standard-button\" onclick=\"loginDebugUser('d')\">Player D</button>"
|
||||||
|
}
|
||||||
|
|
||||||
|
function loginDebugUser(name) {
|
||||||
|
document.getElementById("user-name").value = name
|
||||||
|
document.getElementById("user-pwd").value = name
|
||||||
|
loginUser()
|
||||||
|
}
|
||||||
|
|
||||||
function setDisplayStyle(id, style) {
|
function setDisplayStyle(id, style) {
|
||||||
document.getElementById(id).style.display = style
|
document.getElementById(id).style.display = style
|
||||||
}
|
}
|
||||||
@ -197,7 +211,13 @@ function updateTableInfo(table) {
|
|||||||
setInfoForPlayer(table.player, "bottom")
|
setInfoForPlayer(table.player, "bottom")
|
||||||
if (table.player.selectsGame) {
|
if (table.player.selectsGame) {
|
||||||
setActionsForOwnPlayer(table.playableGames)
|
setActionsForOwnPlayer(table.playableGames)
|
||||||
|
showAvailableGames([])
|
||||||
} else {
|
} else {
|
||||||
|
if (table.player.active) {
|
||||||
|
showAvailableGames(table.playableGames)
|
||||||
|
} else {
|
||||||
|
showAvailableGames([])
|
||||||
|
}
|
||||||
setActionsForOwnPlayer(table.player.actions)
|
setActionsForOwnPlayer(table.player.actions)
|
||||||
}
|
}
|
||||||
if (table.hasOwnProperty("playerLeft")) {
|
if (table.hasOwnProperty("playerLeft")) {
|
||||||
@ -309,3 +329,14 @@ function performAction(action) {
|
|||||||
performPlayerActionRequest(token, action)
|
performPlayerActionRequest(token, action)
|
||||||
// TODO: Handle errors and success
|
// TODO: Handle errors and success
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function showAvailableGames(games) {
|
||||||
|
var len = games.length
|
||||||
|
var html = ""
|
||||||
|
for (let i = 0; i < len; i += 1) {
|
||||||
|
const game = games[i]
|
||||||
|
const content = textForAction(game)
|
||||||
|
html += "<div class=\"standard-button available-game\">" + content + "</div>"
|
||||||
|
}
|
||||||
|
document.getElementById("available-games-list").innerHTML = html
|
||||||
|
}
|
@ -112,6 +112,9 @@ function deletePlayerAccount() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function loadExistingSession() {
|
function loadExistingSession() {
|
||||||
|
if (debugMode) {
|
||||||
|
showDebugLogins()
|
||||||
|
}
|
||||||
const token = getSessionToken()
|
const token = getSessionToken()
|
||||||
if (token == null) {
|
if (token == null) {
|
||||||
showBlankLogin()
|
showBlankLogin()
|
||||||
|
@ -53,6 +53,7 @@
|
|||||||
<div id="table-player-name-left">Player 4</div>
|
<div id="table-player-name-left">Player 4</div>
|
||||||
<div id="table-player-state-left" class="player-connection-state">Offline</div>
|
<div id="table-player-state-left" class="player-connection-state">Offline</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="available-games-list"></div>
|
||||||
</div>
|
</div>
|
||||||
<div id="action-bar-centering">
|
<div id="action-bar-centering">
|
||||||
<div id="action-bar"></div>
|
<div id="action-bar"></div>
|
||||||
|
@ -11,6 +11,7 @@
|
|||||||
--secondary-text-color: rgb(27, 27, 27);
|
--secondary-text-color: rgb(27, 27, 27);
|
||||||
--card-color: rgb(255,255,255);
|
--card-color: rgb(255,255,255);
|
||||||
--alert-color: rgb(255,0,0);
|
--alert-color: rgb(255,0,0);
|
||||||
|
--game-type-color: rgb(100, 100, 100);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Style all input fields */
|
/* Style all input fields */
|
||||||
@ -270,20 +271,6 @@ body {
|
|||||||
font-size: small;
|
font-size: small;
|
||||||
}
|
}
|
||||||
|
|
||||||
#table-players {
|
|
||||||
display: none;
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
width: 649px;
|
|
||||||
height: 409px;
|
|
||||||
grid-template-columns: 200px 71px 36px 35px 36px 71px 200px;
|
|
||||||
grid-template-rows: 111px 76px 35px 76px 111px;
|
|
||||||
column-gap: 0px;
|
|
||||||
row-gap: 0px;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
#action-bar-centering {
|
#action-bar-centering {
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -298,31 +285,24 @@ body {
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
|
||||||
#action-buttons {
|
|
||||||
grid-column: 7;
|
|
||||||
grid-row: 4 / span 2;
|
|
||||||
width: 200px;
|
|
||||||
height: 187px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action-button {
|
.action-button {
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding-left: 16px;
|
padding-left: 16px;
|
||||||
padding-right: 16px;
|
padding-right: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.action-button-container {
|
#table-players {
|
||||||
height: 40px;
|
display: none;
|
||||||
width: 160px;
|
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
margin-left: 40px;
|
margin-left: auto;
|
||||||
}
|
margin-right: auto;
|
||||||
|
width: 949px;
|
||||||
#action-button-spacer {
|
height: 409px;
|
||||||
height: 37px;
|
grid-template-columns: 150px 200px 71px 36px 35px 36px 71px 200px 150px;
|
||||||
width: 100%;
|
grid-template-rows: 111px 76px 35px 76px 111px;
|
||||||
background-color: var(--standard-background);
|
column-gap: 0px;
|
||||||
border: none;
|
row-gap: 0px;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-card {
|
.table-card {
|
||||||
@ -332,31 +312,31 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#table-player-card-bottom {
|
#table-player-card-bottom {
|
||||||
grid-column: 3 / span 3;
|
grid-column: 4 / span 3;
|
||||||
grid-row: 4 / span 2;
|
grid-row: 4 / span 2;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
}
|
}
|
||||||
|
|
||||||
#table-player-card-left {
|
#table-player-card-left {
|
||||||
grid-column: 2 / span 2;
|
grid-column: 3 / span 2;
|
||||||
grid-row: 2 / span 3;
|
grid-row: 2 / span 3;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
#table-player-card-top {
|
#table-player-card-top {
|
||||||
grid-column: 3 / span 3;
|
grid-column: 4 / span 3;
|
||||||
grid-row: 1 / span 2;
|
grid-row: 1 / span 2;
|
||||||
z-index: 4;
|
z-index: 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
#table-player-card-right {
|
#table-player-card-right {
|
||||||
grid-column: 5 / span 2;
|
grid-column: 6 / span 2;
|
||||||
grid-row: 2 / span 3;
|
grid-row: 2 / span 3;
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
}
|
}
|
||||||
|
|
||||||
#table-player-info-bottom {
|
#table-player-info-bottom {
|
||||||
grid-column: 1 / span 2;
|
grid-column: 2 / span 2;
|
||||||
grid-row: 5;
|
grid-row: 5;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
@ -365,7 +345,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#table-player-info-left {
|
#table-player-info-left {
|
||||||
grid-column: 1;
|
grid-column: 2;
|
||||||
grid-row: 3;
|
grid-row: 3;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
@ -373,7 +353,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#table-player-info-top {
|
#table-player-info-top {
|
||||||
grid-column: 1 / span 2;
|
grid-column: 2 / span 2;
|
||||||
grid-row: 1;
|
grid-row: 1;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
@ -382,7 +362,7 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#table-player-info-right {
|
#table-player-info-right {
|
||||||
grid-column: 7;
|
grid-column: 8;
|
||||||
grid-row: 3;
|
grid-row: 3;
|
||||||
font-size: large;
|
font-size: large;
|
||||||
margin-left: 15px;
|
margin-left: 15px;
|
||||||
@ -393,6 +373,20 @@ body {
|
|||||||
color: var(--alert-color);
|
color: var(--alert-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#available-games-list {
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row: 1 / span 5;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.available-game {
|
||||||
|
margin-top: 5px;
|
||||||
|
padding-left: 16px;
|
||||||
|
padding-right: 16px;
|
||||||
|
background-color: var(--game-type-color);
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
#player-cards {
|
#player-cards {
|
||||||
display: none;
|
display: none;
|
||||||
margin-left: auto;
|
margin-left: auto;
|
||||||
|
Loading…
Reference in New Issue
Block a user