chore: bump version to 0.1505

CLAUDE.md

@@ -25,7 +25,7 @@ When user says "COM":
 1. Increment version in BOTH `package.json` AND `CLAUDE.md` (verify they match with `grep version package.json && grep Version CLAUDE.md`)
 2. Run: `git add -A && git commit -m "chore: bump version to X.XXXX" && git push && npm run build && systemctl --user restart claudeman-web`
 
-**Version**: 0.1504 (must match `package.json` for npm publish)
+**Version**: 0.1505 (must match `package.json` for npm publish)
 
 ## Project Overview
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "claudeman",
-  "version": "0.1504",
+  "version": "0.1505",
   "description": "The missing control plane for Claude Code - run 20 autonomous agents with real-time monitoring and session persistence",
   "type": "module",
   "main": "dist/index.js",

src/web/public/app.js

@@ -3811,42 +3811,6 @@ class ClaudemanApp {
 
     const selectGen = ++this._selectGeneration;
 
-    // Green fade overlay — Web Animations API for reliable GPU compositing.
-    // (CSS keyframe animations were invisible: black-on-black had zero contrast.)
-    const fadeCfg = this.loadAppSettingsFromStorage();
-    const fadeEnabled = fadeCfg.tabFadeEnabled ?? true;
-    const fadeInDur = fadeCfg.tabFadeInDuration ?? 250;
-    const fadeInEase = fadeCfg.tabFadeInEasing || 'ease-in';
-    const fadeOutDur = fadeCfg.tabFadeOutDuration ?? 120;
-    const fadeOutEase = fadeCfg.tabFadeOutEasing || 'ease-in';
-    const main = document.querySelector('.main');
-    let fade = null;
-    const fadeOutPromise = new Promise(resolve => {
-      if (main && fadeEnabled) {
-        const prev = main.querySelector('.tab-switch-fade');
-        if (prev) prev.remove();
-        fade = document.createElement('div');
-        fade.className = 'tab-switch-fade';
-        fade.style.opacity = '0';
-        fade.style.willChange = 'opacity';
-        fade.style.transform = 'translateZ(0)'; // force own GPU layer
-        main.appendChild(fade);
-
-        // Web Animations API — runs on compositor thread, bypasses containment issues
-        const anim = fade.animate(
-          [{ opacity: 0 }, { opacity: 1 }],
-          { duration: fadeInDur, easing: fadeInEase, fill: 'forwards' }
-        );
-        anim.finished.then(resolve).catch(resolve);
-        setTimeout(resolve, fadeInDur + 100); // safety fallback
-      } else {
-        resolve();
-      }
-    });
-
-    // Yield to browser so it paints the fade overlay at opacity 0 and starts
-    // animating BEFORE the heavy sync work below (renderSessionTabs etc).
-    await new Promise(r => requestAnimationFrame(r));
     if (selectGen !== this._selectGeneration) return; // newer tab switch won
 
     // Clean up flicker filter state when switching sessions
@@ -3900,7 +3864,6 @@ class ClaudemanApp {
     // Load terminal buffer for this session
     // Show cached content instantly while fetching fresh data in background.
     // Use tail mode for faster initial load (256KB is enough for recent visible content).
-    // Fetch runs in parallel with fade-out; we wait for both before clearing terminal.
     try {
       // Instant cache restore — show previous buffer immediately while network fetch runs
       const cachedBuffer = this.terminalBufferCache.get(sessionId);
@@ -3912,10 +3875,7 @@ class ClaudemanApp {
       }
 
       const tailSize = 256 * 1024;
-      const [res] = await Promise.all([
-        fetch(`/api/sessions/${sessionId}/terminal?tail=${tailSize}`),
-        fadeOutPromise,
-      ]);
+      const res = await fetch(`/api/sessions/${sessionId}/terminal?tail=${tailSize}`);
       if (selectGen !== this._selectGeneration) return; // stale — newer selectSession won
       const data = await res.json();
 
@@ -4004,18 +3964,8 @@ class ClaudemanApp {
 
       this.terminal.focus();
       this.terminal.scrollToBottom();
-
-      // Reveal new content — green fade dissolves out via WAAPI
-      if (fade) {
-        const revealAnim = fade.animate(
-          [{ opacity: 1 }, { opacity: 0 }],
-          { duration: fadeOutDur, easing: fadeOutEase, fill: 'forwards' }
-        );
-        revealAnim.finished.then(() => fade.remove()).catch(() => fade.remove());
-      }
     } catch (err) {
       console.error('Failed to load session terminal:', err);
-      if (fade) fade.remove();
     }
   }
 
@@ -9092,12 +9042,6 @@ class ClaudemanApp {
     document.getElementById('appSettingsSubagentTracking').checked = settings.subagentTrackingEnabled ?? true;
     document.getElementById('appSettingsSubagentActiveTabOnly').checked = settings.subagentActiveTabOnly ?? true;
     document.getElementById('appSettingsImageWatcherEnabled').checked = settings.imageWatcherEnabled ?? false;
-    // Tab switch animation settings
-    document.getElementById('appSettingsTabFadeEnabled').checked = settings.tabFadeEnabled ?? true;
-    document.getElementById('appSettingsTabFadeInDuration').value = settings.tabFadeInDuration ?? 250;
-    document.getElementById('appSettingsTabFadeInEasing').value = settings.tabFadeInEasing || 'ease-in';
-    document.getElementById('appSettingsTabFadeOutDuration').value = settings.tabFadeOutDuration ?? 120;
-    document.getElementById('appSettingsTabFadeOutEasing').value = settings.tabFadeOutEasing || 'ease-in';
     // Claude CLI settings
     const claudeModeSelect = document.getElementById('appSettingsClaudeMode');
     const allowedToolsRow = document.getElementById('allowedToolsRow');
@@ -9223,12 +9167,6 @@ class ClaudemanApp {
       subagentTrackingEnabled: document.getElementById('appSettingsSubagentTracking').checked,
       subagentActiveTabOnly: document.getElementById('appSettingsSubagentActiveTabOnly').checked,
       imageWatcherEnabled: document.getElementById('appSettingsImageWatcherEnabled').checked,
-      // Tab switch animation settings
-      tabFadeEnabled: document.getElementById('appSettingsTabFadeEnabled').checked,
-      tabFadeInDuration: parseInt(document.getElementById('appSettingsTabFadeInDuration').value) || 250,
-      tabFadeInEasing: document.getElementById('appSettingsTabFadeInEasing').value || 'ease-in',
-      tabFadeOutDuration: parseInt(document.getElementById('appSettingsTabFadeOutDuration').value) || 120,
-      tabFadeOutEasing: document.getElementById('appSettingsTabFadeOutEasing').value || 'ease-in',
       // Claude CLI settings
       claudeMode: document.getElementById('appSettingsClaudeMode').value,
       allowedTools: document.getElementById('appSettingsAllowedTools').value.trim(),

src/web/public/index.html

@@ -731,7 +731,6 @@
         </div>
         <div class="modal-tabs">
           <button class="modal-tab-btn active" data-tab="settings-display">Display</button>
-          <button class="modal-tab-btn" data-tab="settings-tab-switch">Tab-Switch</button>
           <button class="modal-tab-btn" data-tab="settings-claude">Claude CLI</button>
           <button class="modal-tab-btn" data-tab="settings-models">Models</button>
           <button class="modal-tab-btn" data-tab="settings-paths">Paths</button>
@@ -832,52 +831,6 @@
             </div>
           </div>
           <!-- Tab-Switch Tab -->
-          <div class="modal-tab-content hidden" id="settings-tab-switch">
-            <div class="settings-grid">
-              <div class="settings-section-header">Tab Switch Animation</div>
-              <div class="settings-item" title="Green fade overlay when switching session tabs">
-                <span class="settings-item-label">Enable</span>
-                <label class="switch switch-sm">
-                  <input type="checkbox" id="appSettingsTabFadeEnabled" checked>
-                  <span class="slider"></span>
-                </label>
-              </div>
-              <div class="settings-item" title="Fade-in duration in milliseconds">
-                <span class="settings-item-label">Fade In</span>
-                <div class="settings-item-actions">
-                  <input type="number" id="appSettingsTabFadeInDuration" class="settings-item-input" value="250" min="50" max="1000" step="10">
-                  <span style="font-size: 0.65rem; color: var(--text-muted);">ms</span>
-                </div>
-              </div>
-              <div class="settings-item" title="Fade-in easing curve">
-                <span class="settings-item-label">Fade In Easing</span>
-                <select id="appSettingsTabFadeInEasing" class="settings-item-input" style="width: 100px; padding: 0.25rem 0.4rem; font-size: 0.7rem; background: var(--bg-input); border: 1px solid var(--border); border-radius: 3px; color: var(--text);">
-                  <option value="linear">linear</option>
-                  <option value="ease">ease</option>
-                  <option value="ease-in">ease-in</option>
-                  <option value="ease-out">ease-out</option>
-                  <option value="ease-in-out">ease-in-out</option>
-                </select>
-              </div>
-              <div class="settings-item" title="Fade-out (reveal) duration in milliseconds">
-                <span class="settings-item-label">Fade Out</span>
-                <div class="settings-item-actions">
-                  <input type="number" id="appSettingsTabFadeOutDuration" class="settings-item-input" value="120" min="50" max="1000" step="10">
-                  <span style="font-size: 0.65rem; color: var(--text-muted);">ms</span>
-                </div>
-              </div>
-              <div class="settings-item" title="Fade-out easing curve">
-                <span class="settings-item-label">Fade Out Easing</span>
-                <select id="appSettingsTabFadeOutEasing" class="settings-item-input" style="width: 100px; padding: 0.25rem 0.4rem; font-size: 0.7rem; background: var(--bg-input); border: 1px solid var(--border); border-radius: 3px; color: var(--text);">
-                  <option value="linear">linear</option>
-                  <option value="ease">ease</option>
-                  <option value="ease-in">ease-in</option>
-                  <option value="ease-out">ease-out</option>
-                  <option value="ease-in-out">ease-in-out</option>
-                </select>
-              </div>
-            </div>
-          </div>
           <!-- Claude CLI Tab -->
           <div class="modal-tab-content hidden" id="settings-claude">
             <div class="form-row">

src/web/public/styles.css

@@ -1682,18 +1682,6 @@ body {
      when surrounding UI elements update during typing. */
   will-change: contents;
 }
-/* Tab switch: green-tinted overlay fades in over old content, fades out to reveal new.
-   Animated via Web Animations API (not CSS keyframes) for reliable GPU compositing.
-   Green glow is visible against the dark terminal — black-on-black was imperceptible. */
-.tab-switch-fade {
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-  z-index: 100;
-  background: radial-gradient(ellipse at center, rgba(20, 80, 40, 0.85) 0%, rgba(0, 5, 2, 0.97) 75%);
-  box-shadow: inset 0 0 150px 60px rgba(34, 197, 94, 0.35);
-}
-
 .terminal-container .xterm {
   height: 100%;
   padding: 0;