From fb55f64cf1434c00b296ab90c963a58dcd135b42 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Wed, 16 Jul 2025 01:06:58 +0200
Subject: [PATCH 1/3] fuggen homegrown maddafaggin radio shiet

comming soon, on a URL near you
---
 themes/basspistol2025/assets/css/style.css    |  64 ++++++++--
 .../layouts/partials/body/radio.html          | 109 +++++++++++++++++-
 2 files changed, 162 insertions(+), 11 deletions(-)

diff --git a/themes/basspistol2025/assets/css/style.css b/themes/basspistol2025/assets/css/style.css
index 96af19a..c031c3c 100644
--- a/themes/basspistol2025/assets/css/style.css
+++ b/themes/basspistol2025/assets/css/style.css
@@ -181,7 +181,7 @@ time {
   font-size: .5em;
 }
 .section-headers {
-  margin: 2px 4px;
+  margin: 2px;
   border-radius: 100px;
   padding: 80px 20px;
   border-style: double;
@@ -210,7 +210,7 @@ time {
   border-width: 10px;
   flex: 1 1 100% !important;
   border-radius: 0 0 100px 100px;
-  margin: 2px 4px;
+  margin: 2px;
 
 }
 .border {
@@ -267,7 +267,7 @@ time {
     flex: 1 1 100%;
     background-position: center center;
     background-size: cover;
-    margin: 2px 4px;
+    margin: 2px;
   }
 
   .support {
@@ -364,7 +364,7 @@ justify-content: space-between;
     img {
       width: 100%;
       object-fit: cover;
-      max-height: 200px;
+      height: 200px;
     }
 
 
@@ -384,12 +384,62 @@ justify-content: space-between;
 
 #radio {
 
-  .border {
-    margin: 2px 4px;
+  #recordPlayer {
+    height: 300px;
+    width: 300px;
+    background-size: cover;
+    background-position: center center;
+    border-radius:7px;
+    transition: all linear 1s;
   }
+  .spinner {
+    border-radius: 300px !important;
+    animation: rotate 10s linear infinite;
+  }
+  .stop {
+    animation-play-state: paused;
+  }
+
+  .radioplayer {
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .legend-container {
+    align-content: center;
+    margin-left: 40px;
+    display: flex;
+    flex-wrap: wrap;
+  }
+
+  .legend {
+    width: 100%;
+  }
+
+  .border {
+    margin: 2px;
+  }
+  audio {
+    width: 100%;
+  }
+
+  button {
+    background: transparent;
+    border: none;
+    padding: 0;
+    margin: 0;
+  }
+
 }
 
-
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg)
+  }
+  100% {
+    transform: rotate(360deg)
+  }
+}
 
 @media screen and (max-width: 720px) {
 
diff --git a/themes/basspistol2025/layouts/partials/body/radio.html b/themes/basspistol2025/layouts/partials/body/radio.html
index e3b1254..582da7d 100644
--- a/themes/basspistol2025/layouts/partials/body/radio.html
+++ b/themes/basspistol2025/layouts/partials/body/radio.html
@@ -1,3 +1,10 @@
+
+
+
+
+
+
+
 <section id="radio">
   <div class="section-headers" style="background-image: url(/2025/images/radio.webp);">
     <h2>RadioStation</h2>
@@ -5,11 +12,105 @@
     <p>777% music, without commercials! RobotDJ-sets and live interventions! This is the sound of freedom.</p>
     <a class="button" href="https://radio.basspistol.com/">Request song 📻</a>
   </div>
-  <div class="border">
-    <iframe src="https://radio.basspistol.com/public/basspistol/embed?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 150px; border: 0;"></iframe>
-
-    <iframe src="https://radio.basspistol.com/public/basspistol/history?theme=dark" frameborder="0" allowtransparency="true" style="width: 100%; min-height: 480px; border: 0;"></iframe>
+  <div class="border radioplayer">
+    <div id="recordPlayer">
+      <img src="" />
+    </div>
+    <div class="legend-container">
+      <div class="legend">
+        <button id="myBtn">▶️</button>
+        <div>
+          <h4 id="npTitle"></h4>
+          <p id="npArtist"></p>
+          <audio preload="none" id="radioAudio">
+          <source src="https://radio.basspistol.com/listen/basspistol/radio.mp3" type="audio/mpeg">
+          Your browser does not support the audio element.
+          </audio>
+        </div>
+      </div>
+      <a href="" id="supportButtonDelux" class="button player">🫰 Support this Artist</a>
+    </div>
   </div>
   <div class="section-footers"></div>
 
 </section>
+<script>
+
+  console.log("Loading Basspistol Radio! Enjoy!");
+
+  // Logic to fetch URL of currently playing artist
+
+  const list = document.createDocumentFragment();
+  const supportUrl = 'https://radio.basspistol.com/api/nowplaying';
+
+  // Catch elements that need influece
+  // support button
+  let supportButtonDelux = document.getElementById('supportButtonDelux');
+
+  // record player
+  let recordPlayer = document.getElementById('recordPlayer');
+  recordPlayer.classList.add("btn");
+
+  // Title and Artist
+  let npArtist = document.getElementById('npArtist');
+  let npTitle = document.getElementById('npTitle');
+
+  function timeleyManner(){
+    fetch(supportUrl)
+      .then((response) => {
+        return response.json();
+      })
+      .then((data) => {
+        let supportClicker = data;
+
+
+        supportClicker.map(function(support) {
+
+          // set background image in record player
+          recordPlayer.style.backgroundImage = "url(" + `${support.now_playing.song.art}` + ")";
+
+          // print text
+
+          npTitle.innerHTML = `${support.now_playing.song.title}`;
+
+          npArtist.innerHTML = `by ${support.now_playing.song.artist}`;
+
+          if(`${support.now_playing.song.custom_fields.support_url}` != "null") {
+            supportButtonDelux.href = `${support.now_playing.song.custom_fields.support_url}` + "?ref=radio.basspistol.com" + "&title=" + `${support.now_playing.song.text}`;
+
+          }
+          else {
+            supportButtonDelux.href = "https://www.urbandictionary.com/define.php?term=Anon";
+
+          }
+
+        });
+
+      })
+      .catch(function(error) {
+        console.log(error);
+      });
+  }
+
+  timeleyManner();
+
+  setInterval
+
+  // player logic
+  var audio = document.getElementById("radioAudio");
+  var btn = document.getElementById("myBtn");
+
+    btn.onclick = function() {
+      if (audio.paused) {
+        audio.play();
+        btn.innerHTML = "⏸️";
+        recordPlayer.classList.add("spinner");
+        recordPlayer.classList.remove("stop");
+      } else {
+        audio.pause();
+        btn.innerHTML = "▶️";
+        recordPlayer.classList.add("stop");
+      }
+    };
+
+</script>

From 73aa49f7c28f0ab83b1d465ffb2dac791cb9e500 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Wed, 16 Jul 2025 10:45:43 +0200
Subject: [PATCH 2/3] kaboom

---
 themes/basspistol2025/assets/css/style.css    | 76 ++++++++++++-------
 .../layouts/partials/body/radio.html          | 30 +++++---
 2 files changed, 68 insertions(+), 38 deletions(-)

diff --git a/themes/basspistol2025/assets/css/style.css b/themes/basspistol2025/assets/css/style.css
index c031c3c..15baece 100644
--- a/themes/basspistol2025/assets/css/style.css
+++ b/themes/basspistol2025/assets/css/style.css
@@ -384,32 +384,45 @@ justify-content: space-between;
 
 #radio {
 
-  #recordPlayer {
-    height: 300px;
-    width: 300px;
-    background-size: cover;
-    background-position: center center;
-    border-radius:7px;
-    transition: all linear 1s;
-  }
-  .spinner {
-    border-radius: 300px !important;
-    animation: rotate 10s linear infinite;
-  }
-  .stop {
-    animation-play-state: paused;
-  }
-
   .radioplayer {
     display: flex;
     flex-wrap: wrap;
+    justify-content: space-between;
+  }
+
+  #recordPlayer {
+    flex: 1 1 300px;
+    background-size: cover;
+    background-position: center center;
+    margin-top:40px;
+
+    img {
+      border-radius:7px;
+      transition: all linear 1s;
+      width: 100%;
+      height: auto;
+      object-fit: cover;
+    }
   }
 
   .legend-container {
     align-content: center;
-    margin-left: 40px;
     display: flex;
     flex-wrap: wrap;
+    flex: 1 1 300px;
+
+  }
+
+
+  .spinner {
+    border-radius: 2000px !important;
+    animation: rotate 10s linear infinite;
+    border-style: double;
+    border-color: purple;
+    border-width: 10px;
+  }
+  .stop {
+    animation-play-state: paused;
   }
 
   .legend {
@@ -423,24 +436,16 @@ justify-content: space-between;
     width: 100%;
   }
 
