From d1c4a4abeab31d8c50fbd87ec0bc1279dd9cb039 Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 7 Dec 2021 02:11:17 -0800
Subject: [PATCH 1/2] Added isInLibrary(id)

---
 resources/cider-ui-tests/index.js       | 17 +++++++++--------
 resources/cider-ui-tests/views/main.ejs |  6 +++++-
 2 files changed, 14 insertions(+), 9 deletions(-)

diff --git a/resources/cider-ui-tests/index.js b/resources/cider-ui-tests/index.js
index cd671f11..6ade23a3 100644
--- a/resources/cider-ui-tests/index.js
+++ b/resources/cider-ui-tests/index.js
@@ -129,6 +129,12 @@ const app = new Vue({
             // Set profile name
             this.chrome.userinfo = await this.mkapi("personalSocialProfile", false, "")
 
+            // load cached library
+            if(localStorage.getItem("librarySongs") != null) {
+                this.library.songs.listing = JSON.parse(localStorage.getItem("librarySongs"))
+                this.library.songs.displayListing = this.library.songs.listing
+            }
+
             MusicKit.getInstance().videoContainerElement = document.getElementById("apple-music-video-player")
             
             this.mk.addEventListener(MusicKit.Events.playbackTimeDidChange, (a) => {
@@ -844,17 +850,12 @@ const app = new Vue({
                 self.search.results = results
             })
         },
-        isInLibrary() {
+        isInLibrary(id) {
+            let self = this
             // ugly code to check if current playback item is in library
             var found = this.library.songs.listing.filter((item)=>{
-                var playingNow = "";
-                if(this.mk.nowPlayingItem["attributes"]){
-                    if(this.mk.nowPlayingItem["attributes"]["playParams"] && this.mk.nowPlayingItem["attributes"]["playParams"]["catalogId"]){
-                        playingNow = this.mk.nowPlayingItem["attributes"]["playParams"]["catalogId"];
-                    }
-                }
                 if(item["attributes"]){
-                    if(item["attributes"]["playParams"] && item["attributes"]["playParams"]["catalogId"] == playingNow){
+                    if(item["attributes"]["playParams"] && (item["attributes"]["playParams"]["catalogId"] == id)){
                         return item;
                     }
                 }
diff --git a/resources/cider-ui-tests/views/main.ejs b/resources/cider-ui-tests/views/main.ejs
index d1c01cfd..b9b0ba11 100644
--- a/resources/cider-ui-tests/views/main.ejs
+++ b/resources/cider-ui-tests/views/main.ejs
@@ -75,7 +75,11 @@
                                             :max="mk.currentPlaybackDuration" :value="playerLCD.playbackDuration">
                                     </div>
                                 </div>
-                                <div class="actions">❤️</div>
+                                <template v-if="mk.nowPlayingItem['attributes']['playParams']['id']">
+                                    <div class="actions" v-if="isInLibrary(mk.nowPlayingItem['attributes']['playParams']['id'])">❤️</div>
+                                    <div class="actions" v-else>🖤</div>
+                                </template>
+                                
                             </div>
                         </template>
 

From 6282913b908e74f45e926d2eab46e247516eac5c Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 7 Dec 2021 02:25:01 -0800
Subject: [PATCH 2/2] slightly reduced color banding on background

---
 resources/cider-ui-tests/index.js  | 21 +++++++++++++--------
 resources/cider-ui-tests/style.css |  1 +
 2 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/resources/cider-ui-tests/index.js b/resources/cider-ui-tests/index.js
index 6ade23a3..195dc9a2 100644
--- a/resources/cider-ui-tests/index.js
+++ b/resources/cider-ui-tests/index.js
@@ -770,14 +770,19 @@ const app = new Vue({
         playMediaItemById(id, kind, isLibrary, raurl = "") {
             var truekind = (!kind.endsWith("s")) ? (kind + "s") : kind;
             console.log(id, truekind, isLibrary)
-            if (truekind == "radioStations") {
-                this.mk.setStationQueue({url: raurl}).then(function (queue) {
-                    MusicKit.getInstance().play()
-                });
-            } else {
-                this.mk.setQueue({[truekind]: [id]}).then(function (queue) {
-                    MusicKit.getInstance().play()
-                })
+            try {
+                if (truekind == "radioStations") {
+                    this.mk.setStationQueue({url: raurl}).then(function (queue) {
+                        MusicKit.getInstance().play()
+                    });
+                } else {
+                    this.mk.setQueue({[truekind]: [id]}).then(function (queue) {
+                        MusicKit.getInstance().play()
+                    })
+                }
+            }catch(err){
+                console.log(err)
+                this.playMediaItemById(id, kind, isLibrary, raurl)
             }
         },
         friendlyTypes(type) {
diff --git a/resources/cider-ui-tests/style.css b/resources/cider-ui-tests/style.css
index 6b5ab71b..70b9fd19 100644
--- a/resources/cider-ui-tests/style.css
+++ b/resources/cider-ui-tests/style.css
@@ -120,6 +120,7 @@ body[loading] {
     opacity: 0.70;
     transition: opacity .25s var(--appleEase);
     pointer-events: none;
+    transform: translateZ(0px);
 }