show spectator count

backend/bang/game.py

@@ -50,6 +50,7 @@ class Game:
                 'expansions': self.expansions,
                 'available_expansions': self.available_expansions,
             })
+        self.sio.emit('spectators', room=self.name, data=len(self.spectators))
 
     def toggle_expansion(self, expansion_name):
         if not self.started:
@@ -368,6 +369,7 @@ class Game:
         print(f'player {player.name} left the game {self.name}')
         if player in self.spectators:
             self.spectators.remove(player)
+            self.sio.emit('spectators', room=self.name, data=len(self.spectators))
             return False
         if player.is_bot and not self.started:
             player.game = None

frontend/src/components/Chat.vue

@@ -1,5 +1,6 @@
 <template>
 	<div class="chat">
+		<h4 v-if="spectators > 0">{{$tc("chat.spectators", spectators)}}</h4>
 		<h3>{{$t("chat.chat")}}</h3>
 		<div id="chatbox">
 			<p style="margin:1pt;" class="chat-message" v-for="(msg, i) in messages" v-bind:key="`${i}-c`" :style="`color:${msg.color}`">{{msg.text}}</p>
@@ -17,7 +18,8 @@ export default {
 	name: 'Chat',
 	data: () => ({
 		messages: [],
-		text: ''
+		text: '',
+		spectators: 0,
 	}),
 	sockets: {
 		chat_message(msg) {
@@ -32,6 +34,9 @@ export default {
 			let container = this.$el.querySelector("#chatbox");
 			container.scrollTop = container.scrollHeight;
 		},
+		spectators(val) {
+			this.spectators = val
+		}
 	},
 	methods: {
 		sendChatMessage(e) {

frontend/src/components/Lobby.vue

@@ -140,7 +140,7 @@ export default {
 		},
 		change_username() {
 			this.hasToSetUsername = true
-		}
+		},
 	},
 	computed: {
 		inviteLink() {

frontend/src/i18n/en.json

@@ -63,6 +63,7 @@
 	"copy": "Copy invite",
 	"no_players_in_range": "You can't see the other players, equip a weapon or a scope!",
 	"chat": {
+		"spectators": " | A spectator is watching the game | {n} spectators are watching the game",
 		"chat": "Chat",
 		"joined": "{0} joined the lobby",
 		"died": "{0} died",

frontend/src/i18n/it.json

@@ -63,6 +63,7 @@
 	"copy": "Copia invito",
 	"no_players_in_range": "Non vedi nessun giocatore, equipaggia un arma o un mirino!",
 	"chat": {
+		"spectators": " | Uno spettatore sta guardando la partita | {n} spettatori stanno guardando la partita",
 		"chat": "Chat",
 		"joined": "{0} è entrato nella stanza",
 		"died": "{0} è morto",