-  button {
+  #myBtn {
     background: transparent;
     border: none;
     padding: 0;
     margin: 0;
+    font-size: 3em;
   }
 
 }
 
-@keyframes rotate {
-  0% {
-    transform: rotate(0deg)
-  }
-  100% {
-    transform: rotate(360deg)
-  }
-}
-
 @media screen and (max-width: 720px) {
 
 
@@ -503,6 +508,23 @@ justify-content: space-between;
       }
     }
   }
+
+  #radio {
+
+
+    #myBtn {
+      font-size: 4em;
+    }
+  }
 }
 
+/* ANIMATIONS */
 
+@keyframes rotate {
+  0% {
+    transform: rotate(0deg)
+  }
+  100% {
+    transform: rotate(360deg)
+  }
+}
diff --git a/themes/basspistol2025/layouts/partials/body/radio.html b/themes/basspistol2025/layouts/partials/body/radio.html
index 582da7d..50544e7 100644
--- a/themes/basspistol2025/layouts/partials/body/radio.html
+++ b/themes/basspistol2025/layouts/partials/body/radio.html
@@ -10,12 +10,10 @@
     <h2>RadioStation</h2>
     <h4>𝕭𝖆𝖘𝖘𝖕𝖎𝖘𝖙𝖔𝖑 𝕽𝖆𝖉𝖎𝖔 𝕾𝖙𝖆𝖙𝖎𝖔𝖓</h4>
     <p>777% music, without commercials! RobotDJ-sets and live interventions! This is the sound of freedom.</p>
