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

improved queue selection and removal

Browse source
This commit is contained in:
Core 2022-09-26 16:07:03 +01:00
parent 70bc06689a
commit 0155367748
No known key found for this signature in database
GPG key ID: 2AB8327FBA02D1C0
1 changed files with 19 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

43
src/renderer/views/components/queue.ejs
View file

@ -21,11 +21,12 @@
<div class="queue-body" v-if="page == 'queue'"> <div class="queue-body" v-if="page == 'queue'">
<draggable v-model="queueItems" @start="drag=true" @end="drag=false;move()"> <draggable v-model="queueItems" @start="drag=true" @end="drag=false;move()">
<template v-for="(queueItem, position) in displayQueueItems"> <template v-for="(queueItem, position) in displayQueueItems">
<div class="cd-queue-item" <div v-if="position === 0" :key="queueItem.item.id"></div>
:class="{selected: selectedItems.includes(position)}" <div class="cd-queue-item" v-else
@click="select($event, position)" :class="{selected: selectedItems.includes(queueItem.item.id)}"
@dblclick="playQueueItem(queueItem.item.id)" :key="position" @click="select($event, queueItem.item.id)"
@contextmenu="selected = position;queueContext($event, queueItem.item, position)"> @dblclick="playQueueItem(queueItem.item.id)" :key="queueItem.item.id"
@contextmenu="queueContext($event, queueItem.item)">
<div class="row"> <div class="row">
<div class="col-auto cider-flex-center"> <div class="col-auto cider-flex-center">
<div class="artwork"> <div class="artwork">
@ -47,7 +48,7 @@
</div> </div>
<div class="col queue-duration-info"> <div class="col queue-duration-info">
<div class="queue-duration cider-flex-center"> <div class="queue-duration cider-flex-center">
{{convertTimeToString(queueItem.item.attributes.durationInMillis)}} {{app.convertTime(queueItem.item.attributes.durationInMillis / 1000)}}
</div> </div>
</div> </div>
</div> </div>
@ -102,29 +103,26 @@
let history = await app.mk.api.v3.music(`/v1/me/recent/played/tracks`, { l: this.$root.mklang }) let history = await app.mk.api.v3.music(`/v1/me/recent/played/tracks`, { l: this.$root.mklang })
this.history = history.data.data this.history = history.data.data
}, },
select(e, position) { select(e, id) {
if (e.ctrlKey || e.shiftKey) { if (e.ctrlKey || e.shiftKey) {
if (this.selectedItems.indexOf(position) == -1) { if (this.selectedItems.indexOf(id) === -1) {
this.selectedItems.push(position) this.selectedItems.push(id)
} else { } else {
this.selectedItems.splice(this.selectedItems.indexOf(position), 1) this.selectedItems.splice(this.selectedItems.indexOf(id), 1)
} }
} else { } else {
this.selectedItems = [position] this.selectedItems = [id]
} }
}, },
queueContext(event, item, position) { queueContext(event, item) {
let self = this const self = this
let useMenu = "single" const useMenu = this.selectedItems.length > 1 ? "multiple" : "single"
if (this.selectedItems.length > 1) { const menus = {
useMenu = "multiple"
}
let menus = {
single: { single: {
items: [{ items: [{
"name": app.getLz('action.removeFromQueue'), "name": app.getLz('action.removeFromQueue'),
"action": function() { "action": function() {
self.queueItems.splice(position, 1) self.queueItems.splice(self.queueItems.findIndex(queueItem => queueItem.item.id === item.id), 1)
app.mk.queue._queueItems = self.queueItems; app.mk.queue._queueItems = self.queueItems;
app.mk.queue._reindex() app.mk.queue._reindex()
} }
@ -159,12 +157,13 @@
"action": function() { "action": function() {
// add property to items to be removed // add property to items to be removed
self.selectedItems.forEach(function(item) { self.selectedItems.forEach(function(item) {
self.queueItems[item].remove = true self.queueItems.find(x => x.item.id === item).remove = true;
}) })
// remove items // remove items
self.queueItems = self.queueItems.filter(function(item) { self.queueItems = self.queueItems.filter(function(item) {
return !item.remove return !item.remove
}) })
app.mk.queue._queueItems = self.queueItems;
app.mk.queue._reindex() app.mk.queue._reindex()
self.selectedItems = [] self.selectedItems = []
} }
@ -190,10 +189,6 @@
this.selected = -1 this.selected = -1
app.mk.queue._queueItems = this.queueItems; app.mk.queue._queueItems = this.queueItems;
app.mk.queue._reindex() app.mk.queue._reindex()
},
convertTimeToString(timeInMilliseconds) {
var seconds = ((timeInMilliseconds % 60000) / 1000).toFixed(0);
return Math.floor(timeInMilliseconds / 60000) + ":" + (seconds < 10 ? '0' : '') + seconds;
} }
} }
}); });