@saluzi/saluzi-edu 0.1.74 → 0.1.76

package/dist/parade/web/cube.js

@@ -31,7 +31,8 @@ const waitingPillEl = document.getElementById('waiting-pill')
 const sessionsEl = document.getElementById('sessions')
 const moreLineEl = document.getElementById('more-line')
 const ctxMenu = document.getElementById('ctx-menu')
-const ctxClose = document.getElementById('ctx-close')
+const ctxMode = document.getElementById('ctx-mode')
+const closeBtn = document.getElementById('close-btn')
 
 // ---------------------------------------------------------------------------
 // WebSocket connection
@@ -65,9 +66,18 @@ function connectWebSocket() {
 
   ws.onmessage = function (event) {
     try {
-      sessions = JSON.parse(event.data)
-      updateCounts()
-      updateSessionRows()
+      const data = JSON.parse(event.data)
+      if (Array.isArray(data)) {
+        sessions = data
+        updateCounts()
+        updateSessionRows()
+      } else if (data && data.type === 'focus') {
+        // Server relayed a focus request — tell electron main process to
+        // activate the terminal window for this PID.
+        if (window.parade && typeof window.parade.focusSession === 'function') {
+          window.parade.focusSession(data.pid)
+        }
+      }
     } catch (_) {
       // Ignore malformed messages
     }
@@ -182,13 +192,30 @@ function buildSessionRow(s, kind) {
   if (promptText.length > MAX_PROMPT_LENGTH) {
     promptText = promptText.substring(0, MAX_PROMPT_LENGTH) + '...'
   }
+  var text = document.createElement('span')
+  text.className = 'session-text'
   if (kind === 'idle') {
-    row.textContent = promptText || '(idle)'
+    text.textContent = promptText || '(idle)'
   } else if (kind === 'blocked') {
-    row.textContent = promptText || '(needs approval)'
+    text.textContent = promptText || '(needs approval)'
   } else {
-    row.textContent = promptText || '(running)'
+    text.textContent = promptText || '(running)'
   }
+  row.appendChild(text)
+
+  // Jump-to-terminal icon — appears on hover, sends focus request via WS
+  var jump = document.createElement('span')
+  jump.className = 'session-jump'
+  jump.textContent = '\u25B8' // ▸
+  jump.title = 'Jump to terminal'
+  jump.addEventListener('click', function (e) {
+    e.stopPropagation()
+    if (ws && ws.readyState === WebSocket.OPEN) {
+      ws.send(JSON.stringify({ type: 'focus', pid: s.pid }))
+    }
+  })
+  row.appendChild(jump)
+
   return row
 }
 
@@ -198,6 +225,7 @@ function buildSessionRow(s, kind) {
 
 document.addEventListener('contextmenu', function (e) {
   e.preventDefault()
+  updateModeLabel()
   ctxMenu.style.display = 'block'
   ctxMenu.style.left = e.clientX + 'px'
   ctxMenu.style.top = e.clientY + 'px'
@@ -215,6 +243,7 @@ if (window.parade && typeof window.parade.startDrag === 'function') {
   document.addEventListener('mousedown', function (e) {
     if (e.button !== 0) return // left button only
     if (e.target.closest('#ctx-menu')) return // don't drag from menu
+    if (e.target.closest('#close-btn')) return // don't drag from close btn
     var cornerEl = e.target.closest('[data-corner]')
     if (cornerEl && typeof window.parade.startResize === 'function') {
       window.parade.startResize(cornerEl.dataset.corner)
@@ -238,17 +267,19 @@ document.addEventListener('click', function () {
   ctxMenu.style.display = 'none'
 })
 
-ctxClose.addEventListener('click', function () {
-  ctxMenu.style.display = 'none'
+// ---------------------------------------------------------------------------
+// Close button (top-right corner)
+// ---------------------------------------------------------------------------
+
+closeBtn.addEventListener('click', function () {
   // POST /shutdown to stop the parade server — this releases the port and
   // tears down all connections. The electron window process polls /health
-  // every 1s; after 3 failures it quits, closing the overlay.
+  // every 1s; after 10 failures it quits, closing the overlay.
   fetch('http://localhost:' + port + '/shutdown', { method: 'POST' })
     .catch(function () {
       /* server may already be down */
     })
     .finally(function () {
-      // Also try window.close() — harmless if it no-ops (electron ignores it).
       try {
         window.close()
       } catch (_) {
@@ -257,6 +288,37 @@ ctxClose.addEventListener('click', function () {
     })
 })
 
+// ---------------------------------------------------------------------------
+// Dynamic / Static cube mode toggle
+// ---------------------------------------------------------------------------
+// Dynamic (default): cube rotates when sessions are running, static when idle.
+// Static (inverse): cube static when running, rotates when idle.
+// The context menu shows the *switchable* label (opposite of current mode).
+
+var cubeMode = 'dynamic'
+try {
+  cubeMode = localStorage.getItem('parade-cube-mode') || 'dynamic'
+} catch (_) {
+  /* localStorage may be unavailable */
+}
+
+function updateModeLabel() {
+  ctxMode.textContent = cubeMode === 'dynamic' ? 'Static' : 'Dynamic'
+}
+
+ctxMode.addEventListener('click', function () {
+  ctxMenu.style.display = 'none'
+  cubeMode = cubeMode === 'dynamic' ? 'static' : 'dynamic'
+  try {
+    localStorage.setItem('parade-cube-mode', cubeMode)
+  } catch (_) {
+    /* ignore */
+  }
+  updateModeLabel()
+})
+
+updateModeLabel()
+
 // ---------------------------------------------------------------------------
 // WebGL: Purple 3D Cube
 // ---------------------------------------------------------------------------
@@ -265,7 +327,6 @@ var gl = canvas.getContext('webgl') || canvas.getContext('experimental-webgl')
 var cubeProgram = null
 var cubeBuffer = null
 var cubeIndexBuffer = null
-var isRotating = false
 
 // Sync the canvas drawing buffer to its CSS display size × devicePixelRatio.
 // Without this, the canvas keeps its initial 240×320 buffer regardless of the
@@ -533,11 +594,14 @@ function mat4Multiply(a, b) {
 
 /**
  * Animation loop. Rotates the cube on X and Y axes (gyroscope-style)
- * only when runningCount > 0. Stops and holds orientation when no
- * sessions are running.
+ * based on the current cube mode:
+ *   Dynamic: rotate when runningCount > 0
+ *   Static:  rotate when runningCount === 0 (inverse)
  */
 function animate() {
-  if (runningCount > 0) {
+  var shouldRotate =
+    cubeMode === 'dynamic' ? runningCount > 0 : runningCount === 0
+  if (shouldRotate) {
     rotY += 0.025
     rotX += 0.012
   }

package/dist/parade/web/index.html

@@ -127,12 +127,18 @@
     font-size: 10.5px;
     line-height: 1.35;
     color: var(--text-dim);
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
     padding: 2px 0 2px 9px;
     position: relative;
     font-variant-numeric: tabular-nums;
+    display: flex;
+    align-items: center;
+  }
+  .session-text {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    min-width: 0;
   }
   .session-row::before {
     content: '';
@@ -216,6 +222,49 @@
     background: var(--purple);
     color: #fff;
   }
+
+  /* ---- Close button (top-right corner) ---- */
+  #close-btn {
+    position: fixed;
+    top: 4px;
+    right: 6px;
+    width: 16px;
+    height: 16px;
+    border-radius: 50%;
+    background: rgba(139, 92, 246, 0.15);
+    color: var(--purple-soft);
+    font-size: 13px;
+    line-height: 15px;
+    text-align: center;
+    cursor: pointer;
+    z-index: 300;
+    transition: all 0.15s ease;
+    opacity: 0;
+    border: 1px solid rgba(139, 92, 246, 0.2);
+  }
+  body:hover #close-btn { opacity: 0.5; }
+  body #close-btn:hover {
+    opacity: 1;
+    background: rgba(139, 92, 246, 0.4);
+    color: #fff;
+    box-shadow: 0 0 8px var(--purple-glow);
+    transform: scale(1.15);
+  }
+
+  /* ---- Session jump icon ---- */
+  .session-jump {
+    display: inline-block;
+    margin-left: auto;
+    padding-left: 4px;
+    cursor: pointer;
+    opacity: 0;
+    color: var(--purple-soft);
+    font-size: 9px;
+    transition: opacity 0.15s;
+    flex-shrink: 0;
+  }
+  .session-row:hover .session-jump { opacity: 0.7; }
+  .session-row:hover .session-jump:hover { opacity: 1; }
 </style>
 </head>
 <body>
@@ -235,8 +284,9 @@
     <div id="more-line"></div>
   </div>
   <div id="ctx-menu">
-    <div class="ctx-item" id="ctx-close">Close</div>
+    <div class="ctx-item" id="ctx-mode">Static</div>
   </div>
+  <div id="close-btn" title="Close parade">×</div>
   <div id="ws-status" title="WS: connecting"></div>
   <!-- Corner resize handles: invisible hit areas at each corner -->
   <div class="corner-handle corner-tl" data-corner="tl"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@saluzi/saluzi-edu",
-  "version": "0.1.74",
+  "version": "0.1.76",
   "description": "Saluzi CLI - interactive AI coding assistant in the terminal",
   "license": "MIT",
   "type": "module",