feat: editor coming-soon bumper + embedded Premiere panel downloads

- Editor: overlay Coming Soon screen over NLE timeline (code preserved,
  bumper sits at z-index 100 with backdrop blur). Links to download
  ZXP and Windows installer directly from the bumper.

- Settings → Capture SDKs: new Premiere Panel section lists v1.0.0
  and v1.0.1 with ZXP + Windows Installer download buttons.
  Both releases embedded as static files in web-ui under /downloads/.

- nginx: /downloads/ location serves files as Content-Disposition
  attachment with 24h cache.

Files added:
  services/web-ui/public/downloads/dragonflight-premiere-panel-1.0.0.zxp
  services/web-ui/public/downloads/dragonflight-premiere-panel-1.0.0-windows-setup.exe
  services/web-ui/public/downloads/dragonflight-premiere-panel-1.0.1.zxp
  services/web-ui/public/downloads/dragonflight-premiere-panel-1.0.1-windows-setup.exe
This commit is contained in:
Zac Gaetano 2026-05-26 14:34:28 +00:00
parent 8e0e94de3d
commit 07f8ffa6d5
7 changed files with 102 additions and 0 deletions

View file

@ -83,6 +83,12 @@ server {
proxy_request_buffering off;
}
# Premiere panel downloads served as binary attachments
location /downloads/ {
add_header Cache-Control "public, max-age=86400";
add_header Content-Disposition 'attachment';
}
# SPA fallback - try to serve file, else route to the React shell.
location / {
try_files $uri $uri/ /index.html;

View file

@ -1483,6 +1483,24 @@ const SDK_VENDORS = [
},
];
// Premiere panel releases embedded in the deployment
const PREMIERE_RELEASES = [
{
version: '1.0.1',
zxp: '/downloads/dragonflight-premiere-panel-1.0.1.zxp',
installer: '/downloads/dragonflight-premiere-panel-1.0.1-windows-setup.exe',
notes: 'Latest — auto-relinking, growing-file support, batch trim',
latest: true,
},
{
version: '1.0.0',
zxp: '/downloads/dragonflight-premiere-panel-1.0.0.zxp',
installer: '/downloads/dragonflight-premiere-panel-1.0.0-windows-setup.exe',
notes: 'Initial release',
latest: false,
},
];
function SdkSettingsCard() {
const [statuses, setStatuses] = React.useState(null);
const [msg, setMsg] = React.useState(null);
@ -1496,6 +1514,41 @@ function SdkSettingsCard() {
return (
<SettingsCard icon="video" title="Capture SDKs" sub="Vendor SDKs are licensed — upload them here so the capture container can build with hardware support"
tag={<span className="badge neutral">{SDK_VENDORS.length} vendors</span>}>
{/* ── Premiere Panel download section ── */}
<div style={{ marginBottom: 18 }}>
<div style={{ fontSize: 12, fontWeight: 600, color: 'var(--text-2)', marginBottom: 8, textTransform: 'uppercase', letterSpacing: '0.06em' }}>
Premiere Pro Panel
</div>
<div style={{ fontSize: 12, color: 'var(--text-3)', lineHeight: 1.55, marginBottom: 10 }}>
The Dragonflight CEP panel enables growing-file editing, batch trim, and one-click hi-res relink directly inside Premiere Pro.
Install the <strong style={{ color: 'var(--text-2)' }}>.zxp</strong> via <a href="https://zxpsign.com/zxp-installer" target="_blank" rel="noreferrer" style={{ color: 'var(--accent)' }}>ZXP Installer</a> (Mac/Win),
or run the <strong style={{ color: 'var(--text-2)' }}>Windows Setup</strong> which bundles the installer automatically.
</div>
<div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
{PREMIERE_RELEASES.map(r => (
<div key={r.version} style={{ border: '1px solid var(--border)', borderRadius: 6, padding: '10px 12px', background: 'var(--bg-2)', display: 'flex', alignItems: 'center', gap: 10 }}>
<div style={{ flex: 1 }}>
<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
<strong style={{ fontSize: 13 }}>v{r.version}</strong>
{r.latest && <span className="badge success">latest</span>}
</div>
<div style={{ fontSize: 11.5, color: 'var(--text-3)', marginTop: 2 }}>{r.notes}</div>
</div>
<a href={r.zxp} download style={{ textDecoration: 'none' }}>
<button className="btn ghost sm">ZXP</button>
</a>
<a href={r.installer} download style={{ textDecoration: 'none' }}>
<button className="btn ghost sm">Win Installer</button>
</a>
</div>
))}
</div>
</div>
<div style={{ borderTop: '1px solid var(--border)', marginBottom: 14 }} />
{/* ── Capture SDK upload section ── */}
<div style={{ fontSize: 12, color: 'var(--text-3)', lineHeight: 1.55, marginBottom: 4 }}>
Each SDK archive should be a <strong style={{ color: 'var(--text-2)' }}>.zip</strong> or <strong style={{ color: 'var(--text-2)' }}>.tar.gz</strong> containing the vendor's Linux SDK contents. After uploading, rebuild the capture container on the host with a DeckLink/AJA/Deltacast card. The SDK files are staged under <code className="mono" style={{ fontSize: 11.5 }}>/sdk/&lt;vendor&gt;/</code> inside mam-api.
</div>

View file

@ -366,6 +366,49 @@ function Editor() {
return (
<div className="editor-shell" style={{ position: 'relative', display: 'flex', flexDirection: 'column', height: '100%', overflow: 'hidden' }}>
{/* ── COMING SOON bumper — overlays the entire editor ── */}
<div style={{
position: 'absolute', inset: 0, zIndex: 100,
background: 'rgba(10, 12, 18, 0.92)',
backdropFilter: 'blur(6px)',
display: 'flex', flexDirection: 'column',
alignItems: 'center', justifyContent: 'center',
gap: 20, pointerEvents: 'all',
}}>
<div style={{
width: 64, height: 64,
background: 'linear-gradient(135deg, var(--accent), hsl(250 80% 65%))',
borderRadius: 16,
display: 'flex', alignItems: 'center', justifyContent: 'center',
boxShadow: '0 0 40px rgba(91, 124, 250, 0.4)',
}}>
<Icon name="editor" size={30} />
</div>
<div style={{ textAlign: 'center', maxWidth: 420 }}>
<div style={{ fontSize: 26, fontWeight: 700, letterSpacing: '-0.02em', color: 'var(--text-primary)', marginBottom: 8 }}>
NLE Editor Coming Soon
</div>
<div style={{ fontSize: 14, color: 'var(--text-3)', lineHeight: 1.6 }}>
The browser-based timeline editor is under active development.
In the meantime, use the <strong style={{ color: 'var(--text-2)' }}>Premiere Pro panel</strong> for
frame-accurate editing and growing-file workflows download it from
<strong style={{ color: 'var(--text-2)' }}> Settings Capture SDKs</strong>.
</div>
</div>
<div style={{ display: 'flex', gap: 10, marginTop: 4 }}>
<a href="/downloads/dragonflight-premiere-panel-1.0.1.zxp" download style={{ textDecoration: 'none' }}>
<button className="btn primary">Download ZXP</button>
</a>
<a href="/downloads/dragonflight-premiere-panel-1.0.1-windows-setup.exe" download style={{ textDecoration: 'none' }}>
<button className="btn ghost">Windows Installer</button>
</a>
</div>
<div style={{ fontSize: 11.5, color: 'var(--text-3)', marginTop: -4 }}>
Dragonflight Premiere Panel v1.0.1
</div>
</div>
{/* ── Top toolbar ── */}
<div style={{ display: 'flex', alignItems: 'center', gap: 8, padding: '6px 12px', borderBottom: '1px solid var(--border)', background: 'var(--bg-panel)', flexShrink: 0, height: 40 }}>
<Icon name="editor" size={14} />