update client display name to be more identfiable

Author: mwfarb

AllSpark-ios/CameraViewController.swift

@@ -640,6 +640,17 @@ class CameraViewController: UIViewController, UIDocumentPickerDelegate, UINaviga
 
     // MARK: - WebSocket Methods
 
+    private func getClientDisplayName() -> String {
+        let deviceName = UIDevice.current.name
+        let customName = UserDefaults.standard.string(forKey: "clientDisplayName")
+
+        if let customName = customName, !customName.isEmpty {
+            return "\(customName) (\(deviceName))"
+        } else {
+            return deviceName
+        }
+    }
+
     private func setupWebSocketConnection() {
         var hostString = UserDefaults.standard.string(forKey: "serverHost") ?? "localhost:8080"
 
@@ -688,6 +699,25 @@ class CameraViewController: UIViewController, UIDocumentPickerDelegate, UINaviga
 
         print("Connecting to WebSocket at \(wsURL)")
 
+        // Send client identification message immediately after connection
+        let clientName = getClientDisplayName()
+        let clientInfo: [String: Any] = [
+            "type": "clientInfo",
+            "clientName": clientName
+        ]
+
+        if let jsonData = try? JSONSerialization.data(withJSONObject: clientInfo, options: []),
+           let jsonString = String(data: jsonData, encoding: .utf8) {
+            let message = URLSessionWebSocketTask.Message.string(jsonString)
+            task.send(message) { error in
+                if let error = error {
+                    print("Failed to send client info: \(error)")
+                } else {
+                    print("Client info sent: \(clientName)")
+                }
+            }
+        }
+
         // Start receiving messages - this will detect connection errors and trigger fallback if needed
         receiveWebSocketMessage()
     }

README.md

@@ -178,7 +178,14 @@ Located in **SettingsView.swift**, allows users to:
    - Shows connection protocol (ws:// or wss://) being used
    - Useful for diagnosing network or certificate issues
 
-4. **Test HTTP Connection**
+4. **Set Client Display Name** (optional)
+   - Custom name shown on server's web interface
+   - Example: "Lab Camera 1", "Front Lobby", etc.
+   - If set, displays as "CustomName (DeviceModel)"
+   - If not set, displays just device name
+   - Helps identify which device is which when multiple clients connect
+
+5. **Test HTTP Connection**
    - Calls `/api/health` endpoint
    - Verifies server status and uptime
    - Displays health check response

tests/perceptor-host-test/README.md

@@ -97,6 +97,7 @@ Returns information about current WebSocket connections and their upload states.
   "connections": [
     {
       "id": "abc123def",
+      "clientName": "Lab Camera 1 (iPhone 14 Pro)",
       "hasMetadata": true,
       "filename": "video.mp4",
       "receivedData": true
@@ -185,7 +186,32 @@ Any request that doesn't match the above endpoints returns a `404` error.
 
 ### WebSocket Message Protocol
 
-#### 1. Command Message from Server (String/JSON)
+#### 1. Client Identification Message (String/JSON)
+
+Client sends identification info upon connecting:
+
+**Format:**
+```json
+{
+  "type": "clientInfo",
+  "clientName": "Lab Camera 1 (iPhone 14 Pro)"
+}
+```
+
+**Parameters:**
+- `type`: `"clientInfo"` - Identifies this as a client identification message
+- `clientName`: Display name for this client, shown in server's web interface
+  - Format: "CustomName (DeviceModel)" if custom name is set
+  - Format: "DeviceModel" if no custom name is set
+
+**Server Behavior:**
+- Stores clientName for the connection
+- Returns it in `/api/status` endpoint for display on web interface
+- Helps identify which device is which in multi-client scenarios
+
+---
+
+#### 2. Command Message from Server (String/JSON)
 
 Server sends commands to client:
 
@@ -297,7 +323,10 @@ The server provides a web-based control interface at `http://localhost:8080` for
 ### Features
 
 1. **Active Connections List**
-   - Shows all connected clients with their IDs
+   - Shows all connected clients with their display names
+   - Device names automatically sent by clients (customizable in Settings)
+   - Format: "CustomName (DeviceModel)" or just "DeviceModel"
+   - Connection ID shown in smaller text below the name
    - Displays metadata status and received data status
    - Real-time updates every 5 seconds
 

tests/perceptor-host-test/index.html

@@ -131,7 +131,7 @@ <h2>Active Connections</h2>
             const isChecked = existingCheckbox ? existingCheckbox.checked : true;
             return `
             <div class="connection-item">
-              <div class="connection-id">ID: ${conn.id}</div>
+              <div class="connection-id">${conn.clientName || 'Unknown Device'} <span style="color: #999; font-size: 0.85em;">(${conn.id})</span></div>
               <div class="connection-details">
                 <p>Metadata: ${conn.hasMetadata ? '✓' : '✗'} ${conn.filename ? `(${conn.filename})` : ''}</p>
                 <p>Data Received: ${conn.receivedData ? '✓' : '✗'}</p>

tests/perceptor-host-test/server.js

@@ -71,6 +71,7 @@ function requestHandler(req, res) {
     res.writeHead(200, { "Content-Type": "application/json" });
     const connections = Array.from(uploadStates.entries()).map(([id, state]) => ({
       id,
+      clientName: state.clientName || "Unknown Device",
       hasMetadata: state.metadata !== null,
       filename: state.metadata?.filename || null,
       receivedData: state.receivedData
@@ -144,7 +145,8 @@ wss.on("connection", function connection(ws) {
   uploadStates.set(connectionId, {
     metadata: null,
     fileStream: null,
-    receivedData: false
+    receivedData: false,
+    clientName: null
   });
   clientConnections.set(connectionId, ws);
   console.log(`Client connected ${connectionId}`);
@@ -172,11 +174,18 @@ wss.on("connection", function connection(ws) {
     }
 
     if (isStringMessage) {
-      // First message: metadata or test message as JSON string
+      // First message: metadata, test message, or client info as JSON string
       try {
         const parsedMessage = JSON.parse(message);
         console.log(`Received message:`, parsedMessage);
 
+        // Check if this is a client info message
+        if (parsedMessage.type === "clientInfo") {
+          state.clientName = parsedMessage.clientName;
+          console.log(`Client identified as: ${state.clientName}`);
+          return;
+        }
+
         // Check if this is a test message
         if (parsedMessage.type === "test") {
           ws.send(JSON.stringify({ status: "success", message: "Test message received" }));