send only the difference in imageUpdate

README.md

@@ -145,16 +145,17 @@ ID (in 64-bit format) is specified in `data`.
 
 #### `imageUpdate`
 This OP code is sent only from the server whenever the image is changed.
-The payload data contains the image and its difference between how it was updated
-before and after.
+The payload data contains its difference between how it was updated
+before and after, as well as the Steam ID of the player (in 64-bit format)
+who made the change.
 
 ##### Example payload
 ```json
 {
   "op": "imageUpdate",
   "data": {
-    "image": [...],
-    "diff": {...}
+    "diff": {...},
+    "steamId": "76561198086180059"
   }
 }
 ```

assets/externs.js

@@ -50,7 +50,7 @@ SteamResponse.prototype.avatar;
 
 /** @interface */
 function ImageUpdate() {}
-/** @type {Array} */
-ImageUpdate.prototype.image;
 /** @type {Object} */
 ImageUpdate.prototype.diff;
+/** @type {string} */
+ImageUpdate.prototype.steamId;

assets/script.js

@@ -205,8 +205,13 @@ class Artboard {
       } break;
 
       case 'imageUpdate': {
-        const { image } = /** @type {ImageUpdate} */ data;
-        this.data.image = image;
+        const { diff, steamId } = /** @type {ImageUpdate} */ data;
+        for (const position in diff) {
+          const color = diff[position] - 1;
+          const xy = parseInt(position);
+          this.data.steamIDs[xy] = steamId;
+          this.data.image[xy] = color;
+        }
       } break;
     }
 

src/structures/Game.ts

@@ -97,8 +97,8 @@ export default class Game extends BaseStructure {
     this.timeouts[steamID] = Date.now();
 
     this.structures.Web.broadcast(WEBSOCKET_EVENTS.IMAGE_UPDATE, {
-      image: this.data.image,
       diff: pixels,
+      steamId: steamID
     });
 
     this.structures.Web.broadcast(WEBSOCKET_EVENTS.EXECUTE_TIMEOUT, steamID);

src/types.ts

@@ -54,8 +54,8 @@ export interface WebSocketAPIEvents {
   };
   [WEBSOCKET_EVENTS.IMAGE_RESET]: true;
   [WEBSOCKET_EVENTS.IMAGE_UPDATE]: {
-    image: number[];
     diff: Record<number, number>;
+    steamId: string;
   };
   [WEBSOCKET_EVENTS.WRITE_ACCESS]: boolean;
 }