playsocketjs 1.0.8 → 1.0.9

package/dist/playsocket-client.js

@@ -17,7 +17,7 @@ class PlaySocket {
 
     // Room properties
     #storage = {}; // Shared storage object
-    #storageTimestamps = {}; // Tracks update timestamps per key
+    #storageTimestamps = {}; // Tracks update timestamps per key to ensure that not-yet synced updates don't get overwritten
     #roomHost;
     #roomId; // ID of the host (client only)
     #connectionCount = 0;
@@ -124,7 +124,9 @@ class PlaySocket {
                 });
             }),
             this.#createTimeout("Registration")
-        ]);
+        ]).finally(() => {
+            this.#pendingRegistration = null;
+        });
     }
 
     /**
@@ -141,7 +143,9 @@ class PlaySocket {
                 this.#socket.onopen = resolve;
             }),
             this.#createTimeout("Connection attempt")
-        ]);
+        ]).finally(() => {
+            this.#pendingConnect = null;
+        });
     }
 
     /**
@@ -165,16 +169,14 @@ class PlaySocket {
                             this.#triggerEvent("status", `Connected to room.`);
                             this.#triggerEvent("storageUpdated", { ...this.#storage });
                             this.#pendingJoin.resolve();
-                            this.#pendingJoin = null;
                         }
                         break;
 
                     case 'join_rejected':
                         // Connection to room failed
                         if (this.#pendingJoin) {
-                            this.#triggerEvent("status", "Connection rejected: " + message.reason || 'Unknown reason');
-                            this.#pendingJoin.reject(new Error("Connection rejected: " + message.reason || 'Unknown reason'));
-                            this.#pendingJoin = null;
+                            this.#triggerEvent("status", "Connection rejected: " + message.reason);
+                            this.#pendingJoin.reject(new Error("Connection rejected: " + message.reason));
                         }
                         break;
 
@@ -197,15 +199,13 @@ class PlaySocket {
                             }
                             this.#triggerEvent("status", "Reconnected.");
                             this.#pendingReconnect.resolve();
-                            this.#pendingReconnect = null;
                         }
                         break;
 
                     case 'reconnection_failed':
                         if (this.#pendingReconnect) {
                             this.#triggerEvent("status", `Reconnection failed: ${message.reason}`);
-                            this.#pendingReconnect.resolve();
-                            this.#pendingReconnect = null;
+                            this.#pendingReconnect.reject(new Error("Reconnection failed: " + message.reason));
                         }
                         break;
 
@@ -214,22 +214,19 @@ class PlaySocket {
                             this.#pendingHost.resolve(this.#roomId);
                             this.#triggerEvent("status", `Room created${this.#pendingHost.maxSize ? ` with max size ${this.#pendingHost.maxSize}.` : '.'}`);
                             this.#triggerEvent("storageUpdated", { ...this.#storage });
-                            this.#pendingHost = null;
                         }
                         break;
 
                     case 'room_creation_failed':
                         if (this.#pendingHost) {
-                            this.#pendingHost.reject(new Error("Failed to create room: " + message.reason || 'Unknown reason'));
-                            this.#triggerEvent("error", "Failed to create room: " + message.reason || 'Unknown reason');
-                            this.#pendingHost = null;
+                            this.#pendingHost.reject(new Error("Failed to create room: " + message.reason));
+                            this.#triggerEvent("error", "Failed to create room: " + message.reason);
                         }
                         break;
 
                     case 'id_taken':
                         if (this.#pendingRegistration) {
                             this.#pendingRegistration.reject(new Error("This id is already in use"));
-                            this.#pendingRegistration = null;
                             this.#triggerEvent("error", "This id is taken.");
                         }
                         break;
@@ -242,7 +239,6 @@ class PlaySocket {
                             this.#sessionToken = message.sessionToken;
                             this.#initialized = true;
                             this.#pendingRegistration.resolve();
-                            this.#pendingRegistration = null;
                             this.#triggerEvent("status", "Connected to server.");
                         }
                         break;
@@ -258,6 +254,17 @@ class PlaySocket {
                         }
                         break;
 
+                    case 'storage_operation':
+                        if (message.key) {
+                            const updatedArray = this.#handleArrayUpdate(message.key, message.operation, message.value, message.updateValue);
+                            if (JSON.stringify(this.#storage[message.key]) !== JSON.stringify(updatedArray)) {
+                                this.#storage[message.key] = updatedArray;
+                                this.#storageTimestamps[message.key] = message.timestamp;
+                                this.#triggerEvent("storageUpdated", { ...this.#storage });
+                            }
+                        }
+                        break;
+
                     case 'client_disconnected':
                         this.#connectionCount = message.participantCount - 1; // Counted without the user themselves
                         this.#setHost(message.host);
@@ -316,7 +323,9 @@ class PlaySocket {
                     });
                 }),
                 this.#createTimeout("Reconnection request")
-            ]);
+            ]).finally(() => {
+                this.#pendingReconnect = null;
+            });
         } catch (error) {
             this.#triggerEvent("status", "Reconnection failed: " + error.message);
             this.#reconnectTimeout = setTimeout(() => this.#attemptReconnect(), 500);
@@ -378,7 +387,9 @@ class PlaySocket {
                 });
             }),
             this.#createTimeout("Room creation")
-        ]);
+        ]).finally(() => {
+            this.#pendingHost = null;
+        });
     }
 
     /**
@@ -405,7 +416,9 @@ class PlaySocket {
                 });
             }),
             this.#createTimeout("Room join")
-        ]);
+        ]).finally(() => {
+            this.#pendingJoin = null;
+        });
     }
 
     /**
@@ -437,15 +450,17 @@ class PlaySocket {
     updateStorageArray(key, operation, value, updateValue) {
         const updatedArray = this.#handleArrayUpdate(key, operation, value, updateValue);
         if (JSON.stringify(this.#storage[key]) === JSON.stringify(updatedArray)) return; // Prevent updates without changes
+        const timestamp = this.#getTimestamp();
         this.#sendToServer({
             type: 'room_storage_array_update',
             key,
             operation,
             value,
-            updateValue
+            updateValue,
+            timestamp
         });
         this.#storage[key] = updatedArray;
-        this.#storageTimestamps[key] = this.#getTimestamp();
+        this.#storageTimestamps[key] = timestamp;
         this.#triggerEvent("storageUpdated", { ...this.#storage });
     }
 
@@ -490,6 +505,8 @@ class PlaySocket {
         this.#initialized = false; // Set this immediately to prevent automatic reconnection
 
         if (this.#socket) {
+            // Signal to the server that it can immediately disconnect this user
+            if (this.#socket.readyState === WebSocket.OPEN) this.#sendToServer({ type: 'disconnect' });
             this.#socket.close();
             this.#socket = null;
 
@@ -503,6 +520,7 @@ class PlaySocket {
         this.#roomHost = null;
         this.#storage = {};
         this.#storageTimestamps = {};
+        this.#serverTimeOffset = 0;
         this.#roomId = null;
         this.#connectionCount = 0;
         this.#isReconnecting = false;

package/dist/playsocket-server.js

@@ -214,7 +214,7 @@ function requireServer () {
 	                        if (data.timestamp > existingTimestamp && JSON.stringify(updateRoom.storage[data.key]) !== JSON.stringify(data.value)) {
 	                            updateRoom.storage[data.key] = data.value;
 	                            updateRoom.storageTimestamps[data.key] = data.timestamp;
-	                            this.#syncRoomStorageKey(updateRoomId, data.key, data.timestamp);
+	                            this.#syncRoomStorageKey(updateRoomId, ws.clientId, data.key, data.timestamp);
 	                        }
 	                    }
 	                    break;
@@ -223,14 +223,20 @@ function requireServer () {
 	                    const arrayRoomId = this.#clientRooms.get(ws.clientId);
 	                    const arrayRoom = arrayRoomId ? this.#rooms[arrayRoomId] : null;
 	                    if (arrayRoom && data.key) {
+	                        // No timestamp check for array operations as they are designed to work unordered
 	                        const updatedArray = this.#arrayUpdate(arrayRoom.storage, data.key, data.operation, data.value, data.updateValue);
 	                        if (JSON.stringify(arrayRoom.storage[data.key]) !== JSON.stringify(updatedArray)) {
 	                            arrayRoom.storage[data.key] = updatedArray;
-	                            arrayRoom.storageTimestamps[data.key] = Date.now(); // New date to ensure that they are applied regardless of age (they don't overwrite – they transform)
-	                            this.#syncRoomStorageKey(arrayRoomId, data.key, Date.now());
+	                            arrayRoom.storageTimestamps[data.key] = data.timestamp;
+	                            this.#syncRoomStorageOperation(arrayRoomId, ws.clientId, data.key, data.operation, data.value, data.updateValue, data.timestamp);
 	                        }
 	                    }
 	                    break;
+
+	                case 'disconnect':
+	                    // Client signals to server that it will will willfully disconnect soon
+	                    ws.willfulDisconnect = true;
+	                    break;
 	            }
 	        } catch (error) {
 	            console.error('Error processing message:', error);
@@ -276,13 +282,18 @@ function requireServer () {
 	    }
 
 	    /**
-	     * Sync storage key to all clients in room
+	     * Sync storage key with all clients in room
 	     * @private
+	     * @param {string} roomId 
+	     * @param {string} requesterId - Client id of whom initiated the operation
+	     * @param {string} key 
+	     * @param {number} timestamp - In milliseconds
 	     */
