added guid's to list items for selection
This commit is contained in:
parent
7fa3fca084
commit
3ad4665ee2
2 changed files with 42 additions and 24 deletions
|
@ -424,18 +424,22 @@ const app = new Vue({
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
select_hasMediaItem(id) {
|
select_hasMediaItem(id) {
|
||||||
let found = this.selectedMediaItems.find(item => item.id == id)
|
let found = this.selectedMediaItems.find(item => item.guid == id)
|
||||||
if(found) {
|
if(found) {
|
||||||
return true
|
return true
|
||||||
}else{
|
}else{
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
select_selectMediaItem(id, kind) {
|
select_selectMediaItem(id, kind, index, guid) {
|
||||||
|
if(!this.select_hasMediaItem(guid)) {
|
||||||
this.selectedMediaItems.push({
|
this.selectedMediaItems.push({
|
||||||
id: id,
|
id: id,
|
||||||
kind: kind
|
kind: kind,
|
||||||
|
index: index,
|
||||||
|
guid: guid
|
||||||
})
|
})
|
||||||
|
}
|
||||||
},
|
},
|
||||||
async showCollection(response, title, type) {
|
async showCollection(response, title, type) {
|
||||||
let self = this
|
let self = this
|
||||||
|
@ -1857,6 +1861,12 @@ document.addEventListener('musickitloaded', function () {
|
||||||
request.send();
|
request.send();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function uuidv4() {
|
||||||
|
return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
|
||||||
|
(c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
function refreshFocus() {
|
function refreshFocus() {
|
||||||
if (document.hasFocus() == false) {
|
if (document.hasFocus() == false) {
|
||||||
app.windowFocus(false)
|
app.windowFocus(false)
|
||||||
|
|
|
@ -6,9 +6,9 @@
|
||||||
:data-id="item.attributes.playParams.id ?? item.id"
|
:data-id="item.attributes.playParams.id ?? item.id"
|
||||||
:data-type="item.attributes.playParams.kind ?? item.type"
|
:data-type="item.attributes.playParams.kind ?? item.type"
|
||||||
:data-index="index"
|
:data-index="index"
|
||||||
:data-selectorder="selectedOrder"
|
:data-guid="guid"
|
||||||
class="cd-mediaitem-list-item"
|
class="cd-mediaitem-list-item"
|
||||||
:class="{'mediaitem-selected': app.select_hasMediaItem(item.attributes.playParams.id ?? item.id)}">
|
:class="{'mediaitem-selected': app.select_hasMediaItem(guid)}">
|
||||||
<template v-if="isVisible">
|
<template v-if="isVisible">
|
||||||
<div class="isLibrary" v-if="showLibraryStatus == true">
|
<div class="isLibrary" v-if="showLibraryStatus == true">
|
||||||
<button @click="addToLibrary()"
|
<button @click="addToLibrary()"
|
||||||
|
@ -70,8 +70,7 @@
|
||||||
return {
|
return {
|
||||||
isVisible: false,
|
isVisible: false,
|
||||||
addedToLibrary: false,
|
addedToLibrary: false,
|
||||||
selected: false,
|
guid: uuidv4()
|
||||||
selectedOrder: -1
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
|
@ -84,38 +83,44 @@
|
||||||
'show-duration': {type: Boolean, default: true},
|
'show-duration': {type: Boolean, default: true},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
deselect() {
|
|
||||||
this.selected = false;
|
|
||||||
this.selectedOrder = -1;
|
|
||||||
},
|
|
||||||
select(e) {
|
select(e) {
|
||||||
if (e.shiftKey) {
|
if (e.shiftKey) {
|
||||||
if (app.select_hasMediaItem(this.item.attributes.playParams.id ?? this.item.id)) {
|
if(this.index != -1) {
|
||||||
app.select_removeMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type)
|
let allMediaItems = document.querySelectorAll(".cd-mediaitem-list-item[data-index]")
|
||||||
|
// select everything between the last selected item from app.selectedMediaItems and this one
|
||||||
|
|
||||||
|
for (let i = start; i <= end; i++) {
|
||||||
|
let mediaItem = allMediaItems[i];
|
||||||
|
app.select_selectMediaItem(mediaItem.getAttribute("data-id"), mediaItem.getAttribute("data-type"));
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
if (app.select_hasMediaItem(this.guid)) {
|
||||||
|
app.select_removeMediaItem(this.guid)
|
||||||
} else {
|
} else {
|
||||||
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type)
|
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type, this.index, this.guid)
|
||||||
}
|
}
|
||||||
} else if (e.ctrlKey) {
|
} else if (e.ctrlKey) {
|
||||||
if (app.select_hasMediaItem(this.item.attributes.playParams.id ?? this.item.id)) {
|
if (app.select_hasMediaItem(this.guid)) {
|
||||||
app.select_removeMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type)
|
app.select_removeMediaItem(this.guid)
|
||||||
} else {
|
} else {
|
||||||
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type)
|
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type, this.index, this.guid)
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
if (app.select_hasMediaItem(this.item.attributes.playParams.id ?? this.item.id)) {
|
if (app.select_hasMediaItem(this.guid)) {
|
||||||
app.selectedMediaItems = []
|
app.selectedMediaItems = []
|
||||||
} else {
|
} else {
|
||||||
app.selectedMediaItems = []
|
app.selectedMediaItems = []
|
||||||
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type)
|
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type, this.index, this.guid)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
contextMenu(event) {
|
contextMenu(event) {
|
||||||
let self = this
|
let self = this
|
||||||
let useMenu = "normal"
|
let useMenu = "normal"
|
||||||
if (!app.select_hasMediaItem(this.item.attributes.playParams.id ?? this.item.id)) {
|
if (!app.select_hasMediaItem(this.guid)) {
|
||||||
app.selectedMediaItems = []
|
app.selectedMediaItems = []
|
||||||
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type)
|
app.select_selectMediaItem(this.item.attributes.playParams.id ?? this.item.id, this.item.attributes.playParams.kind ?? this.item.type, this.index, this.guid)
|
||||||
} else {
|
} else {
|
||||||
useMenu = "multiple"
|
useMenu = "multiple"
|
||||||
}
|
}
|
||||||
|
@ -172,6 +177,7 @@
|
||||||
"action": function () {
|
"action": function () {
|
||||||
app.mk.setStationQueue({song: self.item.attributes.playParams.id ?? self.item.id}).then(() => {
|
app.mk.setStationQueue({song: self.item.attributes.playParams.id ?? self.item.id}).then(() => {
|
||||||
app.mk.play()
|
app.mk.play()
|
||||||
|
app.selectedMediaItems = []
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -180,6 +186,7 @@
|
||||||
"action": function () {
|
"action": function () {
|
||||||
app.mk.playNext({[self.item.attributes.playParams.kind ?? self.item.type]: self.item.attributes.playParams.id ?? self.item.id})
|
app.mk.playNext({[self.item.attributes.playParams.kind ?? self.item.type]: self.item.attributes.playParams.id ?? self.item.id})
|
||||||
app.mk.queue._reindex()
|
app.mk.queue._reindex()
|
||||||
|
app.selectedMediaItems = []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
@ -187,6 +194,7 @@
|
||||||
"action": function () {
|
"action": function () {
|
||||||
app.mk.playLater({[self.item.attributes.playParams.kind ?? self.item.type]: self.item.attributes.playParams.id ?? self.item.id})
|
app.mk.playLater({[self.item.attributes.playParams.kind ?? self.item.type]: self.item.attributes.playParams.id ?? self.item.id})
|
||||||
app.mk.queue._reindex()
|
app.mk.queue._reindex()
|
||||||
|
app.selectedMediaItems = []
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue