--- /dev/null
+<!DOCTYPE html>
+<html lang="en">
+ <head>
+ <meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <title>Broadcaster</title>
+ <style type="text/css">
+ table.radio-status, td.outer {
+ border: 1px solid;
+ }
+ table.inner {
+ border-collapse: collapse;
+ }
+ td.clear {
+ width: 5em;
+ height: 5em;
+ text-align: center;
+ }
+ .time-table {
+ font-size: 90%;
+ }
+ .playlist-field {
+ text-align: right;
+ padding-right: 1em;
+ width: 5em;
+ }
+ .playlist-table {
+ font-size: 90%;
+ width: 30em;
+ }
+ .stop {
+ text-align: center;
+ }
+ .head {
+ text-align: center;
+ }
+ </style>
+ <script type="text/javascript">
+ function connectWebsocket() {
+ console.log("Attempting to create websocket connection for radio status sync")
+ const cookieValue = document.cookie
+ .split("; ")
+ .find((row) => row.startsWith("broadcast_session="))
+ ?.split("=")[1];
+ const socket = new WebSocket("/web-ws");
+ socket.addEventListener("open", (event) => {
+ socket.send(cookieValue);
+ });
+ socket.addEventListener("message", (event) => {
+ console.log("Received a status update from server")
+ const connected = document.getElementById('connected-radios');
+ connected.innerHTML = event.data;
+ });
+ socket.addEventListener("close", (event) => {
+ console.log("Websocket closed. Will retry in 10 seconds.")
+ setTimeout(connectWebsocket, 10000);
+ });
+ }
+ // initial connection on page load
+ connectWebsocket();
+ </script>
+ </head>
+ <body>
+ <main>
+ <h1>Welcome!</h1>
+ {{if .LoggedIn}}
+ <p>Your username is: {{.Username}}.</p>
+ <p><a href="/logout">Log Out</a></p>
+ {{else}}
+ <p><a href="/login">Log In</a></p>
+ {{end}}
+ <p><a href="/files/">File Management</a></p>
+ <p><a href="/playlists/">Playlist Management</a></p>
+ <p><a href="/radios/">Radio Management</a></p>
+ <h2>Connected Radios</h2>
+ <div id="connected-radios">
+ <i>Loading...</i>
+ </div>
+ </main>
+ </body>
+</html>
projects / broadcaster / blobdiff