Add online user indicators; add spectator counter.

server/src/manager/data.rs

@@ -525,7 +525,7 @@ pub async fn thread_system(mut app:App, bus:Bus<protocol::QRPacket>)
                             packets.push(QRPacket::new(
                                 cid,
                                 QRPacketData::GameMessage(PacketGameMessage {
-                                    data: GameMessageData::Online(0, session.spectators() as u32),
+                                    data: GameMessageData::Online(0, 1 + session.spectators() as u32),
                                 }),
                             ));
                         }
@@ -624,7 +624,7 @@ pub async fn thread_system(mut app:App, bus:Bus<protocol::QRPacket>)
                         else if user_id == Some(session.p_dusk.user) {
                             session.remove_connection(1, qr.id);
 
-                            if session.p_dawn.connections.len() == 0 {
+                            if session.p_dusk.connections.len() == 0 {
                                 for (cid, _) in session.get_connections() {
                                     packets.push(QRPacket::new(
                                         cid,
@@ -635,7 +635,19 @@ pub async fn thread_system(mut app:App, bus:Bus<protocol::QRPacket>)
                                 }
                             }
                         }
-                        else { session.remove_connection(2, qr.id); }
+                        else {
+                            session.remove_connection(2, qr.id);
+
+                            // Add user online packets.
+                            for (cid, _) in session.get_connections() {
+                                packets.push(QRPacket::new(
+                                    cid,
+                                    QRPacketData::GameMessage(PacketGameMessage {
+                                        data: GameMessageData::Online(0, session.spectators() as u32),
+                                    }),
+                                ));
+                            }
+                        }
                     }
                 }
 
@@ -973,6 +985,10 @@ fn generate_game_state(app:&App, session:&Session) -> protocol::PacketGameStateR
         response.dusk_handle = user.handle.clone();
     }
 
+    response.dawn_online = session.p_dawn.connections.len() > 0;
+    response.dusk_online = session.p_dusk.connections.len() > 0;
+    response.spectators = session.connections.len() as u32;
+
     // Get history
     response.history = session.game.history.clone();
 

server/src/protocol/packet/game_message.rs

@@ -103,7 +103,7 @@ impl Packet for PacketGameMessage {
             }
 
             GameMessageData::Online(client, state) => {
-                GMSG_PLAY_ALT as u64
+                GMSG_ONLINE as u64
                 | ((client as u64) << 8)
                 | ((state as u64) << 10)
             }

server/src/protocol/packet/game_state.rs

@@ -1,6 +1,6 @@
 use crate::{
     app::session::SessionToken,
-    util::pack::pack_u16,
+    util::pack::{pack_u16, pack_u32},
 };
 
 use game::history::Play;
@@ -45,6 +45,9 @@ pub struct PacketGameStateResponse {
     pub player:u8,
     pub dawn_handle:String,
     pub dusk_handle:String,
+    pub dawn_online:bool,
+    pub dusk_online:bool,
+    pub spectators:u32,
     pub history:Vec<Play>,
 }
 impl PacketGameStateResponse {
@@ -56,6 +59,9 @@ impl PacketGameStateResponse {
             player:2,
             dawn_handle:String::new(),
             dusk_handle:String::new(),
+            dawn_online:false,
+            dusk_online:false,
+            spectators:0,
             history:Vec::new(),
         }
     }
