From 5e1ab84175c3a2f5aa66a740ea4ce7b7cec219ca Mon Sep 17 00:00:00 2001
From: Benjamin Frost <bfrost.schule@gmail.com>
Date: Sat, 25 May 2024 20:08:02 +0200
Subject: [PATCH] feat(jury-tool): allow specifying backend url

---
 jury/index.html | 56 ++++++++++++++++++++++++++++++++++++++++---------
 1 file changed, 46 insertions(+), 10 deletions(-)
diff --git a/jury/index.html b/jury/index.html
index 18d0099..a22ae6a 100644
--- a/jury/index.html
+++ b/jury/index.html
@@ -39,10 +39,30 @@
         padding: 1rem;
         margin: 0;
       }
+
+      #urlInputContainer {
+        text-align: center;
+        margin-bottom: 1rem;
+      }
+
+      #urlInput {
+        width: 300px;
+        padding: 0.5rem;
+        font-size: 1rem;
+      }
+
+      #setUrlButton {
+        padding: 0.5rem 1rem;
+        font-size: 1rem;
+      }
     </style>
   </head>
   <body>
     <h1>Jury Tool</h1>
+    <div id="urlInputContainer">
+      <input type="text" id="urlInput" placeholder="Enter backend URL" />
+      <button id="setUrlButton">Set URL</button>
+    </div>
     <div id="events"></div>
     <script>
       const events = [
@@ -52,6 +72,8 @@ <h1>Jury Tool</h1>
         'aec-cc',
       ];
 
+      let backendUrl = '';
+
       // Create html elements for each event
       events.forEach((event) => {
         const div = document.createElement('div');
@@ -64,21 +86,35 @@ <h1>Jury Tool</h1>
 
         const pre = document.createElement('pre');
         pre.id = event + '-data';
-        pre.textContent = 'Loading...';
+        pre.textContent = 'Enter a backend URL to start';
         document.getElementById(event).appendChild(pre);
       });
 
-      // Update data for each event, every second
-      setInterval(() => {
+      document.getElementById('setUrlButton').addEventListener('click', () => {
+        backendUrl = document.getElementById('urlInput').value;
+        if (backendUrl) {
+          updateEventData();
+        }
+      });
+
+      function updateEventData() {
+        // Update text to "Loading..." once fetching starts
         events.forEach((event) => {
-          fetch(`http://localhost:3000/events/${event}/subscribe?wait=false`)
-            .then((response) => response.json())
-            .then((data) => {
-              document.getElementById(event + '-data').textContent =
-                JSON.stringify(data, null, 2);
-            });
+          document.getElementById(event + '-data').textContent = 'Loading...';
         });
-      }, 1000);
+
+        // Update data for each event, every second
+        setInterval(() => {
+          events.forEach((event) => {
+            fetch(`${backendUrl}/events/${event}/subscribe?wait=false`)
+              .then((response) => response.json())
+              .then((data) => {
+                document.getElementById(event + '-data').textContent =
+                  JSON.stringify(data, null, 2);
+              });
+          });
+        }, 1000);
+      }
     </script>
   </body>
 </html>
