75 lines
2.5 KiB
HTML
75 lines
2.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<title>every.channel</title>
|
|
<meta
|
|
name="description"
|
|
content="Watch and share free over-the-air TV. Local first, global when you want."
|
|
/>
|
|
<link data-trunk rel="css" href="style.css" />
|
|
<link data-trunk rel="copy-file" href="app.js" />
|
|
</head>
|
|
<body>
|
|
<main class="shell">
|
|
<header class="top">
|
|
<div class="brand">
|
|
<div class="brand-title">every.channel</div>
|
|
<div class="brand-subtitle">Watch live streams over WebTransport.</div>
|
|
</div>
|
|
<div class="badge" title="MoQ over WebTransport">
|
|
WebTransport
|
|
</div>
|
|
</header>
|
|
|
|
<section class="panel">
|
|
<div class="panel-title">Watch</div>
|
|
<div class="row">
|
|
<label class="field">
|
|
<div class="label">Relay URL</div>
|
|
<input id="relayUrl" class="input" type="text" spellcheck="false" />
|
|
</label>
|
|
<label class="field">
|
|
<div class="label">Broadcast name</div>
|
|
<input id="broadcastName" class="input" type="text" spellcheck="false" />
|
|
</label>
|
|
<button id="watchBtn" class="btn">Watch</button>
|
|
</div>
|
|
<div class="hint" id="hint"></div>
|
|
<div class="row share">
|
|
<button id="copyLinkBtn" class="btn secondary">Copy link</button>
|
|
<div class="shareLink" id="shareLink" aria-live="polite"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="panel">
|
|
<div class="panelHead">
|
|
<div class="panel-title">Live Now</div>
|
|
<button id="refreshListBtn" class="btn secondary">Refresh</button>
|
|
</div>
|
|
<div class="hint" id="listHint"></div>
|
|
<div id="liveList" class="liveList"></div>
|
|
</section>
|
|
|
|
<section class="player">
|
|
<div class="tv">
|
|
<div class="tv-glow"></div>
|
|
<div class="tv-frame">
|
|
<div id="playerMount" class="mount"></div>
|
|
<div class="tv-scanlines" aria-hidden="true"></div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<footer class="foot">
|
|
<div class="foot-left">AGPLv3</div>
|
|
<div class="foot-right">
|
|
For Safari: WebTransport is behind a Developer/Advanced feature flag and may be incomplete.
|
|
</div>
|
|
</footer>
|
|
</main>
|
|
|
|
<script type="module" src="app.js"></script>
|
|
</body>
|
|
</html>
|