online players count

backend/__init__.py

@@ -12,14 +12,18 @@ app = socketio.WSGIApp(sio, static_files={
 })
 
 games: List[Game] = []
+online_players = 0
 
 def advertise_lobbies():
     sio.emit('lobbies', room='lobby', data=[{'name': g.name, 'players': len(g.players)} for g in games if not g.started])
 
 @sio.event
 def connect(sid, environ):
+    global online_players
     print('connect ', sid)
+    online_players += 1
     sio.enter_room(sid, 'lobby')
+    sio.emit('players', room='lobby', data=online_players)
 
 @sio.event
 def set_username(sid, username):
@@ -33,7 +37,11 @@ def my_message(sid, data):
 
 @sio.event
 def disconnect(sid):
-    if sio.get_session(sid).disconnect():
+    global online_players
+    online_players -= 1
+    sio.emit('players', room='lobby', data=online_players)
+    if sio.get_session(sid).game and sio.get_session(sid).disconnect():
+        sio.close_room(sio.get_session(sid).game.name)
         games.pop(games.index(sio.get_session(sid).game))
     print('disconnect ', sid)
     advertise_lobbies()

frontend/src/App.vue

@@ -6,14 +6,16 @@
 		</div>
 		<div v-if="isConnected">
 			<div v-if="!didSetUsername">
-				Scegli un username:
+				<p>Scegli un username:</p>
 				<form @submit="setUsername">
 					<input v-model="username" />
 					<input type="submit"/>
 				</form>
+				<p>Giocatori online: {{onlinePlayers}}</p>
 			</div>
 			<div v-else>
 				<div v-if="!isInLobby" >
+					<p>Giocatori online: {{onlinePlayers}}</p>
 					<Card :card="getSelfCard" style="position:absolute; bottom:10pt; right: 10pt;"/>
 					<h2>Lobby disponibili:</h2>
 					<div style="display: flex">
@@ -22,7 +24,8 @@
 					</div>
 					<form @submit="createLobby">
 						<h2>Crea una lobby:</h2>
-						Nome: <input v-model="lobbyName"/>
+						<p>Nome:</p>
+						<input v-model="lobbyName"/>
 						<input type="submit" />
 					</form>
 				</div>
@@ -54,6 +57,7 @@ export default {
 		openLobbies: [],
 		lobbyName: '',
 		isInLobby: false,
+		onlinePlayers: 1,
 	}),
 	computed: {
 		noLobbyAvailable() {
@@ -86,6 +90,9 @@ export default {
 		},
 		room() {
 			this.isInLobby = true;
+		},
+		players(num) {
+			this.onlinePlayers = num;
 		}
 	},
 	methods: {