- Replace 6847-line monolithic server.py with 26-line entry point - All routes now in app/routers/ using Jinja2 templates - Add plan_node.html template for step details - Add plan node route to runs router with cache_id lookup - Backup old server as server_legacy.py 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
100 lines
4.4 KiB
HTML
100 lines
4.4 KiB
HTML
{# Plan node detail panel - loaded via HTMX #}
|
|
{% set status_color = 'green' if status in ('cached', 'completed') else 'yellow' %}
|
|
|
|
<div class="flex justify-between items-start mb-4">
|
|
<div>
|
|
<h4 class="text-lg font-semibold text-white">{{ step.name or step.step_id[:20] }}</h4>
|
|
<div class="flex items-center gap-2 mt-1">
|
|
<span class="px-2 py-0.5 rounded text-xs text-white" style="background-color: {{ node_color }}">
|
|
{{ step.node_type or 'EFFECT' }}
|
|
</span>
|
|
<span class="text-{{ status_color }}-400 text-xs">{{ status }}</span>
|
|
<span class="text-gray-500 text-xs">Level {{ step.level or 0 }}</span>
|
|
</div>
|
|
</div>
|
|
<button onclick="closeNodeDetail()" class="text-gray-400 hover:text-white p-1">
|
|
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
|
|
{# Output preview #}
|
|
{% if output_preview %}
|
|
<div class="mb-4">
|
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Output</h5>
|
|
{% if output_media_type == 'video' %}
|
|
<video src="/cache/{{ cache_id }}/raw" controls muted class="w-full max-h-48 rounded-lg"></video>
|
|
{% elif output_media_type == 'image' %}
|
|
<img src="/cache/{{ cache_id }}/raw" class="w-full max-h-48 rounded-lg object-contain">
|
|
{% elif output_media_type == 'audio' %}
|
|
<audio src="/cache/{{ cache_id }}/raw" controls class="w-full"></audio>
|
|
{% endif %}
|
|
</div>
|
|
{% elif ipfs_cid %}
|
|
<div class="mb-4">
|
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Output (IPFS)</h5>
|
|
<video src="{{ ipfs_gateway }}/{{ ipfs_cid }}" controls muted class="w-full max-h-48 rounded-lg"></video>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Output link #}
|
|
{% if ipfs_cid %}
|
|
<a href="/ipfs/{{ ipfs_cid }}" class="flex items-center justify-between bg-gray-800 rounded p-2 hover:bg-gray-700 transition-colors text-xs mb-4">
|
|
<span class="font-mono text-gray-300 truncate">{{ ipfs_cid[:24] }}...</span>
|
|
<span class="px-2 py-1 bg-blue-600 text-white rounded ml-2">View</span>
|
|
</a>
|
|
{% elif has_cached and cache_id %}
|
|
<a href="/cache/{{ cache_id }}" class="flex items-center justify-between bg-gray-800 rounded p-2 hover:bg-gray-700 transition-colors text-xs mb-4">
|
|
<span class="font-mono text-gray-300 truncate">{{ cache_id[:24] }}...</span>
|
|
<span class="px-2 py-1 bg-blue-600 text-white rounded ml-2">View</span>
|
|
</a>
|
|
{% endif %}
|
|
|
|
{# Input media previews #}
|
|
{% if inputs %}
|
|
<div class="mt-4">
|
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Inputs ({{ inputs|length }})</h5>
|
|
<div class="grid grid-cols-2 gap-2">
|
|
{% for inp in inputs %}
|
|
<a href="/cache/{{ inp.cache_id }}" class="block bg-gray-800 rounded-lg overflow-hidden hover:bg-gray-700 transition-colors">
|
|
{% if inp.media_type == 'video' %}
|
|
<video src="/cache/{{ inp.cache_id }}/raw" class="w-full h-20 object-cover rounded-t" muted></video>
|
|
{% elif inp.media_type == 'image' %}
|
|
<img src="/cache/{{ inp.cache_id }}/raw" class="w-full h-20 object-cover rounded-t">
|
|
{% else %}
|
|
<div class="w-full h-20 bg-gray-700 rounded-t flex items-center justify-center text-xs text-gray-400">
|
|
{{ inp.media_type or 'File' }}
|
|
</div>
|
|
{% endif %}
|
|
<div class="p-2">
|
|
<div class="text-xs text-white truncate">{{ inp.name }}</div>
|
|
<div class="text-xs text-gray-500 font-mono truncate">{{ inp.cache_id[:12] }}...</div>
|
|
</div>
|
|
</a>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Parameters/Config #}
|
|
{% if config %}
|
|
<div class="mt-4">
|
|
<h5 class="text-sm font-medium text-gray-400 mb-2">Parameters</h5>
|
|
<div class="bg-gray-800 rounded p-3 text-xs space-y-1">
|
|
{% for key, value in config.items() %}
|
|
<div class="flex justify-between">
|
|
<span class="text-gray-400">{{ key }}:</span>
|
|
<span class="text-white">{{ value if value is string else value|tojson }}</span>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{# Metadata #}
|
|
<div class="mt-4 text-xs text-gray-500 space-y-1">
|
|
<div><span class="text-gray-400">Step ID:</span> <span class="font-mono">{{ step.step_id[:32] }}...</span></div>
|
|
<div><span class="text-gray-400">Cache ID:</span> <span class="font-mono">{{ cache_id[:32] }}...</span></div>
|
|
</div>
|