c3b087020d
UPIA stacks every install in its own
C:\Program Files\...\UXP\Plugins\External\net.wilddragon.dragonflight.uxp_<version>\
folder without removing prior versions. After 10 deploys today there are
11 of them coexisting, and Premiere's loader can pick the wrong one,
which is why v2.1.8 didn't appear to land.
This change makes the running version visible at a glance:
- main.js reads manifest.json at runtime via require('uxp').storage
.localFileSystem.getPluginFolder() so the displayed version is
whatever Premiere actually loaded — never a hand-edited constant
that could drift.
- index.html adds #panel-version inside the status strip (between
host and ⋯) and #brand-version below the brand tag on connect.
- styles.css: small mono chip in --text-4, low key but readable.
If the chip ever shows the wrong version we know the loader picked
a stale dir; if it shows nothing the manifest read itself failed.
The install script needs to remove old _<version> dirs going forward;
the next commit will add that cleanup step to the deploy.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
238 lines
11 KiB
HTML
238 lines
11 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<title>Dragonflight MAM</title>
|
||
<link rel="stylesheet" href="styles.css" />
|
||
</head>
|
||
<body>
|
||
<div id="root">
|
||
|
||
<!-- ── Connect Pane ─────────────────────────────────────────────── -->
|
||
<section id="connect-pane" class="pane">
|
||
<div class="brand">
|
||
<div class="brand-icon">
|
||
<svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
|
||
<path d="M23 7l-7 5 7 5V7z"/><rect x="1" y="5" width="15" height="14" rx="2"/>
|
||
</svg>
|
||
</div>
|
||
<div class="brand-title">Dragonflight</div>
|
||
<div class="brand-tag">Wild Dragon Broadcast</div>
|
||
<div class="brand-version" id="brand-version"></div>
|
||
</div>
|
||
<label class="field-label" for="server-url">Server URL</label>
|
||
<input id="server-url" type="text" placeholder="https://dragonflight.live" />
|
||
<label class="field-label" for="api-token">API Token</label>
|
||
<input id="api-token" type="password" placeholder="Bearer token from web UI" autocomplete="off" />
|
||
<button id="connect-btn" class="btn btn-primary" disabled>Connect</button>
|
||
<div id="connect-status" class="status-msg muted"></div>
|
||
</section>
|
||
|
||
<!-- ── Library Pane ─────────────────────────────────────────────── -->
|
||
<section id="library-pane" class="pane hidden">
|
||
|
||
<!-- Connection status strip (v2.1.8): dot + identity + ⋯ menu.
|
||
Disconnect lives inside the menu so it's not always visible. -->
|
||
<header class="status-strip">
|
||
<span class="signal-dot"></span>
|
||
<span id="connected-host" class="connected-host"></span>
|
||
<span id="panel-version" class="panel-version" title="Plugin version"></span>
|
||
<button id="menu-btn" class="btn-ghost" title="More" aria-label="More">⋯</button>
|
||
<div id="status-menu" class="menu hidden" role="menu">
|
||
<button id="disconnect-btn" class="menu-item" role="menuitem">Disconnect</button>
|
||
</div>
|
||
</header>
|
||
|
||
<!-- Tabs -->
|
||
<div class="tab-nav">
|
||
<button id="tab-library" class="tab-btn active">
|
||
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/>
|
||
</svg>
|
||
Library
|
||
</button>
|
||
<button id="tab-growing" class="tab-btn">
|
||
<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||
<path d="M23 7l-7 5 7 5V7z"/><rect x="1" y="5" width="15" height="14" rx="2" ry="2"/>
|
||
</svg>
|
||
Growing
|
||
<span id="growing-count" class="badge" style="display:none">0</span>
|
||
</button>
|
||
</div>
|
||
|
||
<!-- Search + Project filter -->
|
||
<div class="search-row">
|
||
<input id="search-input" type="search" placeholder="Search assets…" />
|
||
<select id="project-filter" title="Filter by project">
|
||
<option value="all">All Projects</option>
|
||
</select>
|
||
<button id="refresh-btn" class="btn btn-icon" title="Refresh">↻</button>
|
||
</div>
|
||
|
||
<!-- Active sequence info bar -->
|
||
<div id="seq-info-bar" class="seq-info-bar hidden">
|
||
<span class="chip chip-ok">SEQ</span>
|
||
<span id="seq-info-name" class="seq-info-name"></span>
|
||
</div>
|
||
|
||
<!-- Asset grid (library tab) -->
|
||
<div id="library-container" class="grid-container">
|
||
<div id="asset-grid" class="asset-grid">
|
||
<div class="empty muted">Loading…</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Growing grid -->
|
||
<div id="growing-container" class="grid-container hidden">
|
||
<div id="growing-grid" class="asset-grid">
|
||
<div class="empty muted">No growing files</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Asset details panel -->
|
||
<div id="details-panel" class="details-panel hidden">
|
||
<div class="details-header">Asset Info</div>
|
||
<div class="details-row"><span class="dl">Filename</span><span id="d-filename" class="dv"></span></div>
|
||
<div class="details-row"><span class="dl">Codec</span><span id="d-codec" class="dv"></span></div>
|
||
<div class="details-row"><span class="dl">Resolution</span><span id="d-res" class="dv"></span></div>
|
||
<div class="details-row"><span class="dl">FPS</span><span id="d-fps" class="dv"></span></div>
|
||
<div class="details-row"><span class="dl">Duration</span><span id="d-dur" class="dv"></span></div>
|
||
<div class="details-row"><span class="dl">Size</span><span id="d-size" class="dv"></span></div>
|
||
<div class="details-row"><span class="dl">Tags</span><div id="d-tags" class="tags-row"></div></div>
|
||
</div>
|
||
|
||
<!-- Action buttons -->
|
||
<footer class="actions">
|
||
<div class="action-row">
|
||
<button id="import-proxy-btn" class="btn btn-primary" disabled>Import Proxy</button>
|
||
<button id="import-hires-btn" class="btn btn-secondary" disabled>Hi-Res</button>
|
||
</div>
|
||
<div class="action-row">
|
||
<button id="mount-live-btn" class="btn btn-secondary" disabled title="Open live file from SMB share">Mount Live</button>
|
||
<button id="relink-btn" class="btn btn-secondary" disabled title="Relink proxy → hi-res original">Relink Hi-Res</button>
|
||
</div>
|
||
<div class="action-row">
|
||
<button id="import-all-btn" class="btn btn-secondary" disabled>Import All</button>
|
||
<button id="export-timeline-btn" class="btn btn-secondary" disabled>Export Timeline ↑</button>
|
||
</div>
|
||
|
||
<!-- Progress -->
|
||
<div id="progress-row" class="progress-row hidden">
|
||
<div class="progress-bar"><div id="progress-fill"></div></div>
|
||
<div id="progress-label" class="progress-label">…</div>
|
||
</div>
|
||
|
||
<!-- Toast -->
|
||
<div id="toast" class="toast hidden"></div>
|
||
</footer>
|
||
|
||
<!-- Advanced section -->
|
||
<div class="advanced-section">
|
||
<div class="advanced-title">Advanced</div>
|
||
<div class="action-row">
|
||
<button id="export-conform-btn" class="btn btn-secondary btn-sm" disabled>Export & Conform</button>
|
||
<button id="fetch-relink-btn" class="btn btn-secondary btn-sm" disabled>Fetch & Relink All</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- ── Export Timeline Slide Panel ──────────────────────────────── -->
|
||
<div id="export-overlay" class="slide-overlay hidden"></div>
|
||
<div id="export-panel" class="slide-panel hidden">
|
||
<div class="slide-header">
|
||
<span class="slide-title">Push Timeline to MAM</span>
|
||
<button id="export-close-btn" class="btn btn-icon">✕</button>
|
||
</div>
|
||
<div class="slide-body">
|
||
<label class="field-label">Sequence name</label>
|
||
<input id="export-seq-name" type="text" placeholder="Sequence 1" />
|
||
<label class="field-label">Target project</label>
|
||
<select id="export-proj-select"><option value="">— Select project —</option></select>
|
||
<div id="export-clip-info" class="clip-info"></div>
|
||
</div>
|
||
<div class="slide-footer">
|
||
<button id="export-cancel-btn" class="btn btn-secondary">Cancel</button>
|
||
<button id="export-confirm-btn" class="btn btn-primary">Push to MAM</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ── Export & Conform Slide Panel ─────────────────────────────── -->
|
||
<div id="conform-overlay" class="slide-overlay hidden"></div>
|
||
<div id="conform-panel" class="slide-panel hidden">
|
||
<div class="slide-header">
|
||
<span class="slide-title">Export & Conform</span>
|
||
<button id="conform-close-btn" class="btn btn-icon">✕</button>
|
||
</div>
|
||
<div class="slide-body">
|
||
<label class="field-label">Target project</label>
|
||
<select id="conform-proj-select"><option value="">— Select project —</option></select>
|
||
<label class="field-label">Preset</label>
|
||
<div id="preset-cards" class="preset-grid">
|
||
<div class="preset-card selected" data-preset="broadcast"><div class="pc-title">Broadcast</div><div class="pc-desc">ProRes 422 HQ · 1080p · 48kHz</div></div>
|
||
<div class="preset-card" data-preset="web"><div class="pc-title">Web</div><div class="pc-desc">H.264 · 1080p · AAC 320k</div></div>
|
||
<div class="preset-card" data-preset="archive"><div class="pc-title">Archive</div><div class="pc-desc">ProRes 4444 · UHD · 48kHz</div></div>
|
||
<div class="preset-card" data-preset="custom"><div class="pc-title">Custom</div><div class="pc-desc">Manual settings</div></div>
|
||
</div>
|
||
<label class="field-label">Codec</label>
|
||
<select id="conform-codec">
|
||
<option value="prores_hq">ProRes 422 HQ</option>
|
||
<option value="prores_4444">ProRes 4444</option>
|
||
<option value="h264">H.264</option>
|
||
<option value="h265">H.265 / HEVC</option>
|
||
<option value="dnxhr_hq">DNxHR HQ</option>
|
||
</select>
|
||
<label class="field-label">Quality</label>
|
||
<select id="conform-quality">
|
||
<option value="high">High</option>
|
||
<option value="medium" selected>Medium</option>
|
||
<option value="low">Low</option>
|
||
</select>
|
||
<label class="field-label">Resolution</label>
|
||
<select id="conform-resolution">
|
||
<option value="uhd">UHD (3840×2160)</option>
|
||
<option value="1080p" selected>Full HD (1920×1080)</option>
|
||
<option value="720p">HD (1280×720)</option>
|
||
<option value="source">Source</option>
|
||
</select>
|
||
<label class="field-label">Audio</label>
|
||
<select id="conform-audio">
|
||
<option value="broadcast">Broadcast (48kHz PCM)</option>
|
||
<option value="web">Web (AAC 320k)</option>
|
||
<option value="archive">Archive (96kHz PCM)</option>
|
||
</select>
|
||
<div id="conform-clip-info" class="clip-info"></div>
|
||
</div>
|
||
<div class="slide-footer">
|
||
<button id="conform-cancel-btn" class="btn btn-secondary">Cancel</button>
|
||
<button id="conform-start-btn" class="btn btn-primary" disabled>Start Conform</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- ── Fetch & Relink Slide Panel ───────────────────────────────── -->
|
||
<div id="relink-overlay" class="slide-overlay hidden"></div>
|
||
<div id="relink-panel" class="slide-panel hidden">
|
||
<div class="slide-header">
|
||
<span class="slide-title">Fetch & Relink Hi-Res</span>
|
||
<button id="relink-close-btn" class="btn btn-icon">✕</button>
|
||
</div>
|
||
<div class="slide-body">
|
||
<div class="field-label" style="margin-bottom:6px">Select clips to upgrade to hi-res:</div>
|
||
<div id="clip-list" class="clip-list"></div>
|
||
<div id="relink-summary" class="relink-summary hidden"></div>
|
||
</div>
|
||
<div class="slide-footer">
|
||
<button id="relink-cancel-btn" class="btn btn-secondary">Cancel</button>
|
||
<button id="relink-start-btn" class="btn btn-primary" disabled>Start Relink</button>
|
||
</div>
|
||
</div>
|
||
|
||
</div><!-- /#root -->
|
||
|
||
<script src="src/ui.js"></script>
|
||
<script src="src/api.js"></script>
|
||
<script src="src/library.js"></script>
|
||
<script src="src/import-flow.js"></script>
|
||
<script src="src/timeline.js"></script>
|
||
<script src="src/main.js"></script>
|
||
</body>
|
||
</html>
|