-    <a class="button" href="https://radio.basspistol.com/">Request song 📻</a>
+
   </div>
   <div class="border radioplayer">
-    <div id="recordPlayer">
-      <img src="" />
-    </div>
+
     <div class="legend-container">
       <div class="legend">
         <button id="myBtn">▶️</button>
@@ -28,7 +26,17 @@
           </audio>
         </div>
       </div>
-      <a href="" id="supportButtonDelux" class="button player">🫰 Support this Artist</a>
+      <div>
+        <br />
+        <a href="" id="supportButtonDelux" class="button player">🫰 Support this Artist</a>
+        <br />
+        <a class="button" href="https://radio.basspistol.com/">📻 Request song</a>
+        <br />
+        <a class="button" href="https://radio.basspistol.com/public/basspistol/schedule">🗓️ Schedule</a>
+      </div>
+    </div>
+    <div id="recordPlayer">
+      <img src="" id="coverArt" />
     </div>
   </div>
   <div class="section-footers"></div>
@@ -48,8 +56,8 @@
   let supportButtonDelux = document.getElementById('supportButtonDelux');
 
   // record player
-  let recordPlayer = document.getElementById('recordPlayer');
-  recordPlayer.classList.add("btn");
+  let coverArt = document.getElementById('coverArt');
+  coverArt.classList.add("btn");
 
   // Title and Artist
   let npArtist = document.getElementById('npArtist');
@@ -67,7 +75,7 @@
         supportClicker.map(function(support) {
 
           // set background image in record player
-          recordPlayer.style.backgroundImage = "url(" + `${support.now_playing.song.art}` + ")";
+          coverArt.src = `${support.now_playing.song.art}`;
 
           // print text
 
@@ -104,12 +112,12 @@
       if (audio.paused) {
         audio.play();
         btn.innerHTML = "⏸️";
-        recordPlayer.classList.add("spinner");
-        recordPlayer.classList.remove("stop");
+        coverArt.classList.add("spinner");
+        coverArt.classList.remove("stop");
       } else {
         audio.pause();
         btn.innerHTML = "▶️";
-        recordPlayer.classList.add("stop");
+        coverArt.classList.add("stop");
       }
     };
 

From 91283999484a20b9ed2ab0054a7ef6f7b4a66db7 Mon Sep 17 00:00:00 2001
From: sakrecoer <setto@dyne.org>
Date: Wed, 16 Jul 2025 10:47:06 +0200
Subject: [PATCH 3/3] blank them links

---
 themes/basspistol2025/layouts/partials/body/radio.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/themes/basspistol2025/layouts/partials/body/radio.html b/themes/basspistol2025/layouts/partials/body/radio.html
index 50544e7..1449423 100644
--- a/themes/basspistol2025/layouts/partials/body/radio.html
+++ b/themes/basspistol2025/layouts/partials/body/radio.html
@@ -28,11 +28,11 @@
       </div>
       <div>
         <br />
-        <a href="" id="supportButtonDelux" class="button player">🫰 Support this Artist</a>
+        <a target="_blank" href="" id="supportButtonDelux" class="button player">🫰 Support this Artist</a>
         <br />
-        <a class="button" href="https://radio.basspistol.com/">📻 Request song</a>
+        <a class="button" target="_blank" href="https://radio.basspistol.com/">📻 Request song</a>
         <br />
-        <a class="button" href="https://radio.basspistol.com/public/basspistol/schedule">🗓️ Schedule</a>
+        <a class="button" target="_blank" href="https://radio.basspistol.com/public/basspistol/schedule">🗓️ Schedule</a>
       </div>
     </div>
     <div id="recordPlayer">