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

temporary library-artist page

Browse source
This commit is contained in:
vapormusic 2021-12-26 22:55:13 +07:00
parent 1d36e3e56c
commit 47884f90b6
4 changed files with 43 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

31
src/renderer/index.js
View file

@ -813,9 +813,6 @@ const app = new Vue({
}) })
}, },
routeView(item) { routeView(item) {
let self = this
let kind = (item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')) : (item.type ?? '')); let kind = (item.attributes.playParams ? (item.attributes.playParams.kind ?? (item.type ?? '')) : (item.type ?? ''));
let id = (item.attributes.playParams ? (item.attributes.playParams.id ?? (item.id ?? '')) : (item.id ?? '')); let id = (item.attributes.playParams ? (item.attributes.playParams.id ?? (item.id ?? '')) : (item.id ?? ''));
; ;
@ -840,7 +837,8 @@ const app = new Vue({
app.getArtistInfo(id, isLibrary) app.getArtistInfo(id, isLibrary)
window.location.hash = `${kind}/${id}` window.location.hash = `${kind}/${id}`
document.querySelector("#app-content").scrollTop = 0 document.querySelector("#app-content").scrollTop = 0
} else if (kind.toString().includes("record-label") || kind.toString().includes("curator")) {
}else if (kind.toString().includes("record-label") || kind.toString().includes("curator")) {
if (kind.toString().includes("record-label")) { if (kind.toString().includes("record-label")) {
kind = "recordLabel" kind = "recordLabel"
} else { } else {
@ -1008,17 +1006,17 @@ const app = new Vue({
app.playMediaItemById((id), (kind), (isLibrary), item.attributes.url ?? '') app.playMediaItemById((id), (kind), (isLibrary), item.attributes.url ?? '')
} }
}, },
async getTypeFromID(kind, id, isLibrary = false, params = {}) { async getTypeFromID(kind, id, isLibrary = false, params = {}, params2 = {}) {
let a; let a;
if (kind == "album" | kind == "albums") { if (kind == "album" | kind == "albums") {
params["include"] = "tracks,artists,record-labels"; params["include"] = "tracks,artists,record-labels";
} }
try { try {
a = await this.mkapi(kind.toString(), isLibrary, id.toString(), params); a = await this.mkapi(kind.toString(), isLibrary, id.toString(), params, params2);
} catch (e) { } catch (e) {
console.log(e); console.log(e);
try { try {
a = await this.mkapi(kind.toString(), !isLibrary, id.toString(), params); a = await this.mkapi(kind.toString(), !isLibrary, id.toString(), params, params2);
} catch (err) { } catch (err) {
console.log(err); console.log(err);
a = [] a = []
@ -1210,21 +1208,20 @@ const app = new Vue({
} else { } else {
this.library.artists.displayListing = this.library.artists.listing.filter(item => { this.library.artists.displayListing = this.library.artists.listing.filter(item => {
let itemName = item.attributes.name.toLowerCase() let itemName = item.attributes.name.toLowerCase()
let searchTerm = this.library.albums.search.toLowerCase() let searchTerm = this.library.artists.search.toLowerCase()
let artistName = "" let artistName = ""
let albumName = "" let albumName = ""
if (item.attributes.artistName != null) { // if (item.attributes.artistName != null) {
artistName = item.attributes.artistName.toLowerCase() // artistName = item.attributes.artistName.toLowerCase()
} // }
if (item.attributes.albumName != null) { // if (item.attributes.albumName != null) {
albumName = item.attributes.albumName.toLowerCase() // albumName = item.attributes.albumName.toLowerCase()
} // }
// remove any non-alphanumeric characters and spaces from search term and item name // remove any non-alphanumeric characters and spaces from search term and item name
searchTerm = searchTerm.replace(/[^a-z0-9 ]/gi, "") searchTerm = searchTerm.replace(/[^a-z0-9 ]/gi, "")
itemName = itemName.replace(/[^a-z0-9 ]/gi, "") itemName = itemName.replace(/[^a-z0-9 ]/gi, "")
artistName = artistName.replace(/[^a-z0-9 ]/gi, "")
albumName = albumName.replace(/[^a-z0-9 ]/gi, "")
if (itemName.includes(searchTerm) || artistName.includes(searchTerm) || albumName.includes(searchTerm)) { if (itemName.includes(searchTerm) || artistName.includes(searchTerm) || albumName.includes(searchTerm)) {
return item return item
@ -1246,7 +1243,7 @@ const app = new Vue({
} }
try { try {
if (library) { if (library) {
return await this.mk.api.library[method](term, params, params2) return await this.mk.api.library[method](term, params, params2)
} else { } else {
return await this.mk.api[method](term, params, params2) return await this.mk.api[method](term, params, params2)
} }

54
src/renderer/views/components/libraryartist-item.ejs
View file

@ -10,18 +10,12 @@
class="cd-mediaitem-list-item" class="cd-mediaitem-list-item"
:class="{'mediaitem-selected': app.select_hasMediaItem(guid)}"> :class="{'mediaitem-selected': app.select_hasMediaItem(guid)}">
<template v-if="isVisible"> <template v-if="isVisible">
<!-- <div class="isLibrary" v-if="showLibraryStatus == true">
<button @click="addToLibrary()"
v-if="!app.isInLibrary(item.attributes.playParams) && !addedToLibrary">🖤
</button>
<button v-else @click="removeFromLibrary()">❤️</button>
</div> -->
<div class="artwork" v-if="showArtwork == true"> <div class="artwork" v-if="showArtwork == true">
<mediaitem-artwork <mediaitem-artwork
:url="item.attributes.artwork ? item.attributes.artwork.url : ''" :url="getArtwork()"
size="50" size="50"
:type="item.type"></mediaitem-artwork> :type="item.type"></mediaitem-artwork>
<button class="overlay-play" @click="playTrack()"><%- include("../svg/play.svg") %></button> <button class="overlay-play" @click="select"></button>
</div> </div>
<div class="info-rect" :style="{'padding-left': (showArtwork ? '' : '16px')}" <div class="info-rect" :style="{'padding-left': (showArtwork ? '' : '16px')}"
@dblclick="app.routeView(item)"> @dblclick="app.routeView(item)">
@ -31,35 +25,12 @@
<div class="subtitle text-overflow-elipsis" style="-webkit-box-orient: horizontal;"> <div class="subtitle text-overflow-elipsis" style="-webkit-box-orient: horizontal;">
<template v-if="item.attributes.name"> <template v-if="item.attributes.name">
<div class="artist item-navigate text-overflow-elipsis" <div class="artist item-navigate text-overflow-elipsis"
@click="app.searchAndNavigate(item,'artist')"> @click="select">
{{ item.attributes.artistName }} {{ item.attributes.artistName }}
</div> </div>
<!-- <template v-if="item.attributes.albumName">&nbsp;-&nbsp;</template>
<template v-if="item.attributes.albumName">
<div class="artist item-navigate text-overflow-elipsis"
// @click="app.searchAndNavigate(item,'album')"
>
{{ item.attributes.albumName }}
</div>
</template> -->
</template> </template>
</div> </div>
</div> </div>
<!-- <div class="content-rating" v-if="item.attributes.contentRating" @dblclick="app.routeView(item)">
{{ item.attributes.contentRating }}
</div>
<template v-if="showMetaData == true" @dblclick="app.routeView(item)">
<div class="metainfo">
{{ item.attributes.releaseDate ? new Date(item.attributes.releaseDate).toLocaleDateString()
: "" }}
</div>
<div class="metainfo">
{{ item.attributes.genreNames[0] ?? "" }}
</div>
</template>
<div class="duration" v-if="showDuration" @dblclick="app.routeView(item)">
{{ msToMinSec(item.attributes.durationInMillis ?? 0) }}
</div> -->
</template> </template>
</div> </div>
</script> </script>
@ -103,10 +74,23 @@
return this.item.attributes.playParams.kind return this.item.attributes.playParams.kind
} }
}, },
select(e) { async select(e) {
let u = this.item let u = this.item
u.attributes.playParams = {id : this.id, kind: "artists", isLibrary: true} let u1 = await app.mk.api.library.artistRelationship(u.id,"albums",
app.routeView(u) {platform: "web",
"include[library-albums]": "artists,tracks",
"include[library-artists]": "catalog",
"fields[artists]": "url",
"includeOnly": "catalog,artists"}
)
app.showCollection({data : Object.assign({},u1)}, u.attributes.name?? '', '');
},
getArtwork(){
let u = ""
try{
u = this.item.relationships.catalog.data[0].attributes.artwork.url}
catch (e){};
return u;
}, },
contextMenu(event) { contextMenu(event) {
let self = this let self = this

5
src/renderer/views/main.ejs
View file

@ -409,12 +409,12 @@
</template> </template>
</transition> </transition>
<!-- Library - Artists--> <!-- Library - Artists-->
<!-- <transition name="wpfade" v-on:enter="getLibraryArtistsFull(null, 0);"> <transition name="wpfade" v-on:enter="getLibraryArtistsFull(null, 0);">
<template v-if="page == 'library-artists'"> <template v-if="page == 'library-artists'">
<%- include('pages/library-artists') %>'); <%- include('pages/library-artists') %>');
%> %>
</template> </template>
</transition> --> </transition>
<transition name="wpfade"> <transition name="wpfade">
<template v-if="page.includes('appleCurator')" > <template v-if="page.includes('appleCurator')" >
<cider-applecurator :data="appleCurator"></cider-applecurator> <cider-applecurator :data="appleCurator"></cider-applecurator>
@ -542,6 +542,7 @@
<!-- Lyrics View --> <!-- Lyrics View -->
<%- include('components/lyrics-view') %> <%- include('components/lyrics-view') %>
<script src="musickit.js?v=1"></script>
<script> <script>
if (typeof MusicKit == 'undefined') { if (typeof MusicKit == 'undefined') {
document.write(unescape("%3Cscript src='https://js-cdn.music.apple.com/musickit/v2/amp/musickit.js' type='text/javascript'%3E%3C/script%3E")); document.write(unescape("%3Cscript src='https://js-cdn.music.apple.com/musickit/v2/amp/musickit.js' type='text/javascript'%3E%3C/script%3E"));

14
src/renderer/views/pages/library-artists.ejs
View file

@ -13,35 +13,35 @@
style="width:100%;" style="width:100%;"
spellcheck="false" spellcheck="false"
placeholder="Search..." placeholder="Search..."
@input="searchLibraryAlbums" @input="searchLibraryArtists"
v-model="library.artists.search" class="search-input"> v-model="library.artists.search" class="search-input">
</div> </div>
</div> </div>
<div class="col-auto flex-center"> <div class="col-auto flex-center">
<div class="row"> <div class="row">
<div class="col"> <!-- <div class="col">
<select class="md-select" v-model="library.artists.sorting[1]" @change="searchLibraryAlbums(1)"> <select class="md-select" v-model="library.artists.sorting[1]" @change="searchLibraryArtists(1)">
<optgroup label="Sort By"> <optgroup label="Sort By">
<option v-for="(sort, index) in library.artists.sortingOptions" :value="index">{{ sort }}</option> <option v-for="(sort, index) in library.artists.sortingOptions" :value="index">{{ sort }}</option>
</optgroup> </optgroup>
</select> </select>
</div> </div> -->
<div class="col"> <div class="col">
<select class="md-select" v-model="library.artists.sortOrder[1]" @change="searchLibraryAlbums(1)"> <select class="md-select" v-model="library.artists.sortOrder[1]" @change="searchLibraryArtists(1)">
<optgroup label="Sort Order"> <optgroup label="Sort Order">
<option value="asc">Ascending</option> <option value="asc">Ascending</option>
<option value="desc">Descending</option> <option value="desc">Descending</option>
</optgroup> </optgroup>
</select> </select>
</div> </div>
<div class="col"> <!-- <div class="col">
<select class="md-select" v-model="library.artists.viewAs"> <select class="md-select" v-model="library.artists.viewAs">
<optgroup label="View As"> <optgroup label="View As">
<option value="covers">Cover Art</option> <option value="covers">Cover Art</option>
<option value="list">List</option> <option value="list">List</option>
</optgroup> </optgroup>
</select> </select>
</div> </div> -->
</div> </div>
</div> </div>
</div> </div>