-	    #syncRoomStorageKey(roomId, key, timestamp) {
+	    #syncRoomStorageKey(roomId, requesterId, key, timestamp) {
 	        const room = this.#rooms[roomId];
 	        if (!room) return;
 	        room.participants.forEach(p => {
+	            if (p == requesterId) return; // Don't sync with the requester
 	            const client = this.#clients.get(p);
 	            if (client) {
 	                client.send(JSON.stringify({
@@ -295,6 +306,36 @@ function requireServer () {
 	        });
 	    }
 
+	    /**
+	     * Sync storage operations with all clients in room
+	     * @private
+	     * @param {string} roomId 
+	     * @param {string} requesterId - Client id of whom initiated the operation
+	     * @param {string} key 
+	     * @param {string} operation 
+	     * @param {*} value 
+	     * @param {*} updateValue 
+	     * @param {number} timestamp - In milliseconds
+	     */
+	    #syncRoomStorageOperation(roomId, requesterId, key, operation, value, updateValue, timestamp) {
+	        const room = this.#rooms[roomId];
+	        if (!room) return;
+	        room.participants.forEach(p => {
+	            if (p == requesterId) return; // Don't send the operation to the requester
+	            const client = this.#clients.get(p);
+	            if (client) {
+	                client.send(JSON.stringify({
+	                    type: 'storage_operation',
+	                    key,
+	                    operation,
+	                    value,
+	                    updateValue,
+	                    timestamp
+	                }));
+	            }
+	        });
+	    }
+
 	    /**
 	     * Handle array operations
 	     * @private
@@ -334,38 +375,51 @@ function requireServer () {
 	        if (!ws.clientId) return;
 	        this.#clients.delete(ws.clientId); // Immediately remove from active clients (otherwise, server would try to message this client)
 
-	        // Pending disconnection with 2s grace period to allow for reconnections
-	        this.#pendingDisconnects.set(ws.clientId, {
-	            timeout: setTimeout(() => {
-	                this.#pendingDisconnects.delete(ws.clientId);
-	                this.#rateLimits.delete(ws.clientId);
-	                this.#clientTokens.delete(ws.clientId);
-	                const roomId = this.#clientRooms.get(ws.clientId);
-	                const room = this.#rooms[roomId];
-
-	                if (room) {
-	                    room.participants = room.participants.filter(p => p !== ws.clientId); // Remove client from room
-	                    this.#clientRooms.delete(ws.clientId);
-
-	                    if (room.participants?.length === 0) {
-	                        delete this.#rooms[roomId]; // Delete room if now empty
-	                    } else {
-	                        // Notify remaining participants
-	                        room.participants.forEach(p => {
-	                            const client = this.#clients.get(p);
-	                            if (client) client.send(JSON.stringify({
-	                                type: 'client_disconnected',
-	                                client: ws.clientId,
-	                                host: room.participants[0],
-	                                participantCount: room.participants.length
-	                            }));
-	                        });
-	                    }
-	                }
+	        if (ws.willfulDisconnect) {
+	            this.#disconnectClient(ws); // Immediate disconnection
+	        } else {
+	            // Pending complete disconnection with 2s grace period to allow for reconnections
+	            this.#pendingDisconnects.set(ws.clientId, {
+	                timeout: setTimeout(() => {
+	                    this.#disconnectClient(ws);
+	                }, 2000)
+	            });
+	        }
+	    }
 
-	                this.#triggerEvent("clientDisconnected", ws.clientId);
-	            }, 2000)
-	        });
+	    /**
+	     * Disconnect a client
+	     * @private
+	     * @param {Object} ws 
+	     */
+	    #disconnectClient(ws) {
+	        this.#pendingDisconnects.delete(ws.clientId);
+	        this.#rateLimits.delete(ws.clientId);
+	        this.#clientTokens.delete(ws.clientId);
+	        const roomId = this.#clientRooms.get(ws.clientId);
+	        const room = this.#rooms[roomId];
+
+	        if (room) {
+	            room.participants = room.participants.filter(p => p !== ws.clientId); // Remove client from room
+	            this.#clientRooms.delete(ws.clientId);
+
+	            if (room.participants?.length === 0) {
+	                delete this.#rooms[roomId]; // Delete room if now empty
+	            } else {
+	                // Notify remaining participants
+	                room.participants.forEach(p => {
+	                    const client = this.#clients.get(p);
+	                    if (client) client.send(JSON.stringify({
+	                        type: 'client_disconnected',
+	                        client: ws.clientId,
+	                        host: room.participants[0],
+	                        participantCount: room.participants.length
+	                    }));
+	                });
+	            }
+	        }
+
+	        this.#triggerEvent("clientDisconnected", ws.clientId);
 	    }
 
 	    /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "playsocketjs",
-  "version": "1.0.8",
+  "version": "1.0.9",
   "description": "WebSocket wrapper for creating simple multiplayer systems with ease.",
   "module": "dist/playsocket-client.js",
   "exports": {