summaryrefslogtreecommitdiff
path: root/scripts/gui
diff options
context:
space:
mode:
authorKyle Gunger <kgunger12@gmail.com>2022-07-24 23:00:59 -0400
committerKyle Gunger <kgunger12@gmail.com>2022-07-24 23:00:59 -0400
commit7abeb4a35a0105b94e599de9970404c98790b4d9 (patch)
tree0cbd81329df21fcdbc5a896a0711657fc60958a1 /scripts/gui
parent50a1c6f8432b541d84a1326ae8515589440a3804 (diff)
Clean up game element
Diffstat (limited to 'scripts/gui')
-rw-r--r--scripts/gui/chat.js2
-rw-r--r--scripts/gui/input.js8
-rw-r--r--scripts/gui/lobby.js49
-rw-r--r--scripts/gui/table.js3
4 files changed, 49 insertions, 13 deletions
diff --git a/scripts/gui/chat.js b/scripts/gui/chat.js
index 7cd1ae2..90259e2 100644
--- a/scripts/gui/chat.js
+++ b/scripts/gui/chat.js
@@ -1,5 +1,7 @@
'use strict';
+const CHAT_RPC = ["addChannel", "recieveMessage", "deleteChannel"]
+
class Chat {
constructor(e, soc)
{
diff --git a/scripts/gui/input.js b/scripts/gui/input.js
index 0e0c7ba..032d168 100644
--- a/scripts/gui/input.js
+++ b/scripts/gui/input.js
@@ -48,6 +48,14 @@ class MakeInput {
return el;
}
+ static passwordInput (value, placeholder)
+ {
+ let el = MakeInput.createInput("password");
+ el.setAttribute("placeholder", placeholder);
+ el.value = value;
+ return el;
+ }
+
static numberInput (value)
{
let el = MakeInput.createInput("number");
diff --git a/scripts/gui/lobby.js b/scripts/gui/lobby.js
index 85855b6..6517592 100644
--- a/scripts/gui/lobby.js
+++ b/scripts/gui/lobby.js
@@ -1,4 +1,7 @@
'use strict';
+
+const LOBBY_RPC = ["packList", "gameList", "players", "addGame", "deleteGame"]
+
// ###############
// # TopBar Code #
// ###############
@@ -51,35 +54,53 @@ class TopBar{
// Game represents a single game in the lobby view. It has methods for setting up the elements and such.
class Game {
- constructor(options = {id: 0, name: "", password: false}, el)
+ constructor(options = {id: 0, name: "", packs: [], pass: false}, el)
{
- this.getName = function () {
+ this.getName = () => {
return options.name;
}
+ this.getID = () => {
+ return options.id;
+ }
+
+ // Main game element
let e = document.createElement("div");
e.className = "game";
+ // Game title
let title = document.createElement("h2");
title.textContent = options.name;
e.appendChild(title);
+ // Game stats
+ let gid = document.createElement("span");
+ gid.textContent = `Game ID: ${options.id}`;
+ e.appendChild(gid);
+
+ let pid = document.createElement("span");
+ pid.textContent = `Pack count: ${options.packs.length}`;
+ e.appendChild(pid);
+
+ // Join/password
+ let jap = document.createElement("div");
+
let join = document.createElement("button");
- join.className = "join";
join.textContent = "Join";
join.addEventListener("click", game.joinGame.bind(game, options.id));
- e.appendChild(join);
+ jap.appendChild(join);
- if(usePass) {
- let pass = MakeInput.textInput("", "Game password");
- pass.classList.add("pass");
- e.appendChild(pass);
+ this.getPass = () => {
+ return "";
+ }
- this.getUserPass = function () {
- return pass.value;
- }
+ if(options.pass) {
+ let pass = MakeInput.passwordInput("", "Game password");
+ jap.appendChild(pass);
+ this.getPass = pass.getValue.bind(pass);
}
+ e.appendChild(jap);
el.appendChild(e);
this.remove = function () {
@@ -168,14 +189,16 @@ class Lobby {
// { data.name } room name
// { data.packs } list of the pack names used by this game
// { data.id } room identifier (uuid)
+ // { data.pass } true or false weather the game has a password
+
addGame (data) {
let g = new Game(data, this.e.games);
- this.games.push(g);
+ this.games[data.id] = g;
}
// Called when a new public game is removed on the server
// { data string } the uuid of the game to delete
- removeGame (data) {
+ deleteGame (data) {
}
diff --git a/scripts/gui/table.js b/scripts/gui/table.js
index 911e513..e4d6770 100644
--- a/scripts/gui/table.js
+++ b/scripts/gui/table.js
@@ -1,4 +1,7 @@
'use strict';
+
+const TABLE_RPC = ["newDeck", "newCard", "deleteDeck", "deleteCard", "moveByID", "swapCard"]
+
// Table represents and manages the actual game. It accepts inputs from the server and tries to query the server when the player makes a move.
class Table{
constructor(e, drag, socket) {