mirror of
https://github.com/Ark0N/Codeman.git
synced 2026-10-04 14:39:42 +02:00
feat: matrix-style subagent connection lines + smart window layout
Subagent windows now visually connect to their parent session tabs with glowing matrix-green lines that pulse with life. Windows automatically arrange in a non-overlapping grid, and each shows its origin with a clickable "from [session]" header. Watch your AI agents spawn and dance across the screen, tethered to their creators by neon threads of digital consciousness. Changes: - Matrix green (#00ff41) connection lines with glow effect - Smart grid positioning prevents window overlap - Smaller default window size (420x350) for better density - Auto-sizing activity columns for cleaner logs Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
+11
-3
@@ -5098,10 +5098,18 @@ class ClaudemanApp {
|
||||
const agent = this.subagents.get(agentId);
|
||||
if (!agent) return;
|
||||
|
||||
// Calculate final position (cascade from top-left)
|
||||
// Calculate final position - grid layout to avoid overlaps
|
||||
const windowCount = this.subagentWindows.size;
|
||||
const finalX = 50 + (windowCount % 5) * 30;
|
||||
const finalY = 100 + (windowCount % 5) * 30;
|
||||
const windowWidth = 420;
|
||||
const windowHeight = 350;
|
||||
const gap = 20;
|
||||
const startX = 50;
|
||||
const startY = 120;
|
||||
const maxCols = Math.floor((window.innerWidth - startX - 50) / (windowWidth + gap)) || 1;
|
||||
const col = windowCount % maxCols;
|
||||
const row = Math.floor(windowCount / maxCols);
|
||||
const finalX = startX + col * (windowWidth + gap);
|
||||
const finalY = startY + row * (windowHeight + gap);
|
||||
|
||||
// Get parent tab position for spawn animation
|
||||
const parentTab = agent.parentSessionId
|
||||
|
||||
@@ -3819,10 +3819,10 @@ kbd {
|
||||
|
||||
.subagent-window {
|
||||
position: fixed;
|
||||
width: 500px;
|
||||
height: 400px;
|
||||
min-width: 300px;
|
||||
min-height: 200px;
|
||||
width: 420px;
|
||||
height: 350px;
|
||||
min-width: 280px;
|
||||
min-height: 180px;
|
||||
background: var(--bg-card);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 8px;
|
||||
@@ -3980,17 +3980,19 @@ kbd {
|
||||
}
|
||||
|
||||
.connection-line {
|
||||
stroke: var(--accent);
|
||||
stroke: #00ff41;
|
||||
stroke-width: 2;
|
||||
stroke-dasharray: 5 3;
|
||||
fill: none;
|
||||
opacity: 0.5;
|
||||
transition: opacity 0.2s, stroke-width 0.2s;
|
||||
opacity: 0.6;
|
||||
filter: drop-shadow(0 0 3px #00ff41);
|
||||
transition: opacity 0.2s, stroke-width 0.2s, filter 0.2s;
|
||||
}
|
||||
|
||||
.connection-line:hover {
|
||||
opacity: 0.8;
|
||||
opacity: 1;
|
||||
stroke-width: 3;
|
||||
filter: drop-shadow(0 0 6px #00ff41);
|
||||
}
|
||||
|
||||
.connection-line.spawning-line {
|
||||
|
||||
Reference in New Issue
Block a user