changed controls

frontend/public/index.html

@@ -9,6 +9,8 @@
       name="%REACT_APP_SITE_NAME%"
       content="Listen to live Police and Fire radio broadcasts. Archived for 30 days and searchable."
     />
+    <!-- Below is an ugly hack! I needed a way to add a tag to insert Twitter Meta if needed-->
+    <!-- I SED the tag below out and replace it with an EJS tag to insert a block of meta -->
     <meta name="temp" conent="replace"/>
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/apple-touch-icon.png" />
     <!--

frontend/server/card.ejs

@@ -4,38 +4,7 @@
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
     <title>OpenMHz</title>
     <script src="https://unpkg.com/wavesurfer.js"></script>
-    <script>
-      // Create an instance
-      let wavesurfer;
-      var call_url="<%- url%>";
-      // Init & load audio file
-      document.addEventListener("DOMContentLoaded", function () {
-        // Init
-        wavesurfer = WaveSurfer.create({
-          container: document.querySelector("#waveform"),
-          waveColor: "#A8DBA8",
-          progressColor: "#3B8686",
-          backend: "MediaElement",
-          mediaControls: true,
-        });
 
-        wavesurfer.once("ready", function () {
-          console.log("Using wavesurfer.js " + WaveSurfer.VERSION);
-        });
-
-        wavesurfer.on("error", function (e) {
-          console.warn(e);
-        });
-
-        // Load audio from URL
-        wavesurfer.load(call_url);
-
-        // toggle play button
-        document
-          .querySelector('[data-action="play"]')
-          .addEventListener("click", wavesurfer.playPause.bind(wavesurfer));
-      });
-    </script>
   </head>
 
   <body>
@@ -43,15 +12,35 @@
       <div id="waveform">
         <!-- Here be the waveform -->
       </div>
+      <script>
+        // Create an instance
+        let wavesurfer;
+        var call_url="<%- url%>";
+        // Init & load audio file
+        document.addEventListener("DOMContentLoaded", function () {
+          // Init
+          wavesurfer = WaveSurfer.create({
+            container: document.querySelector("#waveform"),
+            waveColor: "#A8DBA8",
+            progressColor: "#3B8686",
+            backend: "MediaElement",
+            mediaControls: true,
+          });
+  
+          wavesurfer.once("ready", function () {
+            console.log("Using wavesurfer.js " + WaveSurfer.VERSION);
+          });
+  
+          wavesurfer.on("error", function (e) {
+            console.warn(e);
+          });
+  
+          // Load audio from URL
+          wavesurfer.load(call_url);
+  
+        });
+      </script>
 
-      <div class="controls">
-        <button class="btn btn-primary" data-action="play">
-          <i class="glyphicon glyphicon-play"></i>
-          Play /
-          <i class="glyphicon glyphicon-pause"></i>
-          Pause
-        </button>
-      </div>
     </div>
   </body>
 </html>