100 lines
3.7 KiB
HTML
100 lines
3.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>bug.tv — watch</title>
|
|
<link rel="stylesheet" href="css/tokens.css">
|
|
<link rel="stylesheet" href="css/base.css">
|
|
<link rel="stylesheet" href="css/components.css">
|
|
<link rel="stylesheet" href="css/pages.css">
|
|
</head>
|
|
<body>
|
|
<header class="site-header">
|
|
<div class="container site-header__inner">
|
|
<a class="brand" href="index.html">bug<span>.tv</span></a>
|
|
<a class="site-header__nav" href="index.html">Home</a>
|
|
<a class="site-header__nav" href="search.html">Search</a>
|
|
<span class="site-header__spacer"></span>
|
|
<button class="btn btn--ghost btn--sm" id="settingsBtn" type="button">Settings</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="container page" id="content">
|
|
<section class="watch-hero" id="hero" aria-busy="true"></section>
|
|
|
|
<section id="playerSection">
|
|
<div class="player-wrap">
|
|
<video id="video" controls playsinline></video>
|
|
<div class="player-status" id="playerStatus">
|
|
<div class="spinner"></div>
|
|
<p>Getting ready…</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="watch-toolbar">
|
|
<span class="watch-toolbar__source" id="sourceLabel"></span>
|
|
<span id="resumeNote"></span>
|
|
<span class="watch-toolbar__spacer"></span>
|
|
<button class="btn btn--sm" id="changeSourceBtn" type="button" hidden>Change source</button>
|
|
</div>
|
|
|
|
<div class="sources" id="sourcesPanel" hidden>
|
|
<div class="sources__head">Sources <span id="sourcesCount"></span></div>
|
|
<div id="sourceList"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="episodes" id="episodes" hidden>
|
|
<div class="episodes__toolbar">
|
|
<h2 class="episodes__title">Episodes</h2>
|
|
<select class="field" id="seasonSelect" aria-label="Season"></select>
|
|
<button class="btn btn--sm" id="prevEpisode" type="button">Previous</button>
|
|
<button class="btn btn--sm" id="nextEpisode" type="button">Next</button>
|
|
</div>
|
|
<div class="episode-grid" id="episodeGrid"></div>
|
|
</section>
|
|
</main>
|
|
|
|
<footer class="site-footer">
|
|
<div class="container">
|
|
<span>bug.tv</span>
|
|
<span>API: <a id="apiBaseLabel" href="#" target="_blank" rel="noopener"></a></span>
|
|
</div>
|
|
</footer>
|
|
|
|
<div class="modal-overlay" id="settingsModal" hidden>
|
|
<div class="modal" role="dialog" aria-modal="true" aria-labelledby="settingsTitle">
|
|
<div class="modal__head">
|
|
<h2 class="modal__title" id="settingsTitle">Settings</h2>
|
|
<button class="btn btn--ghost btn--sm" id="settingsClose" type="button">Close</button>
|
|
</div>
|
|
<div class="modal__body">
|
|
<div>
|
|
<label class="field-label" for="apiBaseInput">API base URL</label>
|
|
<input class="field" id="apiBaseInput" type="url" placeholder="https://…">
|
|
<p class="modal__hint">
|
|
All requests go to this API. You can also override it for one session
|
|
by adding <code>?api=https://…</code> to any page URL.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="modal__actions">
|
|
<button class="btn" id="apiBaseReset" type="button">Reset to default</button>
|
|
<button class="btn btn--primary" id="apiBaseSave" type="button">Save</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="vendor/hls.min.js"></script>
|
|
<script src="js/util.js"></script>
|
|
<script src="js/config.js"></script>
|
|
<script src="js/api.js"></script>
|
|
<script src="js/storage.js"></script>
|
|
<script src="js/cards.js"></script>
|
|
<script src="js/app.js"></script>
|
|
<script src="js/player.js"></script>
|
|
<script src="js/watch.js"></script>
|
|
</body>
|
|
</html>
|