@clawlabz/clawskin 1.0.0 → 1.0.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clawlabz/clawskin",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "type": "module",
   "description": "Pixel Agent Skin Engine \u2014 Procedural 32\u00d732 character generator with scenes, animations & customization",
   "keywords": [

package/public/app.html

@@ -319,11 +319,16 @@
     let app, editingSlot = null;
 
     // ── Fullscreen canvas sizing ──
+    // Fixed logical resolution — CSS scales it up with pixelated rendering.
+    // This keeps pixel characters proportional on any screen size.
+    const LOGICAL_W = 960;
+    const LOGICAL_H = 600;
+
     function resizeCanvas() {
       const c = document.getElementById('app-canvas');
-      c.width = window.innerWidth;
-      c.height = window.innerHeight;
-      if (app) { app.width = c.width; app.height = c.height; }
+      c.width = LOGICAL_W;
+      c.height = LOGICAL_H;
+      if (app) { app.width = LOGICAL_W; app.height = LOGICAL_H; }
     }
     window.addEventListener('resize', resizeCanvas);
     resizeCanvas();
@@ -533,8 +538,8 @@
     document.addEventListener('DOMContentLoaded', () => {
       try {
         app = new ClawSkinApp('app-canvas', {
-          width: window.innerWidth,
-          height: window.innerHeight,
+          width: LOGICAL_W,
+          height: LOGICAL_H,
         });
         app.init();
         window._app = app;

package/public/js/app/ClawSkinApp.js

@@ -170,15 +170,17 @@ class ClawSkinApp {
         const config = await res.json();
         if (config?.gatewayUrl) {
           const saved = this.settings.load();
+          const token = config.token || saved.token || '';
+          this._configAgents = config.agents || [];
           this.settings.update({
             gatewayUrl: config.gatewayUrl,
+            token: token,
             autoConnect: true,
           });
           if (window._connPanel) {
             window._connPanel.render(this.settings.load());
           }
-          // Use previously saved token if available; never read token from /api/config
-          this.gateway.connect(config.gatewayUrl, saved.token || '');
+          this.gateway.connect(config.gatewayUrl, token);
           return;
         }
       }
@@ -265,55 +267,62 @@ class ClawSkinApp {
   // ──── Multi-Agent Management ────
 
   async _discoverAgents() {
+    // Start with agents from config file (all agents, regardless of activity)
+    const configAgents = this._configAgents || [];
+    const knownAgentIds = new Set();
+
+    // Phase 1: Create slots for all agents from config file
+    for (const agent of configAgents) {
+      if (!agent.id) continue;
+      knownAgentIds.add(agent.id);
+      this._addAgent({
+        agentId: agent.id,
+        name: agent.name || agent.id,
+        label: agent.name || agent.id,
+        sessionKeys: [],
+      });
+    }
+
+    // Phase 2: Discover active sessions from Gateway and attach to slots
     try {
       const result = await this.gateway.getSessionsList({ activeMinutes: 1440 });
       const sessions = result?.sessions || result || [];
 
-      if (!Array.isArray(sessions) || sessions.length === 0) {
-        this._addAgent({ agentId: 'main', label: 'Main Agent', sessionKeys: ['main'] });
-        return;
-      }
-
-      // Group sessions by agentId
-      // Session keys look like: "agent:main:main", "agent:ifig:discord:channel:123", "agent:xhs:main"
-      // The agentId is either session.agentId or extracted from the key pattern "agent:<agentId>:..."
-      const agentMap = new Map();
+      if (Array.isArray(sessions)) {
+        for (const session of sessions) {
+          const key = session.key || session.sessionKey;
+          if (!key) continue;
 
-      for (const session of sessions) {
-        const key = session.key || session.sessionKey;
-        if (!key) continue;
-
-        // Determine agentId: prefer session.agentId, else parse from key
-        let agentId = session.agentId || null;
-        if (!agentId) {
-          const match = key.match(/^agent:([^:]+):/);
-          agentId = match ? match[1] : 'main';
-        }
+          let agentId = session.agentId || null;
+          if (!agentId) {
+            const match = key.match(/^agent:([^:]+):/);
+            agentId = match ? match[1] : 'main';
+          }
 
-        if (!agentMap.has(agentId)) {
-          agentMap.set(agentId, {
-            agentId,
-            label: session.label || agentId,
-            sessionKeys: [],
-          });
+          // If this agent wasn't in config, create a slot for it
+          if (!knownAgentIds.has(agentId)) {
+            knownAgentIds.add(agentId);
+            this._addAgent({
+              agentId,
+              label: session.label || agentId,
+              sessionKeys: [key],
+            });
+          } else {
+            // Attach session key to existing slot
+            const slot = this.agents.find(a => a.agentId === agentId);
+            if (slot && !slot.sessionKeys.includes(key)) {
+              slot.sessionKeys.push(key);
+              slot.stateMapper.addSessionKey(key);
+            }
+          }
         }
-        agentMap.get(agentId).sessionKeys.push(key);
-      }
-
-      // Create one AgentSlot per unique agentId
-      for (const [agentId, info] of agentMap) {
-        this._addAgent({
-          agentId,
-          label: info.label,
-          sessionKeys: info.sessionKeys,
-        });
-      }
-
-      if (this.agents.length === 0) {
-        this._addAgent({ agentId: 'main', label: 'Main Agent', sessionKeys: ['main'] });
       }
     } catch (e) {
       console.warn('[ClawSkinApp] session discovery failed:', e);
+    }
+
+    // Phase 3: Fallback — ensure at least one agent exists
+    if (this.agents.length === 0) {
       this._addAgent({ agentId: 'main', label: 'Main Agent', sessionKeys: ['main'] });
     }
 

package/serve.cjs

@@ -44,11 +44,16 @@ function getLocalGatewayConfig() {
       const config = JSON.parse(raw);
       const gw = config.gateway || {};
       const port = gw.port || 18789;
+      const agentsList = (config.agents?.list || []).map(a => ({
+        id: a.id,
+        name: a.identity?.name || a.name || a.id,
+      }));
       return {
         gatewayUrl: `ws://localhost:${port}`,
-        // Only expose that auth is token-based, never send the actual token.
-        // The user must enter the token manually in the UI.
-        hasAuth: !!(gw.auth && gw.auth.mode === 'token'),
+        // Safe to expose token on localhost — serve.cjs binds to 127.0.0.1 by default.
+        // The token never leaves the local machine.
+        token: (gw.auth && gw.auth.token) || '',
+        agents: agentsList,
       };
     } catch { continue; }
   }