Kirill

Author: Joonas Haaparanta

main.js

@@ -14,11 +14,9 @@ const getImage = require("./getImage");
 
 app.get("/giphy/", async (req, res) => {
   const str = req.query.s;
-
   const image = await getImage(str);
 
   io.emit("show-image", { image, text: str });
-
   res.send(`sent ${str} -> ${image}`);
 });
 
@@ -36,6 +34,16 @@ const getTrack = async () => {
       };
     }
 
+    // "x-sonos-vli:RINCON_949F3E50938801400:1,airplay:d9d8916f85d85c6408e4fc55a78af190"
+    if (track.uri && track.uri.includes("airplay")) {
+      return {
+        ...track,
+        dj: " Null ",
+        isFridaySong: false,
+        airplay: "Kirill"
+      };
+    }
+
     return {
       ...track,
       dj: "....",

public/dwi.png

@@ -16,6 +16,12 @@
     <div class="c">
       <div class="beercontainer">Kaljat ~<span id="beertemp" /></div>
       <div class="silence" style="display: none;">🙉</div>
+      <div class="airplay">
+        <div class="airplay-image">
+          <img src="dwi.png" id="glass" />
+          <img id="airplay" src="kirill.png" />
+        </div>
+      </div>
       <div class="trackinfo">
         <img
           class="albumart"
@@ -168,7 +174,18 @@
     const parrot = `<img class="parrot" src="https://cultofthepartyparrot.com/parrots/parrot.gif" />`;
 
     function updateTrackData(e, track) {
-      if (track.position === null && track.duration === null) {
+      console.log("track", track);
+
+      if (track.airplay && track.airplay === "Kirill") {
+        e.trackinfo.style.display = "none";
+        e.albumart.forEach(x => {
+          x.src = "/jungle.jpg";
+        });
+      } else if (
+        track.position === null &&
+        track.duration === null &&
+        !track.airplay
+      ) {
         // Undefined track!
 
         e.trackinfo.style.display = "none";

public/index.html

@@ -5,6 +5,44 @@ body {
   font-family: "Fira Mono", monospace;
 }
 
+#glass {
+  position: absolute;
+  width: 300px;
+  margin-left: -20px;
+  top: 130px;
+  animation: Glass-drop;
+  animation-duration: 2s;
+
+  animation-iteration-count: infinite;
+  animation-direction: normal;
+  /* animation-timing-function: linear; */
+}
+
+@keyframes Glass-drop {
+  from {
+    transform: translateY(-200px);
+  }
+  to {
+    transform: translateY(0);
+  }
+}
+
+.airplay-image {
+  position: relative;
+  width: 500px;
+  height: 500px;
+  display: flex;
+  justify-content: center;
+}
+
+.airplay {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  height: 100%;
+}
+
 body {
   display: flex;
   flex-direction: column;