This commit is contained in:
vapormusic 2021-12-17 20:52:17 +07:00
commit 7289ab525d
3 changed files with 41 additions and 10 deletions

View file

@ -576,7 +576,7 @@ const app = new Vue({
}
},
async getNowPlayingItemDetailed(target) {
let u = await app.mkapi(app.mk.nowPlayingItem.playParams.kind, (app.mk.nowPlayingItem.songId == -1), (app.mk.nowPlayingItem.songId != -1) ? app.mk.nowPlayingItem.songId : app.mk.nowPlayingItem.id, {"include[songs]": "albums,artists"});
let u = await app.mkapi(app.mk.nowPlayingItem.playParams.kind, (app.mk.nowPlayingItem.songId == -1), (app.mk.nowPlayingItem.songId != -1) ? app.mk.nowPlayingItem.songId : app.mk.nowPlayingItem["id"], {"include[songs]": "albums,artists"});
app.searchAndNavigate(u, target)
},
async searchAndNavigate(item, target) {
@ -1656,17 +1656,18 @@ const app = new Vue({
return newurl
},
getNowPlayingArtworkBG(size = 600) {
if(typeof this.mk.nowPlayingItem === "undefined") return;
let bginterval = setInterval(() => {
if (!this.mkReady()) {
return ""
}
try {
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem.id && this.mk.nowPlayingItem.id != this.currentTrackID && document.querySelector('.bg-artwork')) {
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] != this.currentTrackID && document.querySelector('.bg-artwork')) {
if (document.querySelector('.bg-artwork')) {
clearInterval(bginterval);
}
this.currentTrackID = this.mk.nowPlayingItem.id;
this.currentTrackID = this.mk.nowPlayingItem["id"];
document.querySelector('.bg-artwork').src = "";
if (this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"]) {
document.querySelector('.bg-artwork').src = this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"].replace('{w}', size).replace('{h}', size);
@ -1674,21 +1675,22 @@ const app = new Vue({
} else {
this.setLibraryArtBG()
}
} else if (this.mk.nowPlayingItem.id == this.currentTrackID){
} else if (this.mk.nowPlayingItem["id"] == this.currentTrackID){
try { clearInterval(bginterval); } catch (err) { console.log(err) }
}
} catch (e) {
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem.id && document.querySelector('.bg-artwork')){
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] && document.querySelector('.bg-artwork')){
this.setLibraryArtBG()}
}
}, 200)
},
getNowPlayingArtwork(size = 600) {
if(typeof this.mk.nowPlayingItem === "undefined") return;
let interval = setInterval(() => {
try {
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem.id && this.mk.nowPlayingItem.id != this.currentTrackIDBG && document.querySelector('.app-playback-controls .artwork')) {
this.currentTrackIDBG = this.mk.nowPlayingItem.id;
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] != this.currentTrackIDBG && document.querySelector('.app-playback-controls .artwork')) {
this.currentTrackIDBG = this.mk.nowPlayingItem["id"];
if (document.querySelector('.app-playback-controls .artwork') != null) {
clearInterval(interval);
}
@ -1699,11 +1701,11 @@ const app = new Vue({
} else {
this.setLibraryArt()
}
} else if (this.mk.nowPlayingItem.id == this.currentTrackID){
} else if (this.mk.nowPlayingItem["id"] == this.currentTrackID){
try { clearInterval(interval); } catch (err) { console.log(err) }
}
} catch (e) {
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem.id && document.querySelector('.app-playback-controls .artwork')){
if (this.mk.nowPlayingItem && this.mk.nowPlayingItem["id"] && document.querySelector('.app-playback-controls .artwork')){
this.setLibraryArt()}
}
@ -1712,6 +1714,8 @@ const app = new Vue({
},
async setLibraryArt() {
if(typeof this.mk.nowPlayingItem === "undefined") return;
const data = await this.mk.api.library.song(this.mk.nowPlayingItem["id"])
try {
const data = await this.mk.api.library.song(this.mk.nowPlayingItem.id)
@ -1724,6 +1728,8 @@ const app = new Vue({
}
},
async setLibraryArtBG() {
if(typeof this.mk.nowPlayingItem === "undefined") return;
const data = await this.mk.api.library.song(this.mk.nowPlayingItem["id"])
try {
const data = await this.mk.api.library.song(this.mk.nowPlayingItem.id)

View file

@ -9,6 +9,7 @@
--contentInnerPadding: 16px;
--navbarHeight: 48px;
--selected: rgb(130 130 130 / 30%);
--selected-click: rgb(80 80 80 / 30%);
--keyColor: #fa586a;
--keyColor-rgb: 250, 88, 106;
--keyColor-rollover: #ff8a9c;
@ -1740,6 +1741,9 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
&:hover {
opacity:1;
}
&:active {
background: var(--selected-click);
}
>svg {
width: 70%;
}
@ -1912,6 +1916,11 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
background: var(--selected);
}
&:active {
background: var(--selected-click);
color: #eee;
}
.queue-info {
display:flex;
flex-direction: column;
@ -1985,6 +1994,9 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
&:hover {
opacity: 1;
}
&:active {
background: var(--selected-click);
}
}
}
@ -2054,10 +2066,19 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
&:hover {
background: rgb(200 200 200 / 10%);
.overlay-play {
opacity: 1;
}
}
&.mediaitem-selected {
background: var(--selected);
background: var(--selected);
}
&:active {
background: var(--selected-click);
color: #eee;
}
}
@ -2566,6 +2587,7 @@ div#captions {
.item-navigate:hover {
text-decoration: underline;
cursor: pointer;
}
.title-browse-sp{

View file

@ -86,6 +86,9 @@
select(e) {
if (e.shiftKey) {
if (this.index != -1) {
if(app.selectedMediaItems.length == 0) {
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type, this.index, this.guid)
}
let allMediaItems = document.querySelectorAll(".cd-mediaitem-list-item[data-index]")
let startIndex = Math.min(...app.selectedMediaItems.map(item => item.index))
let endIndex = Math.max(...app.selectedMediaItems.map(item => item.index))