From 91664d2d91d581dd11a8b2b16f0f3a954d8f58f0 Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 21 Dec 2021 17:52:03 -0800
Subject: [PATCH 1/5] added brick type for media items, brick will now display
 the correct artwork

---
 src/renderer/style.less                       |  9 ++++++
 .../mediaitem-scroller-horizontal-mvview.ejs  |  2 +-
 .../views/components/mediaitem-square.ejs     | 28 +++++++++++++++----
 src/renderer/views/pages/browse.ejs           |  4 +--
 4 files changed, 34 insertions(+), 9 deletions(-)

diff --git a/src/renderer/style.less b/src/renderer/style.less
index 535c3a48..c5d0589e 100644
--- a/src/renderer/style.less
+++ b/src/renderer/style.less
@@ -2601,6 +2601,15 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
       width: 212px;
     }
   }
+
+  &.mediaitem-brick {
+    height: 200px;
+    width: 240px;
+    .artwork {
+      height: 123px;
+      width: 220px;
+    }
+  }
 }
 
 .cd-btn-seeall {
diff --git a/src/renderer/views/components/mediaitem-scroller-horizontal-mvview.ejs b/src/renderer/views/components/mediaitem-scroller-horizontal-mvview.ejs
index 3e5edb93..19919512 100644
--- a/src/renderer/views/components/mediaitem-scroller-horizontal-mvview.ejs
+++ b/src/renderer/views/components/mediaitem-scroller-horizontal-mvview.ejs
@@ -6,7 +6,7 @@
                    :badge="item.attributes"                     v-for="item in items"></mediaitem-mvview-sp>
             </template>
             <template v-else>
-                <mediaitem-square :kind="kind" :item="item ? (item.attributes.kind ? item : ((item.relationships && item.relationships.contents ) ? item.relationships.contents.data[0] : item)) : []" :imagesize="imagesize"
+                <mediaitem-square :kind="kind" size="600" :item="item ? (item.attributes.kind ? item : ((item.relationships && item.relationships.contents ) ? item.relationships.contents.data[0] : item)) : []" :imagesize="imagesize"
                 v-for="item in items"></mediaitem-square>
             </template>                            
         </div>
diff --git a/src/renderer/views/components/mediaitem-square.ejs b/src/renderer/views/components/mediaitem-square.ejs
index 2cca2e9e..39d64a40 100644
--- a/src/renderer/views/components/mediaitem-square.ejs
+++ b/src/renderer/views/components/mediaitem-square.ejs
@@ -6,9 +6,9 @@
                     <div class="artwork-container">
                         <div class="artwork" @click='app.routeView(item)'>
                             <mediaitem-artwork
-                                    :url="item.attributes.artwork ? item.attributes.artwork.url : ''"
+                                    :url="getArtworkUrl()"
                                     :video="(item.attributes != null && item.attributes.editorialVideo != null) ? (item.attributes.editorialVideo.motionDetailSquare ? item.attributes.editorialVideo.motionDetailSquare.video : (item.attributes.editorialVideo.motionSquareVideo1x1 ? item.attributes.editorialVideo.motionSquareVideo1x1.video : '')) : '' "
-                                    size="300"
+                                    :size="size"
                                     shadow="subtle"
                                     :type="item.type"></mediaitem-artwork>
                         </div>
@@ -38,6 +38,10 @@
             kind: {
                 type: String,
                 default: ''
+            },
+            size: {
+                type: String,
+                default: '300'
             }
         },
         data: function () {
@@ -48,19 +52,31 @@
             }
         },
         methods: {
+            getArtworkUrl() {
+                let artwork = this.item.attributes.artwork ? this.item.attributes.artwork.url : ''
+                switch (this.kind) {
+                    case "385":
+                        artwork = this.item.attributes.editorialArtwork.subscriptionHero.url
+                        break;
+                }
+                return artwork
+            },
             getClasses() {
                 let type = this.item.type
-                if(this.kind != "") {
+                if (this.kind != "") {
                     type = this.kind
                 }
-                switch(type) {
+                switch (type) {
                     default:
                         return []
-                    break;
+                        break;
+                    case "385": // editorial
+                        return ["mediaitem-brick"]
+                        break;
                     case "music-videos":
                     case "uploaded-videos":
                         return "mediaitem-video";
-                    break;
+                        break;
                 }
             },
             visibilityChanged: function (isVisible, entry) {
diff --git a/src/renderer/views/pages/browse.ejs b/src/renderer/views/pages/browse.ejs
index 0bec99e1..b8ebbd93 100644
--- a/src/renderer/views/pages/browse.ejs
+++ b/src/renderer/views/pages/browse.ejs
@@ -13,11 +13,11 @@
             </div>
             <template v-if="recom.relationships && ((recom.relationships.children && recom.relationships.children.data) || (recom.relationships.contents && recom.relationships.contents.data))">
                 <template v-if="index === 0">
-                    <mediaitem-scroller-horizontal-mvview :imagesize="800" :browsesp="index == 0"
+                    <mediaitem-scroller-horizontal-mvview :imagesize="800" :browsesp="index == 0" :kind="recom.attributes.editorialElementKind"
                             :items="recom.relationships.children ? recom.relationships.children.data.limit(10) : recom.relationships.contents.data.limit(10)"></mediaitem-scroller-horizontal-mvview>
                 </template>
                 <template v-else-if="(['385']).includes(recom.attributes.editorialElementKind)">
-                    <mediaitem-scroller-horizontal-mvview :imagesize="800" kind="music-videos"
+                    <mediaitem-scroller-horizontal-mvview :imagesize="800" :kind="recom.attributes.editorialElementKind"
                             :items="recom.relationships.children ? recom.relationships.children.data.limit(10) : recom.relationships.contents.data.limit(10)"></mediaitem-scroller-horizontal-mvview>
                 </template>
                 <template v-else-if="recom.attributes.name == 'Chart Set'">

From 4042be4eaf4f4e88d1ecdbbd1ded06b9c1c58b4d Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 21 Dec 2021 18:12:35 -0800
Subject: [PATCH 2/5] fix for unknown types in collection view

---
 .../views/components/mediaitem-square.ejs     |  1 +
 src/renderer/views/pages/collection-list.ejs  | 19 ++++++++++++++++---
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/src/renderer/views/components/mediaitem-square.ejs b/src/renderer/views/components/mediaitem-square.ejs
index 39d64a40..bb4d4aa8 100644
--- a/src/renderer/views/components/mediaitem-square.ejs
+++ b/src/renderer/views/components/mediaitem-square.ejs
@@ -74,6 +74,7 @@
                         return ["mediaitem-brick"]
                         break;
                     case "music-videos":
+                    case "uploadedVideo":
                     case "uploaded-videos":
                         return "mediaitem-video";
                         break;
diff --git a/src/renderer/views/pages/collection-list.ejs b/src/renderer/views/pages/collection-list.ejs
index 70d46907..0da3265d 100644
--- a/src/renderer/views/pages/collection-list.ejs
+++ b/src/renderer/views/pages/collection-list.ejs
@@ -1,6 +1,7 @@
 <script type="text/x-template" id="cider-collection-list">
     <div class="content-inner collection-page">
         <h3 class="header-text" v-observe-visibility="{callback: headerVisibility}">{{ title }}</h3>
+        {{ commonKind }}
         <div v-if="data['data'] != 'null'" class="well">
             <template v-for="(item, key) in data.data">
                 <template v-if="item.type == 'artists'">
@@ -8,10 +9,10 @@
                 </template>
                 <template v-else>
                     <mediaitem-list-item
-                            v-if="item.attributes.playParams.kind == 'song'"
+                            v-if="getKind(item) == 'song'"
                             :index="key"
                             :item="item"></mediaitem-list-item>
-                    <mediaitem-square v-else :item="item" :type="item.attributes.playParams.kind"></mediaitem-square>
+                    <mediaitem-square v-else :item="item" :type="getKind(item)"></mediaitem-square>
                 </template>
             </template>
             <button v-if="triggerEnabled" style="opacity:0;height: 32px;" v-observe-visibility="{callback: visibilityChanged}">Show More</button>
@@ -45,10 +46,22 @@
             return {
                 triggerEnabled: true,
                 canSeeTrigger: false,
-                showFab: false
+                showFab: false,
+                commonKind: "song"
             }
         },
         methods: {
+            getKind(item) {
+                if(typeof item.kind != "undefined") {
+                    this.commonKind = item.kind;
+                    return item.kind
+                }
+                if(typeof item.attributes.playParams != "undefined") {
+                    this.commonKind = item.attributes.playParams.kind
+                    return item.attributes.playParams.kind
+                }
+                return this.commonKind
+            },
             scrollToTop() {
                 let target = document.querySelector(".header-text")
                 target.scrollIntoView({behavior: "smooth", block: "start", inline: "nearest"})

From 950271e4465aefe0e1fcebafbfc81328e702d518 Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 21 Dec 2021 18:12:52 -0800
Subject: [PATCH 3/5] Update collection-list.ejs

---
 src/renderer/views/pages/collection-list.ejs | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/renderer/views/pages/collection-list.ejs b/src/renderer/views/pages/collection-list.ejs
index 0da3265d..75986dc9 100644
--- a/src/renderer/views/pages/collection-list.ejs
+++ b/src/renderer/views/pages/collection-list.ejs
@@ -1,7 +1,6 @@
 <script type="text/x-template" id="cider-collection-list">
     <div class="content-inner collection-page">
         <h3 class="header-text" v-observe-visibility="{callback: headerVisibility}">{{ title }}</h3>
-        {{ commonKind }}
         <div v-if="data['data'] != 'null'" class="well">
             <template v-for="(item, key) in data.data">
                 <template v-if="item.type == 'artists'">

From c3f3e15875309b3248bc95a7c305a2162a6a87a1 Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 21 Dec 2021 18:19:44 -0800
Subject: [PATCH 4/5] adjusted mediaitem square for apple-curators

---
 src/renderer/views/components/mediaitem-square.ejs | 11 ++++++++---
 1 file changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/renderer/views/components/mediaitem-square.ejs b/src/renderer/views/components/mediaitem-square.ejs
index bb4d4aa8..0d37567c 100644
--- a/src/renderer/views/components/mediaitem-square.ejs
+++ b/src/renderer/views/components/mediaitem-square.ejs
@@ -12,8 +12,8 @@
                                     shadow="subtle"
                                     :type="item.type"></mediaitem-artwork>
                         </div>
-                        <button class="menu-btn" v-if="item.type != 'artists' && item.type != 'stations'" @click="contextMenu"><%- include("../svg/more.svg") %></button>
-                        <button class="play-btn" @click="app.playMediaItem(item)"><%- include("../svg/play.svg") %></button>
+                        <button class="menu-btn" v-if="!nomenu.includes(item.type)" @click="contextMenu"><%- include("../svg/more.svg") %></button>
+                        <button class="play-btn" v-if="!noplay.includes(item.type)" @click="app.playMediaItem(item)"><%- include("../svg/play.svg") %></button>
                     </div>
                     <div class="title item-navigate text-overflow-elipsis" @click.self='app.routeView(item)'>
                         {{ item.attributes.name }}
@@ -48,7 +48,9 @@
             return {
                 isVisible: false,
                 addedToLibrary: false,
-                guid: uuidv4()
+                guid: uuidv4(),
+                noplay: ["apple-curators"],
+                nomenu: ["artists", "stations", "apple-curators"]
             }
         },
         methods: {
@@ -84,6 +86,9 @@
                 this.isVisible = isVisible
             },
             contextMenu(event) {
+                if(this.nomenu.includes(this.item.type)) {
+                    return
+                }
                 if (!event) { event = this.$refs.main } else { console.log(event) }
                 let self = this
                 let useMenu = "normal"

From be473495e34a7948b64f8cf5662e27560aae07f4 Mon Sep 17 00:00:00 2001
From: booploops <49113086+booploops@users.noreply.github.com>
Date: Tue, 21 Dec 2021 18:21:36 -0800
Subject: [PATCH 5/5] Update style.less

---
 src/renderer/style.less | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/renderer/style.less b/src/renderer/style.less
index c5d0589e..358b45ea 100644
--- a/src/renderer/style.less
+++ b/src/renderer/style.less
@@ -2547,7 +2547,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
 
     >.play-btn,
     >.menu-btn {
-      display: none;
+      opacity: 0;
       appearance: none;
       padding:0px;
       border:0px;
@@ -2557,6 +2557,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
       background: rgba(50, 50, 50, 0.7);
       cursor: pointer;
       backdrop-filter: blur(32px) saturate(180%);
+      transition: opacity 0.1s var(--appleEase);
     }
 
     >.play-btn {
@@ -2576,7 +2577,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
     &:hover {
       >.play-btn,
       >.menu-btn {
-        display: block;
+        opacity: 1;
       }
     }
   }