diff --git a/src/renderer/style.less b/src/renderer/style.less index 535c3a48..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; } } } @@ -2601,6 +2602,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"> diff --git a/src/renderer/views/components/mediaitem-square.ejs b/src/renderer/views/components/mediaitem-square.ejs index 2cca2e9e..0d37567c 100644 --- a/src/renderer/views/components/mediaitem-square.ejs +++ b/src/renderer/views/components/mediaitem-square.ejs @@ -6,14 +6,14 @@
- - + +
{{ item.attributes.name }} @@ -38,35 +38,57 @@ kind: { type: String, default: '' + }, + size: { + type: String, + default: '300' } }, data: function () { return { isVisible: false, addedToLibrary: false, - guid: uuidv4() + guid: uuidv4(), + noplay: ["apple-curators"], + nomenu: ["artists", "stations", "apple-curators"] } }, 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 "uploadedVideo": case "uploaded-videos": return "mediaitem-video"; - break; + break; } }, visibilityChanged: function (isVisible, entry) { 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" 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 @@
@@ -45,10 +45,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"})