watch-party/frontend/index.html

69 lines
1.8 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>watch party :D</title>
<link rel="stylesheet" href="/styles.css?v=5" />
</head>
<body>
<noscript>
This site will <em>not</em> work without JavaScript, and there's not
really any way around that :(
</noscript>
<div id="pre-join-controls">
<form id="join-session-form">
<h2>Join a session</h2>
<p id="post-create-message">
Your session has been created successfully. Copy the current url or
the Session ID below and share it with your friends. :)
</p>
<label for="join-session-nickname">Nickname:</label>
<input
type="text"
id="join-session-nickname"
placeholder="Nickname"
maxlength="50"
required
/>
<label for="join-session-colour">Colour:</label>
<input
type="text"
id="join-session-colour"
placeholder="7ed0ff"
value="7ed0ff"
pattern="[a-fA-F\d]{6}"
required
/>
<label for="join-session-id">Session ID:</label>
<input
type="text"
id="join-session-id"
placeholder="123e4567-e89b-12d3-a456-426614174000"
required
/>
<button id="join-session-button">Join</button>
</form>
<p>
No session to join? <a href="/create.html">Create a session</a> instead.
</p>
</div>
<div id="video-container"></div>
<div id="chatbox-container">
<div id="chatbox"></div>
<form id="chatbox-send">
<input type="text" placeholder="Message..." />
</form>
</div>
<script type="module" src="/main.mjs?v=7"></script>
</body>
</html>