Add title update button and reload all button

jacobtomlinson · Jul 28, 2020 · 05ad74f · 05ad74f
1 parent 78a5fa9
commit 05ad74f
Show file tree

Hide file tree

Showing 3 changed files with 41 additions and 16 deletions.
diff --git a/overlays/controlpanel.html b/overlays/controlpanel.html
@@ -1,20 +1,29 @@
 <!DOCTYPE html>
 <html>
-  <head>
-    <meta charset="UTF-8" />
-    <title>Constrained Coding - Control Panel</title>
-    <link rel="stylesheet" type="text/css" href="css/main.css" />
-    <link rel="stylesheet" type="text/css" href="css/controlpanel.css" />
-  </head>
-  <body>
-    <h1>Control Panel</h1>
 
+<head>
+  <meta charset="UTF-8" />
+  <title>Constrained Coding - Control Panel</title>
+  <link rel="stylesheet" type="text/css" href="css/main.css" />
+  <link rel="stylesheet" type="text/css" href="css/controlpanel.css" />
+</head>
+
+<body>
+  <h1>Control Panel</h1>
+
+  <p>
     <input id="streamTitle" type="text" />
+    <button id="streamTitleButton" type="button">Set</button>
+  </p>
+  <p>
+    <button id="reloadAllButton" type="button">Reload All</button>
+  </p>
+
+  <script src="js/vendor/js.cookie-3.0.0.min.js"></script>
+  <script src="js/vendor/anime-3.2.0.min.js"></script>
+  <script src="js/vendor/obs-websocket-4.0.1.js"></script>
+  <script src="js/websocket.js"></script>
+  <script src="js/controlpanel.js"></script>
+</body>
 
-    <script src="js/vendor/js.cookie-3.0.0.min.js"></script>
-    <script src="js/vendor/anime-3.2.0.min.js"></script>
-    <script src="js/vendor/obs-websocket-4.0.1.js"></script>
-    <script src="js/websocket.js"></script>
-    <script src="js/controlpanel.js"></script>
-  </body>
-</html>
+</html>
diff --git a/overlays/js/controlpanel.js b/overlays/js/controlpanel.js
@@ -9,9 +9,14 @@ overlay.on("Connected", (data) => {
   });
 });
 
-document.getElementById("streamTitle").addEventListener("change", () => {
+document.getElementById("streamTitleButton").addEventListener("click", () => {
   let title = document.getElementById("streamTitle").value;
   overlay.send("SetTitle", { title: title });
+  Cookies.set("streamTitle", title, { sameSite: "lax" });
+});
+
+document.getElementById("reloadAllButton").addEventListener("click", () => {
+  overlay.send("Reload", {});
 });
 
 overlay.on("WebsocketError", (data) => {
@@ -22,3 +27,10 @@ overlay.on("WebsocketError", (data) => {
   Cookies.set("websocket", address, { sameSite: "lax" });
   location.reload();
 });
+
+document.addEventListener("DOMContentLoaded", (event) => {
+  let title = Cookies.get("streamTitle");
+  if (title) {
+    document.getElementById("streamTitle").value = title;
+  }
+});
diff --git a/overlays/js/websocket.js b/overlays/js/websocket.js
@@ -62,3 +62,7 @@ obs.on("Heartbeat", (data) => {
 overlay.on("Connected", (data) => {
   console.log("Overlay connected");
 });
+
+overlay.on("Reload", (data) => {
+  location.reload();
+})