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

Merge pull request #2 from ciderapp/develop

Browse source 
Develop
This commit is contained in:
Amaru8 2022-04-22 11:50:20 +02:00 • committed by GitHub
commit fe12512138
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
24 changed files with 2294 additions and 2329 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/renderer/views/components/add-to-playlist.ejs
View file

@ -1,5 +1,4 @@
<script type="text/x-template" id="add-to-playlist">
<template>
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()" @contextmenu.self="app.resetState()">
<div class="modal-window">
<div class="modal-header">
@ -30,7 +29,6 @@
</div>
</div>
</div>
</template>
</script>
<script>
@ -65,7 +63,7 @@
},
methods: {
playlistSelect(playlist) {
if(playlist.type != "library-playlist-folders") {
if (playlist.type != "library-playlist-folders") {
this.addToPlaylist(playlist.id)
}
},

5
src/renderer/views/components/mediaitem-scroller-horizontal.ejs
View file

@ -1,5 +1,5 @@
<script type="text/x-template" id="mediaitem-scroller-horizontal">
<vue-horizontal>
<vue-horizontal ref="horizontal">
<slot></slot>
<mediaitem-square :key="item?.id ?? ''" :kind="kind" :item="item" v-for="item in items"></mediaitem-square>
</vue-horizontal>
@ -24,6 +24,9 @@
app: this.$root,
}
},
mounted() {
// this.$refs.horizontal.refresh()
},
methods: {}
});
</script>

55
src/renderer/views/components/sidebar-playlist.ejs
View file

