okseby/orchard
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'main' of https://github.com/ciderapp/Cider

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

24
resources/cider-ui/index.js
View file

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

22
resources/cider-ui/style.less
View file

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

3
resources/cider-ui/views/components/mediaitem-list-item.ejs
View file

@ -86,6 +86,9 @@
select(e) { select(e) {
if (e.shiftKey) { if (e.shiftKey) {
if (this.index != -1) { 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 allMediaItems = document.querySelectorAll(".cd-mediaitem-list-item[data-index]")
let startIndex = Math.min(...app.selectedMediaItems.map(item => item.index)) let startIndex = Math.min(...app.selectedMediaItems.map(item => item.index))
let endIndex = Math.max(...app.selectedMediaItems.map(item => item.index)) let endIndex = Math.max(...app.selectedMediaItems.map(item => item.index))