LumenX · CompareModal

候选对比模态 · CompareModal

对同一镜头的多条视频候选并排对比。Shift+点击候选缩略图加入对比集(≥2 触发)。源组件 shot-panel/CompareModal.tsx,最多 4 路、纯视频(不含图像对比)、主从同步时钟。

⚠ 与现状的差异 & 交互风险(落地前必读)

本补稿严格还原现有 CompareModal.tsx,仅做主题化换肤。以下逐项标注与「现状/我先前假设」的差异及风险等级。

维度现状(真实组件)本补稿处理风险
媒体类型纯视频对比(仅渲染 <video>),图像对比走 Lightbox,不在此模态用静态图占位代替视频帧,明确标注「纯视频」;保留 no video url 降级格一致
对比路数硬上限 4;布局 1 列 / 2 列 / 2×2(3 与 4 同为 2×2)展示满 4 路 2×2,含一格降级;未做 1×3 行布局(与代码一致)一致
同步/独立默认 Synced(#1 为主时钟,漂移>50ms 校正);切 Indep. 后底部进度条变文字顶部 Sync 按钮 + 状态徽章联动;底部进度条 ↔ 「Independent timelines」文案切换(演示用 JS)
Solo 行为S 键循环 0→1→…→N-1→null(全静音);选中格 unmute,其余静音Solo 按钮文字 Mute↔Solo N,选中格描边高亮;逻辑与键盘 S 等价
星标只读★ 仅作只读展示(top-left chip),此模态内无星标/Pin 切换,操作在 CandidateThumb★ 仅展示,不放任何切换控件(防误导)一致
标题文案「Compare N candidates」为硬编码英文,非 i18n补稿沿用原文仅为视觉保真;落地 MUST 抽取为 i18n 键(next-intl)并补 CN/EN,硬编码英文属待修复缺陷落地须 i18n 化
布局变化整体结构、层级、控件位置 1:1 还原,仅颜色走 token。无布局重构一致