@ -40,7 +40,7 @@
relateMediaItems: {
type: Array,
required: false,
default () {
default() {
return []
}
}
@ -62,30 +62,33 @@
this.icon = await this.$root.getSvgIcon("./assets/feather/folder.svg")
}
let playlistMap = this.$root.playlists.trackMapping
if(this.relateMediaItems.length != 0) {
if(playlistMap[this.relateMediaItems[0]].includes(this.item.id)) {
this.hasRelatedMediaItems = true
if (this.relateMediaItems.length != 0) {
if (playlistMap[this.relateMediaItems[0]]) {
if (playlistMap[this.relateMediaItems[0]].includes(this.item.id)) {
this.hasRelatedMediaItems = true
}
}
}
},
methods: {
clickEvent() {
if(this.item.type != "library-playlist-folders") {
if(this.playlistSelect) {
if (this.item.type != "library-playlist-folders") {
if (this.playlistSelect) {
this.playlistSelect(this.item)
}else{
} else {
this.openPlaylist(this.item)
}
}else{
} else {
this.getPlaylistChildren(this.item)
}
},
rename() {
this.renaming = false
if(this.item.type === "library-playlist-folders") {
if (this.item.type === "library-playlist-folders") {
this.$root.editPlaylistFolder(this.item.id, this.item.attributes.name)
}else{
} else {
this.$root.editPlaylist(this.item.id, this.item.attributes.name)
}
},
@ -93,7 +96,7 @@
let self = this
this.children = []
this.children = this.$root.playlists.listing.filter(child => {
if(child.parent == self.item.id) {
if (child.parent == self.item.id) {
return child
}
})
@ -117,13 +120,13 @@
// find the item in this.$root.playlists.listing and store it in a variable
this.$root.playlists.listing.filter(playlist => {
if(playlist.id == item.id) {
if (playlist.id == item.id) {
console.log(playlist)
playlist.parent = sendTo.id
}
})
if(typeof this.$parent.getChildren == "function") {
if (typeof this.$parent.getChildren == "function") {
this.$parent.getChildren()
console.log(this.$parent.children)
}
@ -142,14 +145,14 @@
id: this.playlistRoot,
type: "library-playlist-folders"
})
setTimeout(()=>{self.getChildren()}, 2000)
setTimeout(() => { self.getChildren() }, 2000)
}
},
"rename": {
name: this.$root.getLz('action.rename'),
action: () => {
this.renaming = true
setTimeout(()=>{
setTimeout(() => {
document.querySelector(".pl-rename-field").focus()
document.querySelector(".pl-rename-field").select()
}, 100)
@ -171,7 +174,7 @@
}
}
}
if(this.item.type === "library-playlist-folders") {
if (this.item.type === "library-playlist-folders") {
menu.items.addToFavorites.disabled = true
}
app.showMenuPanel(menu, event)
@ -180,23 +183,23 @@
evt.preventDefault();
evt.dataTransfer.dropEffect = "move";
},
onDrop (evt) {
onDrop(evt) {
let data = JSON.parse(evt.dataTransfer.getData("text/plain"))
evt.preventDefault();
if(data.id == this.item.id) {
if (data.id == this.item.id) {
return;
}
console.log(data)
if(data) {
if(this.item.type == "library-playlists" || this.item.type == "library-playlist-folders") {
if(data.type == "library-playlists" && this.item.type == "library-playlists") {
if (data) {
if (this.item.type == "library-playlists" || this.item.type == "library-playlist-folders") {
if (data.type == "library-playlists" && this.item.type == "library-playlists") {
return
}
this.move(data, this.item)
}
}
},
startDrag (evt) {
startDrag(evt) {
evt.dataTransfer.dropEffect = 'move'
evt.dataTransfer.effectAllowed = 'move'
evt.dataTransfer.setData('text/plain', JSON.stringify(this.item))
@ -211,11 +214,11 @@
this.children = []
this.getChildren()
this.toggleFolder()
this.$root.mk.api.v3.music(`v1/me/library/playlist-folders/${item.id}/children`).then(data => {
let children = data.data.data;
children.forEach(child => {
if(!self.$root.playlists.listing.find(listing => listing.id == child.id)) {
if (!self.$root.playlists.listing.find(listing => listing.id == child.id)) {
child.parent = self.item.id
self.$root.playlists.listing.push(child)
}
@ -234,9 +237,9 @@
})
},
isPlaylistSelected(item) {
if(this.$root.showingPlaylist.id == item.id) {
if (this.$root.showingPlaylist.id == item.id) {
return ["active"]
} else {
} else {
return []
}
},

2
src/renderer/views/pages/audiolabs.ejs
View file

@ -5,7 +5,7 @@
<div class="settings-option-body">
<div class="md-option-line">
<b-jumbotron :header="$root.getLz('settings.option.audio.audioLab')"
lead="$root.getLz('settings.option.audio.audioLab.subheader')"></b-jumbotron>
:lead="$root.getLz('settings.option.audio.audioLab.subheader')"></b-jumbotron>
</div>
<div class="md-option-line" v-show="app.cfg.advanced.AudioContext === false">
<div class="md-option-segment">

292
src/renderer/views/pages/cider-playlist.ejs
View file

@ -1,5 +1,6 @@
<script type="text/x-template" id="cider-playlist">
<div class="content-inner playlist-page" v-if="data != [] && data.attributes != null"
<div class="content-inner playlist-page" :class="classes" v-if="data != [] && data.attributes != null"
:style="{'--bgColor': (data.attributes.artwork != null && data.attributes.artwork['bgColor'] != null) ? ('#' + data.attributes.artwork.bgColor) : ''}">
<template v-if="app.playlists.loadingState == 0">
<div class="content-inner centered">
@ -8,14 +9,15 @@
</template>
<template v-if="app.playlists.loadingState == 1">
<div class="playlist-display"
@mouseover.self="minClass(false)"
:style="{
'--bgColor': (data.attributes.artwork != null && data.attributes.artwork['bgColor'] != null) ? ('#' + data.attributes.artwork.bgColor) : '',
'--textColor': (data.attributes.artwork != null && data.attributes.artwork['textColor1'] != null) ? ('#' + data.attributes.artwork.textColor1) : ''
}">
<div class="playlistInfo">
<div class="row">
<div class="col-auto flex-center">
<div style="width: 260px;height:260px;">
<div class="col-auto flex-center" @mouseover="minClass(false)">
<div class="mediaContainer">
<mediaitem-artwork
shadow="large"
:video-priority="true"
@ -28,11 +30,11 @@
<div class="col playlist-info">
<template v-if="!editorialNotesExpanded">
<div>
<div class="playlist-name" @click="editPlaylistName()" v-show="!nameEditing">
<div class="playlist-name" @mouseover="minClass(false)" @click="editPlaylistName()" v-show="!nameEditing">
{{data.attributes ? (data.attributes.name ??
(data.attributes.title ?? '') ?? '') : ''}}
</div>
<div class="playlist-name" v-show="nameEditing"><input type="text"
<div class="playlist-name" @mouseover="minClass(false)" v-show="nameEditing"><input type="text"
spellcheck="false"
class="nameEdit"
v-model="data.attributes.name"
@ -50,11 +52,15 @@
<artist-chip v-for="artist in data.relationships.artists?.data"
:item="artist"></artist-chip>
</template>
<div class="playlist-desc" v-if="(data.attributes.description && (data.attributes.description.standard || data.attributes.description.short)) || (data.attributes.editorialNotes && (data.attributes.editorialNotes.standard || data.attributes.editorialNotes.short))">
<div v-if="(data.attributes.description?.short ?? data.attributes.editorialNotes?.short) != null" class="content"
v-html="data.attributes.description?.short ?? data.attributes.editorialNotes?.short" @click="openInfoModal()"></div>
<div v-else-if="(data.attributes.description?.standard ?? data.attributes.editorialNotes?.standard) != null" class="content"
v-html="data.attributes.description?.standard ?? data.attributes.editorialNotes?.standard"></div>
<div class="playlist-desc"
v-if="(data.attributes.description && (data.attributes.description.standard || data.attributes.description.short)) || (data.attributes.editorialNotes && (data.attributes.editorialNotes.standard || data.attributes.editorialNotes.short))">
<div v-if="(data.attributes.description?.short ?? data.attributes.editorialNotes?.short) != null"
class="content"
v-html="data.attributes.description?.short ?? data.attributes.editorialNotes?.short"
@click="openInfoModal()"></div>
<div v-else-if="(data.attributes.description?.standard ?? data.attributes.editorialNotes?.standard) != null"
class="content"
v-html="data.attributes.description?.standard ?? data.attributes.editorialNotes?.standard"></div>
<!-- <button v-if="(data.attributes.description?.short ?? data.attributes.editorialNotes?.short ) != null" class="more-btn"
@click="editorialNotesExpanded = !editorialNotesExpanded">
{{app.getLz('term.showMore')}}
@ -142,78 +148,93 @@
</div>
</div>
</div>
<div class="playlist-body">
<div class="well">
<div style="width:100%">
<draggable :sort="data.attributes.canEdit && data.type == 'library-playlists'"
v-model="data.relationships.tracks.data" @start="drag=true" @end="drag=false;put()">
<template v-if="nestedPlaylist == [] || nestedPlaylist.length <= 1">
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in data.relationships.tracks.data"></mediaitem-list-item>
<div class="playlist-body scrollbody">
<b-tabs pills class="track-pills pilldim" align="center" content-class="mt-3">
<b-tab :title="$root.getLz('term.tracks')">
<div @wheel="minClass(true)" @scroll="minClass(true)">
<div class="">
<div style="width:100%" @click="minClass(true)">
<draggable :sort="data.attributes.canEdit && data.type == 'library-playlists'"
v-model="data.relationships.tracks.data" @start="drag=true"
@end="drag=false;put()">
<template v-if="nestedPlaylist == [] || nestedPlaylist.length <= 1">
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in data.relationships.tracks.data"></mediaitem-list-item>
</template>
<template v-else>
<div v-for="disc in nestedPlaylist">
<div class="playlist-time">{{($root.getLz("term.discNumber") ?? "").replace("${discNumber}",disc.disc)}}</div>
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in disc.tracks"></mediaitem-list-item>
</div>
</template>
</draggable>
<div class="playlist-time">{{($root.getLz("term.discNumber") ??
"").replace("${discNumber}",disc.disc)}}
</div>
<mediaitem-list-item :item="item" :parent="getItemParent(data)"
:index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in disc.tracks"></mediaitem-list-item>
</div>
</div>
</template>
</draggable>
</div>
<div class="friends-info" v-if="itemBadges.length != 0">
<div class="well">
<div class="badge-container">
<div class="socialBadge" :title="`${badge.attributes.name} - @${badge.attributes.handle}`"
v-for="badge in itemBadges">
<mediaitem-artwork
:url="badge.attributes.artwork.url"
:size="60"></mediaitem-artwork>
</div>
</div>
<div class="friends-info" v-if="itemBadges.length != 0">
<div class="well">
<div class="badge-container">
<div class="socialBadge"
:title="`${badge.attributes.name} - @${badge.attributes.handle}`"
v-for="badge in itemBadges">
<mediaitem-artwork
:url="badge.attributes.artwork.url"
:size="60"></mediaitem-artwork>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="playlist-time">
{{getFormattedDate()}}
</div>
<div class="playlist-time total">{{app.getTotalTime()}}</div>
<div class="playlist-time item-navigate" @click="app.searchAndNavigate(data,'recordLabel') "
style="width: 50%;">
{{data.attributes.copyright}}
</div>
<template
v-if="(data.attributes?.playParams?.kind ?? data.type ?? '').includes('album') && data.relationships.catalog != null && data.relationships.catalog != null && data.relationships.catalog.data.length > 0">
<div class="playlist-time showExtended item-navigate" style="color:#fa586a; font-weight: bold"
@click="app.routeView(data.relationships.catalog.data[0])">
{{$root.getLz("action.showAlbum")}}
</div>
</template>
<hr>
<template v-if="typeof data.meta != 'undefined'">
<div v-for="view in data.meta.views.order" v-if="data.views[view].data.length != 0">
<div class="row">
<div class="col">
<h3>{{ data.views[view].attributes.title }}</h3>
</div>
<div class="playlist-time">
{{getFormattedDate()}}
</div>
<div class="row">
<div class="col">
<mediaitem-scroller-horizontal
:items="data.views[view].data"></mediaitem-scroller-horizontal>
</div>
<div class="playlist-time total">{{app.getTotalTime()}}</div>
<div class="playlist-time item-navigate" @click="app.searchAndNavigate(data,'recordLabel') "
style="width: 50%;">
{{data.attributes.copyright}}
</div>
</div>
</template>
<template
v-if="(data.attributes?.playParams?.kind ?? data.type ?? '').includes('album') && data.relationships.catalog != null && data.relationships.catalog != null && data.relationships.catalog.data.length > 0">
<div class="playlist-time showExtended item-navigate"
style="color:#fa586a; font-weight: bold"
@click="app.routeView(data.relationships.catalog.data[0])">
{{$root.getLz("action.showAlbum")}}
</div>
</template>
</div>
</b-tab>
<template v-if="typeof data.views != 'undefined'">
<b-tab lazy :title="data.views[view].attributes.title" v-for="view in data.meta.views.order"
v-if="data.views[view].data.length != 0">
<div >
<div class="row">
<div class="col">
<h3>{{ data.views[view].attributes.title }}</h3>
</div>
</div>
<div class="row">
<div class="col">
<mediaitem-scroller-horizontal
:items="data.views[view].data"></mediaitem-scroller-horizontal>
</div>
</div>
</div>
</b-tab>
</template>
</b-tabs>
</div>
</template>
</div>
@ -238,6 +259,7 @@
headerVisible: true,
useArtistChip: false,
nestedPlaylist: [],
classes: [],
}
},
mounted: function () {
@ -254,31 +276,41 @@
}
},
methods: {
openInfoModal(){
minClass(val) {
if (val) {
this.classes = ["plmin"]
} else {
this.classes = []
}
},
openInfoModal() {
app.moreinfodata = [];
app.moreinfodata = {
title : this.data?.attributes ? (this.data?.attributes?.name ??
(this.data?.attributes?.title ?? '') ?? '') : '',
title: this.data?.attributes ? (this.data?.attributes?.name ??
(this.data?.attributes?.title ?? '') ?? '') : '',
subtitle: this.data?.attributes?.artistName ?? '',
content: ((this.data?.attributes?.editorialNotes != null ) ? (this.data?.attributes?.editorialNotes?.standard ?? (this.data?.attributes?.editorialNotes?.short ?? '') ) : (data.attributes?.description ? (this.data.attributes?.description?.standard ?? (this.data?.attributes?.description?.short ?? '')) : ''))
content: ((this.data?.attributes?.editorialNotes != null) ? (this.data?.attributes?.editorialNotes?.standard ?? (this.data?.attributes?.editorialNotes?.short ?? '')) : (data.attributes?.description ? (this.data.attributes?.description?.standard ?? (this.data?.attributes?.description?.short ?? '')) : ''))
}
app.modals.moreInfo = true;
},
generateNestedPlaylist(){
generateNestedPlaylist() {
this.nestedPlaylist = [];
if (this.data?.type?.includes("album")){
console.log(this.data.relationships.tracks.data)
let songlists = this.data.relationships.tracks.data;
let discs = songlists.map(x => {return x.attributes.discNumber}).filter((item, i, ar) => ar.indexOf(item) === i);
if (discs && discs.length > 1){
for (disc of discs){
let songs = songlists.filter(x => x.attributes.discNumber == disc);
this.nestedPlaylist.push({disc: disc, tracks: songs})
if (this.data?.type?.includes("album")) {
console.log(this.data.relationships.tracks.data)
let songlists = this.data.relationships.tracks.data;
let discs = songlists.map(x => {
return x.attributes.discNumber
}).filter((item, i, ar) => ar.indexOf(item) === i);
if (discs && discs.length > 1) {
for (disc of discs) {
let songs = songlists.filter(x => x.attributes.discNumber == disc);
this.nestedPlaylist.push({disc: disc, tracks: songs})
}
}
}
console.log(this.nestedPlaylist)
console.log(this.nestedPlaylist)
}},
}
},
isHeaderVisible(visible) {
this.headerVisible = visible
},
@ -330,7 +362,7 @@
if (this.data.type.includes('albums')) {
let date = this.data.attributes.releaseDate;
if (date == null || date === "") return "";
return `${this.data.relationships.tracks.data[0].attributes.genreNames[0]} · ${new Date(date).getFullYear()}`
return `${this.data.relationships.tracks.data[0].attributes.genreNames[0]} · ${new Date(date).getFullYear()}`
}
},
async isInLibrary() {
@ -462,19 +494,70 @@
}
})
},
menu(event) {
async menu(event) {
let self = this
let artistId = null
if(typeof this.data.relationships.artists != "undefined") {
if (typeof this.data.relationships.artists != "undefined") {
artistId = this.data.relationships.artists.data[0].id
if(this.data.relationships.artists.data[0].type == "library-artists") {
if (this.data.relationships.artists.data[0].type == "library-artists") {
artistId = this.data.relationships.artists.data[0].relationships.catalog.data[0].id
}
}
let menuItems = {
headerItems: [
{
"icon": "./assets/feather/heart.svg",
"id": "love",
"name": app.getLz('action.love'),
"hidden": false,
"disabled": true,
"action": function () {
app.love(self.data)
}
},
{
"icon": "./assets/feather/heart.svg",
"id": "unlove",
"active": true,
"name": app.getLz('action.unlove'),
"hidden": true,
"action": function () {
app.unlove(self.data)
}
},
{
"icon": "./assets/feather/thumbs-down.svg",
"id": "dislike",
"name": app.getLz('action.dislike'),
"hidden": false,
"disabled": true,
"action": function () {
app.dislike(self.data)
}
},
{
"icon": "./assets/feather/thumbs-down.svg",
"id": "undo_dislike",
"name": app.getLz('action.undoDislike'),
"active": true,
"hidden": true,
"action": function () {
app.unlove(self.data)
}
},
],
items: {
"addToPlaylist": {
name: app.getLz('action.addToPlaylist'),
"icon": "./assets/feather/list.svg",
action: () => {
app.selectedMediaItems = []
app.select_selectMediaItem(this.data.attributes.playParams.id ?? this.data.id, this.data.attributes.playParams.kind ?? this.data.type, 0, 0, this.data.attributes.playParams.isLibrary ?? false)
app.promptAddToPlaylist()
}
},
"share": {
name: app.getLz('term.share'),
icon: "./assets/feather/share.svg",
@ -521,23 +604,36 @@
},
}
}
app.showMenuPanel(menuItems, event)
if(artistId != null) {
if(app.followingArtist(artistId)){
if (artistId != null) {
if (app.followingArtist(artistId)) {
menuItems.items.follow.hidden = true
menuItems.items.unfollow.hidden = false
} else {
menuItems.items.follow.hidden = false
menuItems.items.unfollow.hidden = true
}
}else{
} else {
menuItems.items.follow.hidden = true
menuItems.items.unfollow.hidden = true
}
try {
let rating = await app.getRating(self.data)
if (rating == 0) {
menuItems.headerItems.find(x => x.id == 'love').disabled = false
menuItems.headerItems.find(x => x.id == 'dislike').disabled = false
} else if (rating == 1) {
menuItems.headerItems.find(x => x.id == 'unlove').hidden = false
menuItems.headerItems.find(x => x.id == 'love').hidden = true
} else if (rating == -1) {
menuItems.headerItems.find(x => x.id == 'undo_dislike').hidden = false
menuItems.headerItems.find(x => x.id == 'dislike').hidden = true
}
} catch (err) {
}
app.showMenuPanel(menuItems, event)
},
getItemParent: function (data) {
kind = data.attributes.playParams.kind;
@ -625,4 +721,4 @@
}
})
</script>
</script>

135
src/renderer/views/pages/playlist-inline.ejs
View file

@ -151,78 +151,85 @@
</div>
</div>
</div>
<div class="playlist-body">
<div class="well">
<div style="width:100%">
<draggable :sort="data.attributes.canEdit && data.type == 'library-playlists'"
v-model="data.relationships.tracks.data" @start="drag=true"
@end="drag=false;put()">
<template v-if="nestedPlaylist == [] || nestedPlaylist.length <= 1">
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in data.relationships.tracks.data"></mediaitem-list-item>
</template>
<template v-else>
<div v-for="disc in nestedPlaylist">
<div class="playlist-time">{{($root.getLz("term.discNumber") ?? "").replace("${discNumber}",disc.disc)}}</div>
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in disc.tracks"></mediaitem-list-item>
</div>
<div class="playlist-body scrollbody">
</template>
</draggable>
</div>
</div>
<div class="friends-info" v-if="itemBadges.length != 0">
<div class="well">
<div class="badge-container">
<div class="socialBadge"
:title="`${badge.attributes.name} - @${badge.attributes.handle}`"
v-for="badge in itemBadges">
<mediaitem-artwork
:url="badge.attributes.artwork.url"
:size="60"></mediaitem-artwork>
<b-tabs pills align="center" content-class="mt-3">
<b-tab title="Tracks">
<div class="">
<div style="width:100%">
<draggable :sort="data.attributes.canEdit && data.type == 'library-playlists'"
v-model="data.relationships.tracks.data" @start="drag=true" @end="drag=false;put()">
<template v-if="nestedPlaylist == [] || nestedPlaylist.length <= 1">
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in data.relationships.tracks.data"></mediaitem-list-item>
</template>
<template v-else>
<div v-for="disc in nestedPlaylist">
<div class="playlist-time">{{($root.getLz("term.discNumber") ?? "").replace("${discNumber}",disc.disc)}}</div>
<mediaitem-list-item :item="item" :parent="getItemParent(data)" :index="index"
:showIndex="true"
:showIndexPlaylist="(data.attributes.playParams.kind ?? data.type ?? '').includes('playlist')"
:context-ext="buildContextMenu()"
v-for="(item,index) in disc.tracks"></mediaitem-list-item>
</div>
</template>
</draggable>
</div>
</div>
<div class="friends-info" v-if="itemBadges.length != 0">
<div class="well">
<div class="badge-container">
<div class="socialBadge" :title="`${badge.attributes.name} - @${badge.attributes.handle}`"
v-for="badge in itemBadges">
<mediaitem-artwork
:url="badge.attributes.artwork.url"
:size="60"></mediaitem-artwork>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="playlist-time">
{{getFormattedDate()}}
</div>
<div class="playlist-time total">{{app.getTotalTime()}}</div>
<div class="playlist-time item-navigate" @click="app.searchAndNavigate(data,'recordLabel') "
style="width: 50%;">
{{data.attributes.copyright}}
</div>
<template
v-if="(data.attributes?.playParams?.kind ?? data.type ?? '').includes('album') && data.relationships.catalog != null && data.relationships.catalog != null && data.relationships.catalog.data.length > 0">
<div class="playlist-time showExtended item-navigate" style="color:#fa586a; font-weight: bold"
@click="app.routeView(data.relationships.catalog.data[0])">
{{$root.getLz("action.showAlbum")}}
</div>
</template>
<hr>
<template v-if="typeof data.meta != 'undefined'">
<div v-for="view in data.meta.views.order" v-if="data.views[view].data.length != 0">
<div class="row">
<div class="playlist-time">
{{getFormattedDate()}}
</div>
<div class="playlist-time total">{{app.getTotalTime()}}</div>
<div class="playlist-time item-navigate" @click="app.searchAndNavigate(data,'recordLabel') "
style="width: 50%;">
{{data.attributes.copyright}}
</div>
<template
v-if="(data.attributes?.playParams?.kind ?? data.type ?? '').includes('album') && data.relationships.catalog != null && data.relationships.catalog != null && data.relationships.catalog.data.length > 0">
<div class="playlist-time showExtended item-navigate" style="color:#fa586a; font-weight: bold"
@click="app.routeView(data.relationships.catalog.data[0])">
{{$root.getLz("action.showAlbum")}}
</div>
</template>
<hr>
</b-tab>
<template v-if="typeof data.views != 'undefined'">
<b-tab lazy :title="data.views[view].attributes.title" v-for="view in data.meta.views.order" v-if="data.views[view].data.length != 0">
<div>
<div class="row">
<div class="col">
<h3>{{ data.views[view].attributes.title }}</h3>
</div>
</div>
<div>
<mediaitem-scroller-horizontal
:items="data.views[view].data"></mediaitem-scroller-horizontal>
<div class="row">
<div class="col">
<mediaitem-scroller-horizontal
:items="data.views[view].data"></mediaitem-scroller-horizontal>
</div>
</div>
</div>
</template>
</div>
</b-tab>
</template>
</b-tabs>
</div>
</template>
</div>

10
src/renderer/views/pages/settings.ejs
View file

@ -981,7 +981,7 @@
{{$root.getLz('settings.option.experimental.inline_playlists')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="checkbox" v-model="app.cfg.advanced.experiments.includes('inline-playlists')" @click="app.cfg.advanced.experiments.includes('inline-playlists') ? removeExperiment('inline-playlists') : addExperiment('inline-playlists')" switch/>
<input type="checkbox" disabled v-model="app.cfg.advanced.experiments.includes('inline-playlists')" @click="app.cfg.advanced.experiments.includes('inline-playlists') ? removeExperiment('inline-playlists') : addExperiment('inline-playlists')" switch/>
</div>
</div>
@ -1044,8 +1044,8 @@
<div class="md-option-header">
<span>{{$root.getLz('settings.header.connect')}}</span>
</div>
<div class="settings-option-body">
<div class="md-option-line update-check">
<div class="settings-option-body-webview">
<div class="md-option-line update-check" v-if="app.cfg.connectUser == null">
<div class="md-option-segment">
{{$root.getLz('settings.option.connect.link_account')}}
<small>{{$root.getLz('settings.option.connect.link_account.description')}}</small>
@ -1058,9 +1058,11 @@
</button>
</div>
</div>
<div v-if="app.cfg.connectUser != null" style="display:inline-flex; width:100%;height: 100%">
<iframe :src="`https://connect.cidercollective.dev/setSession/` + encodeURI(JSON.stringify(app.cfg.connectUser))" sandbox="allow-scripts allow-top-navigation allow-same-origin" width="100%" height="100%" frameborder="0"></iframe>
</div>
</div>
</div>
</div>
</b-tab>
</b-tabs>
</div>