63 lines
2.4 KiB
HTML
63 lines
2.4 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">
|
||
|
|
<!-- Connection bar (visible when disconnected) -->
|
||
|
|
<section id="connect-pane" class="pane">
|
||
|
|
<div class="brand">
|
||
|
|
<div class="brand-title">Dragonflight</div>
|
||
|
|
<div class="brand-tag">Wild Dragon Broadcast</div>
|
||
|
|
</div>
|
||
|
|
<label class="label" for="server-url">Server URL</label>
|
||
|
|
<input id="server-url" type="text" placeholder="https://dragonflight.live" />
|
||
|
|
<label class="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 muted"></div>
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<!-- Connected: library + actions -->
|
||
|
|
<section id="library-pane" class="pane hidden">
|
||
|
|
<header class="connected-bar">
|
||
|
|
<span class="dot dot-ok"></span>
|
||
|
|
<span id="connected-host" class="connected-host"></span>
|
||
|
|
<button id="disconnect-btn" class="btn btn-link">Disconnect</button>
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<div class="library-controls">
|
||
|
|
<input id="search-input" type="search" placeholder="Search assets…" />
|
||
|
|
<button id="refresh-btn" class="btn btn-icon" title="Refresh">↻</button>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div id="asset-grid" class="asset-grid">
|
||
|
|
<div class="empty muted">Loading…</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<footer class="actions">
|
||
|
|
<div id="selected-info" class="selected-info muted">No asset selected</div>
|
||
|
|
<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 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>
|
||
|
|
<div id="toast" class="toast hidden"></div>
|
||
|
|
</footer>
|
||
|
|
</section>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<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/main.js"></script>
|
||
|
|
</body>
|
||
|
|
</html>
|