File size: 2,712 Bytes
e6ef778 78e24f3 e6ef778 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 | <!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>WorldModelBench Motion Review</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<header class="topbar">
<div class="title-block">
<p class="eyebrow">WorldModelBench</p>
<h1>Motion generation review</h1>
</div>
<div class="summary" aria-label="Dataset summary">
<span><strong>38</strong> outputs</span>
<span><strong>17</strong> Seedance</span>
<span><strong>21</strong> Kling</span>
<span class="local-status"><i></i> Local media</span>
</div>
</header>
<main>
<div class="toolbar">
<label class="search-field">
<span class="search-icon" aria-hidden="true"></span>
<span class="sr-only">Search videos</span>
<input id="search" type="search" placeholder="Search scenes or prompts" autocomplete="off" />
</label>
<div class="segmented" role="group" aria-label="Filter by model">
<button type="button" class="active" data-filter="all">All <span>38</span></button>
<button type="button" data-filter="seedance">Seedance <span>17</span></button>
<button type="button" data-filter="kling">Kling <span>21</span></button>
</div>
</div>
<section id="gallery" class="gallery" aria-live="polite"></section>
<p id="empty-state" class="empty-state" hidden>No matching videos.</p>
</main>
<dialog id="viewer" class="viewer">
<div class="viewer-shell">
<div class="viewer-bar">
<div>
<p id="viewer-index" class="viewer-index"></p>
<h2 id="viewer-title"></h2>
</div>
<button id="close-viewer" class="icon-button" type="button" aria-label="Close video">×</button>
</div>
<div class="video-stage">
<video id="video-player" controls playsinline preload="metadata"></video>
</div>
<div class="viewer-details">
<p id="viewer-prompt" class="viewer-prompt"></p>
<dl>
<div><dt>Model</dt><dd id="viewer-model"></dd></div>
<div><dt>Input frame</dt><dd id="viewer-frame"></dd></div>
<div><dt>Duration</dt><dd>5.04 s</dd></div>
</dl>
</div>
<div class="viewer-actions">
<button id="previous-video" type="button" class="secondary-command">Previous</button>
<button id="next-video" type="button" class="primary-command">Next</button>
</div>
</div>
</dialog>
<script src="app.js"></script>
</body>
</html>
|