1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
|
'use strict';
const VERSION = "1";
const DefaultUserOps = {
color: {
type: "color",
title: "Player Color",
args: ["#ff0000"]
},
name: {
type: "text",
title: "Player Name",
args: ["User " + Math.floor(Math.random() * 10000), ""]
}
}
const DefaultGameOps = {
name: {
type:"text",
title: "Room Name",
args: ["", ""]
},
hidden: {
type: "checkbox",
title: "Unlisted",
args: []
},
usePass: {
type: "checkbox",
title: "Use Password",
args: []
},
pass: {
type: "text",
title: "Set Password",
args: [Math.floor(Math.random() * 10000), ""]
}
}
// Client acts as the message hub for the whole game.
// WebSocket messages come into Client and Client redirects them to the lobby or table based on the state of the game.
// Client also performs the handshake for first starting the connection and messages everyone if the connection errors or closes.
class Client{
constructor (serveraddr, game)
{
this.socket = new SockWorker(serveraddr, VERSION);
this.socket.addEventListener("error", this.socketError.bind(this));
this.socket.addEventListener("closed", this.socketClose.bind(this));
this.socket.addEventListener("handshake", this.handshake.bind(this));
this.socket.addEventListener("menu", this.menuMsg.bind(this));
this.socket.addEventListener("game", this.gameMsg.bind(this));
this.socket.addEventListener("chat", this.chatMsg.bind(this));
this.socket.addEventListener("ping", this.pingMsg.bind(this));
this.lobby = new Lobby(document.getElementsByClassName("lobby")[0], this.socket);
this.lobby.setState("Connecting", "loading", this.socket.server);
this.drag = new MultiDrag();
this.table = new Table(document.getElementsByClassName("table")[0], this.drag, this.socket);
this.chat = new Chat(document.getElementsByClassName("chat")[0], this.socket);
this.chat.addChannel("Global");
this.chat.switchChannel("Global");
this.settings = new Settings(DefaultUserOps);
this.settings.putSettings(this.lobby.e.settings);
this.gameOptions = new Settings(DefaultGameOps);
this.gameOptions.putSettings(this.lobby.top.newGame);
this.game = game;
}
// Initialize the connection
init ()
{
this.socket.init();
}
// Callbacks for if the socket fails or closes
socketError() {
this.lobby.setState("Error", "closed", this.socket.server);
this.table.handleClose();
}
socketClose() {
this.lobby.setState("Closed", "closed", this.socket.server);
this.table.handleClose();
}
// Callback when negotiating with the server for the first time and we are determining versions
handshake (e)
{
let m = e.detail
switch (m.type) {
case "verr":
this.socket.close();
alert(`Error connecting to server: version of client (${VERSION}) not accepted.`);
console.error(`Error connecting to server: version of client (${VERSION}) not accepted.`);
console.error(m.data);
return;
case "ready":
console.log(`Handshake with server OK. Running client version ${VERSION}`);
this.settings.cleanup();
this.gameOptions.cleanup();
this.settings = new Settings(m.data.user);
this.gameOptions = new Settings(m.data.game);
this.gameOptions.putSettings(this.lobby.top.newGame);
if(this.lobby.top.mobileSettingsOpen())
this.settings.putSettings(this.lobby.top.mobileSettings);
else
this.settings.putSettings(this.lobby.e.settings);
this.socket.send("ready", "");
return;
}
}
// Menu switch, called when in the lobby and a message arrives from the server
menuMsg (e)
{
let m = e.detail;
if (LOBBY_RPC.includes(m.type))
this.lobby[m.type](m.data);
}
// Game switch, called when in game and a message arrives from the server
gameMsg (e)
{
let m = e.detail;
if (TABLE_RPC.includes(m.type))
this.table[m.type](m.data);
}
// Callback when a chat event is recieved from the server
chatMsg (e)
{
let m = e.detail;
if (CHAT_RPC.includes(m.type))
this.chat[m.type](m.data);
}
pingMsg(e)
{
this.socket.send("pong", "");
}
// Reset the lobby and table, then attempt to reopen the connection to the server.
reset ()
{
this.lobby.reset();
this.table.reset();
this.socket.init();
}
joinGame(id)
{
this.lobby.setState("Joining...", "loading", this.socket.server);
this.socket.send("join", {id: id, pass: this.lobby.games[id].getPass()});
}
leaveGame()
{
this.socket.send("leave", "");
}
}
// Global init of the game variable
let game;
(() => {
let params = new URLSearchParams((new URL(window.location)).search);
game = new Client(params.get("s"), params.get("g"));
game.init();
})();
|
