From c28e9b2429cc5a1bf03d3aa1b53ebbc466a49ba3 Mon Sep 17 00:00:00 2001
From: Alberto Xamin <alberto@xamin.it>
Date: Fri, 29 Jan 2021 12:10:14 +0100
Subject: [PATCH] spectate rooms

---
 backend/__init__.py                | 31 ++++++++++++++++++++----------
 frontend/src/components/Menu.vue   | 20 +++++++++++++++++++
 frontend/src/components/Player.vue |  2 +-
 frontend/src/i18n/en.json          |  1 +
 frontend/src/i18n/it.json          |  1 +
 5 files changed, 44 insertions(+), 11 deletions(-)

diff --git a/backend/__init__.py b/backend/__init__.py
index b10782c..622ab2c 100644
--- a/backend/__init__.py
+++ b/backend/__init__.py
@@ -32,6 +32,7 @@ online_players = 0
 
 def advertise_lobbies():
     sio.emit('lobbies', room='lobby', data=[{'name': g.name, 'players': len(g.players), 'locked': g.password != ''} for g in games if not g.started and len(g.players) < 10])
+    sio.emit('spectate_lobbies', room='lobby', data=[{'name': g.name, 'players': len(g.players), 'locked': g.password != ''} for g in games if g.started])
 
 @sio.event
 def connect(sid, environ):
@@ -160,17 +161,27 @@ def toggle_replace_with_bot(sid):
 @sio.event
 def join_room(sid, room):
     room_name = room['name']
-    print(f'{sid} joined a room named {room_name}')
     i = [g.name for g in games].index(room_name)
-    if games[i].password != '' and games[i].password != room['password'].upper():
-        return
-    sio.leave_room(sid, 'lobby')
-    sio.enter_room(sid, room_name)
-    while len([p for p in games[i].players if p.name == sio.get_session(sid).name]):
-        sio.get_session(sid).name += f'_{random.randint(0,100)}'
-    sio.emit('me', data=sio.get_session(sid).name, room=sid)
-    games[i].add_player(sio.get_session(sid))
-    advertise_lobbies()
+    if not games[i].started:
+        if games[i].password != '' and games[i].password != room['password'].upper():
+            return
+        print(f'{sid} joined a room named {room_name}')
+        sio.leave_room(sid, 'lobby')
+        sio.enter_room(sid, room_name)
+        while len([p for p in games[i].players if p.name == sio.get_session(sid).name]):
+            sio.get_session(sid).name += f'_{random.randint(0,100)}'
+        sio.emit('me', data=sio.get_session(sid).name, room=sid)
+        games[i].add_player(sio.get_session(sid))
+        advertise_lobbies()
+    else:
+        games[i].spectators.append(sio.get_session(sid))
+        sio.get_session(sid).game = games[i]
+        sio.get_session(sid).pending_action = PendingAction.WAIT
+        sio.enter_room(sid, games[0].name)
+        games[i].notify_room(sid)
+        eventlet.sleep(0.5)
+        games[i].notify_room(sid)
+        games[i].notify_all()
 
 @sio.event
 def chat_message(sid, msg):
diff --git a/frontend/src/components/Menu.vue b/frontend/src/components/Menu.vue
index 58e59e7..af6cb2b 100644
--- a/frontend/src/components/Menu.vue
+++ b/frontend/src/components/Menu.vue
@@ -28,6 +28,11 @@
 						<Card v-for="lobby in openLobbies" v-bind:key="lobby.name" :card="getLobbyCard(lobby)" @click.native="joinLobby(lobby)"/>
 						<p v-if="noLobbyAvailable">{{$t("no_lobby_available")}}</p>
 					</div>
+					<h2>{{$t("spectate_lobbies")}}</h2>
+					<div style="display: flex">
+						<Card v-for="lobby in spectateLobbies" v-bind:key="lobby.name" :card="getSpectateLobbyCard(lobby)" @click.native="joinLobby(lobby)"/>
+						<p v-if="noSpectateLobbyAvailable">{{$t("no_lobby_available")}}</p>
+					</div>
 				</div>
 			</div>
 		</div>
@@ -52,6 +57,7 @@ export default {
 		didSetUsername: false,
 		username: '',
 		openLobbies: [],
+		spectateLobbies: [],
 		lobbyName: '',
 		isInLobby: false,
 		onlinePlayers: 0,
@@ -60,6 +66,9 @@ export default {
 		noLobbyAvailable() {
 			return this.openLobbies && this.openLobbies.length == 0
 		},
+		noSpectateLobbyAvailable() {
+			return this.spectateLobbies && this.spectateLobbies.length == 0
+		},
 		getSelfCard() {
 			return {
 				name: this.username,
@@ -73,6 +82,9 @@ export default {
 		lobbies(data) {
 			this.openLobbies = data;
 		},
+		spectate_lobbies(data) {
+			this.spectateLobbies = data;
+		},
 		room(data) {
 			this.isInLobby = true;
 			this.$router.push({path:'game', query: { code: data.name }})
@@ -99,6 +111,14 @@ export default {
 				is_equipment: true,
 			}
 		},
+		getSpectateLobbyCard(lobby) {
+			return {
+				name: lobby.name,
+				icon: "👁️",
+				number: `${lobby.players}🤠 ${lobby.locked?'🔐':''}`,
+				usable_next_turn: true,
+			}
+		},
 		createLobby(e) {
 			if (this.lobbyName.trim().length > 0) {
 				this.$socket.emit('create_room', this.lobbyName)
diff --git a/frontend/src/components/Player.vue b/frontend/src/components/Player.vue
index 6d8a8ee..d0205d0 100644
--- a/frontend/src/components/Player.vue
+++ b/frontend/src/components/Player.vue
@@ -85,7 +85,7 @@ export default {
 		lives: 0,
 		max_lives: 0,
 		hint: '',
-		pending_action: null,
+		pending_action: 4,
 		card_against: null,
 		card_with: null,
 		has_played_bang: false,
diff --git a/frontend/src/i18n/en.json b/frontend/src/i18n/en.json
index 80fe8e2..343e9e1 100644
--- a/frontend/src/i18n/en.json
+++ b/frontend/src/i18n/en.json
@@ -3,6 +3,7 @@
 	"online_players": "Online players: ",
 	"choose_username": "Pick an username:",
 	"available_lobbies": "Available Lobbies:",
+	"spectate_lobbies": "Spectate ongoing games:",
 	"no_lobby_available": "No lobbies available",
 	"create_lobby": "Open a lobby:",
 	"lobby_name": "Name:",
diff --git a/frontend/src/i18n/it.json b/frontend/src/i18n/it.json
index 3e37ec9..d734f5c 100644
--- a/frontend/src/i18n/it.json
+++ b/frontend/src/i18n/it.json
@@ -3,6 +3,7 @@
 	"online_players": "Giocatori online: ",
 	"choose_username": "Scegli un username:",
 	"available_lobbies": "Stanze disponibili:",
+	"spectate_lobbies": "Osserva le partite in corso:",
 	"no_lobby_available": "Nessuna stanza disponibile",
 	"create_lobby": "Crea una stanza:",
 	"lobby_name": "Nome:",