add ambient music to main page :3

html/main.ejs

@@ -364,6 +364,12 @@ border:solid;
 
      
             <div class=right>
+              
+                            
+<button title="Play/Pause Ambient music" class="a" id="audioButton" onclick="toggleAudio()">
+  <i id="audioIcon" class="fas fa-pause"></i>
+</button>
+
               <a href="/domains"><i  style="display: block;margin-left: auto;margin-right: auto;" class="fa-light fa-server"></i>  </a>
               <a href="/privacy"><i class="fa-light fa-shield"></i></a>
               <a href="/video/upload?from="><i class="fa-light fa-video"></i></a> 
@@ -376,23 +382,11 @@ border:solid;
   
 
  <div class="channel-page" >   
-  
+          <audio id="audio" style="display:none;" loop autoplay></audio>
+
     <img src="https://t.poketube.fun/t/rep.gif" style="width: 0;visibility: hidden;display:none;" id="discover_main">
 
-     
-        <div class="news">
-                 <div class="video-title" style="font-family:'PokeTube Flex';font-weight:1000;white-space:nowrap;font-stretch: extra-expanded;"><i class="fa-solid fa-sparkles"></i> Whats new on poketube owo? </div>
-<p>
-Haiii!! we added alot (like alot woa) of cool stuff to poketube >.< <br>
-
-- New cool & epico borders on divs<br>
-- Css files are now easy to read pog<br>
-- PokeTube Flex is now everywhere :3 ginto nord font will be removed <i>forever</i> soon pog<br>
-- Removed Herobrine<br>
-
-P.S : Ur a qt
-          </p>
-                                 </div>
+      
         <% if (!tab) { %> 
 
      <div class="tabs tabs-center">
@@ -537,6 +531,74 @@ window.addEventListener("load", () => {
 });
      
       </script>
+          
+          <script>
+// @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-3.0-or-later  
+
+  const audioElement = document.getElementById("audio");
+audioElement.volume = 0.1;  
+let audioToggled = JSON.parse(localStorage.getItem("audioToggled"));
+
+// When the audio player is loaded, check for stored time value and set current time
+audioElement.addEventListener("loadedmetadata", () => {
+  if (audioToggled) {
+    const storedTime = localStorage.getItem("audioTime-main");
+    if (storedTime) {
+      audioElement.currentTime = storedTime;
+    }
+  }
+});
+
+// When the user leaves the page, store the current time value
+window.addEventListener("beforeunload", () => {
+  if (audioToggled) {
+    localStorage.setItem("audioTime-main", audioElement.currentTime);
+  }
+});            
+  
+const audio = document.getElementById("audio");
+const button = document.getElementById("audioButton");
+const icon = document.getElementById("audioIcon");
+
+function toggleAudio() {
+  if (audio.paused) {
+    audio.play();
+    audio.volume = 0.1;
+    button.classList.add("playing");
+    icon.classList.remove("fa-play");
+    icon.classList.add("fa-pause");
+    localStorage.setItem("audioToggled", true); // save that audio is toggled
+  } else {
+    audio.pause();
+    button.classList.remove("playing");
+    icon.classList.remove("fa-pause");
+    icon.classList.add("fa-play");
+    localStorage.setItem("audioToggled", false); // save that audio is not toggled
+  }
+}
+
+if (audioToggled === null || audioToggled === undefined) {
+  audioToggled = true;
+}
+
+if (audioToggled == false) {
+  audio.pause();
+  button.classList.remove("playing");
+  icon.classList.remove("fa-pause");
+  icon.classList.add("fa-play");
+} else {
+  audio.play();
+  audio.volume = 0.1;
+  audio.src = "https://inv.zzls.xyz/latest_version?id=k3UevKvP9RU&itag=18"                             
+  button.classList.add("playing");
+  icon.classList.remove("fa-play");
+  icon.classList.add("fa-pause");
+}
+ 
+// Show the audio button
+button.style.display = "block";
+
+                                    </script>
     </body >
 
 </html>