@@ -76,11 +82,14 @@ impl Packet for PacketGameStateResponse {
 
         let mut flags = 0u16;
         flags |= self.player as u16;
+        flags |= (self.dawn_online as u16) << 2;
+        flags |= (self.dusk_online as u16) << 3;
         
         [
             pack_u16(self.status),
             self.token.to_vec(),
             pack_u16(flags),
+            pack_u32(self.spectators),
             pack_u16(self.dawn_handle.len() as u16),
             self.dawn_handle.as_bytes().to_vec(),
             pack_u16(self.dusk_handle.len() as u16),

www/js/interface.js

@@ -21,11 +21,13 @@ const INTERFACE = {
         Promote: "#a52121",
 
         Dawn:        "#ffe082",
+        DawnShade:   "#a59154",
         DawnMedium:  "#fca03f",
         DawnDark:    "#ff6d00",
         DawnDarkest: "#4c3422",
 
         Dusk:        "#f6a1bd",
+        DuskShade:  "#a56b7f",
         DuskMedium:  "#e84a79",
         DuskDark:    "#c51162",
         DuskDarkest: "#4c2235",
@@ -646,7 +648,7 @@ const INTERFACE = {
             if(INTERFACE_DATA.Session.Client.Dawn.online) {
                 ctx.fillStyle = INTERFACE.Color.Dawn;
             } else {
-                ctx.fillStyle = INTERFACE.Color.DawnDark;
+                ctx.fillStyle = INTERFACE.Color.DawnShade;
             }
             ctx.textBaseline = "middle";
             ctx.textAlign = "center";
@@ -659,7 +661,7 @@ const INTERFACE = {
             if(INTERFACE_DATA.Session.Client.Dusk.online) {
                 ctx.fillStyle = INTERFACE.Color.Dusk;
             } else {
-                ctx.fillStyle = INTERFACE.Color.DuskDark;
+                ctx.fillStyle = INTERFACE.Color.DuskShade;
             }
             ctx.textBaseline = "middle";
             ctx.textAlign = "center";
@@ -695,6 +697,12 @@ const INTERFACE = {
         ctx.textAlign = "right";
         ctx.fillText(GAME_DATA.turn, width - gui_margin.t, gui_margin.t);
 
+        // Number of spectators
+        ctx.fillStyle = INTERFACE.Color.Text;
+        ctx.textBaseline = "bottom";
+        ctx.textAlign = "right";
+        ctx.fillText("👁" + INTERFACE_DATA.Session.Client.Spectators.count, width - gui_margin.t, height - gui_margin.t);
+
         // Game state message
         let message = null;
         ctx.fillStyle = INTERFACE.Color.Text;
@@ -1249,6 +1257,10 @@ const INTERFACE = {
                 INTERFACE_DATA.Game.history = data.history;
                 let turn = INTERFACE_DATA.Game.history.length;
 
+                INTERFACE_DATA.Session.Client.Dawn.online = data.dawn_online;
+                INTERFACE_DATA.Session.Client.Dusk.online = data.dusk_online;
+                INTERFACE_DATA.Session.Client.Spectators.count = data.spectators;
+
                 if(INTERFACE_DATA.Game.history.length > 0) {
                     if(INTERFACE_DATA.Replay.turn == 0) {
                         //if(INTERFACE_DATA.Game.history[INTERFACE_DATA.Game.history.length-1].source == 2) {
@@ -1304,9 +1316,10 @@ const INTERFACE = {
 
                             case 2: {
                                 // Dusk
-                                INTERFACE_DATA.Session.Client.Dawn.online = (data.state != 0);
+                                INTERFACE_DATA.Session.Client.Dusk.online = (data.state != 0);
                             } break;
                         }
+                        INTERFACE.redraw();
                     } break;
                     
                     case GameMessage.Undo: {
@@ -1322,11 +1335,11 @@ const INTERFACE = {
                                 INTERFACE.undo();
                             } break;
                         }
-                        
                     } break;
 
                     case GameMessage.Retire: {
                         GAME_DATA.state.code = GAME.Const.State.Resign;
+                        INTERFACE.redraw();
                     } break;
 
                     case GameMessage.Reaction: {
@@ -1338,6 +1351,14 @@ const INTERFACE = {
         }
     },
 
+    redraw() {
+        if(INTERFACE_DATA !== null) {
+            if(INTERFACE_DATA.Timeout.draw === null) {
+                INTERFACE.draw();
+            }
+        }
+    },
+
     process(play) {
         let valid = true;
 

www/js/system.js

@@ -265,6 +265,9 @@ function MESSAGE(event) {
                 player:2,
                 dawn:"",
                 dusk:"",
+                dawn_online:false,
+                dusk_online:false,
+                spectators:0,
                 history:[ ],
             };
 
@@ -282,6 +285,12 @@ function MESSAGE(event) {
             let flags = result.data;
 
             data.player = flags & 0x3;
+            data.dawn_online = (flags >> 2) & 1;
+            data.dusk_online = (flags >> 3) & 1;
+
+            result = UNPACK.u32(bytes, index);
+            index = result.index;
+            data.spectators = result.data;
 
             // Handles
             result = UNPACK.string(bytes, index);
@@ -351,7 +360,8 @@ function MESSAGE(event) {
 
                 case GameMessage.Online: {
                     data.client = dat & 0x3;
-                    data.state = (dat & 0x4) != 0;
+                    data.state = (dat >> 2) & 0xFFFF_FFFF;
+                    console.log(data.client + " = " + data.state);
                 } break;
 
                 case GameMessage.Undo: {