improvements to playlist folder sorting
This commit is contained in:
booploops
parent
b1f36c6e48
commit
c6eec7a3be
4 changed files with 174 additions and 108 deletions
6
src/renderer/bootbox.all.min.js
vendored
Normal file
6
src/renderer/bootbox.all.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -69,6 +69,18 @@ var CiderContextMenu = {
|
|||
}
|
||||
}
|
||||
|
||||
const MusicKitObjects = {
|
||||
LibraryPlaylist: function () {
|
||||
this.id = ""
|
||||
this.type = "library-playlist-folders"
|
||||
this.href = ""
|
||||
this.attributes = {
|
||||
dateAdded: "",
|
||||
name: ""
|
||||
}
|
||||
this.playlists = []
|
||||
}
|
||||
}
|
||||
|
||||
const MusicKitTools = {
|
||||
getHeader() {
|
||||
|
|
@ -86,24 +98,6 @@ Array.prototype.limit = function (n) {
|
|||
return this.slice(0, n);
|
||||
};
|
||||
|
||||
// function msToMinSec(ms) {
|
||||
// let minutes = Math.floor(ms / 60000);
|
||||
// let seconds = ((ms % 60000) / 1000).toFixed(0);
|
||||
// return minutes + ":" + (seconds < 10 ? '0' : '') + seconds;
|
||||
// }
|
||||
|
||||
class NavigationEvent {
|
||||
constructor(page, onnavigate, scrollPosition) {
|
||||
this.page = page;
|
||||
this.onnavigate = onnavigate;
|
||||
this.scrollPosition = scrollPosition;
|
||||
}
|
||||
|
||||
navigate() {
|
||||
this.onnavigate();
|
||||
document.querySelector("#app-content").scrollTop = this.scrollPosition;
|
||||
}
|
||||
}
|
||||
|
||||
const app = new Vue({
|
||||
el: "#app",
|
||||
|
|
@ -293,7 +287,8 @@ const app = new Vue({
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
getSocialBadges(cb = ()=>{}) {
|
||||
getSocialBadges(cb = () => {
|
||||
}) {
|
||||
let self = this
|
||||
try {
|
||||
app.mk.api.socialBadgingMap().then(data => {
|
||||
|
|
@ -438,7 +433,6 @@ const app = new Vue({
|
|||
}
|
||||
|
||||
|
||||
|
||||
// load last played track
|
||||
try {
|
||||
let lastItem = window.localStorage.getItem("currentTrack")
|
||||
|
|
@ -467,7 +461,8 @@ const app = new Vue({
|
|||
if (!(i == 0 && ids[0] == lastItem.attributes.playParams.id)) {
|
||||
try {
|
||||
app.mk.playLater({songs: [id]})
|
||||
} catch (err) { }
|
||||
} catch (err) {
|
||||
}
|
||||
}
|
||||
i++;
|
||||
}
|
||||
|
|
@ -482,7 +477,9 @@ const app = new Vue({
|
|||
|
||||
}
|
||||
|
||||
} catch (e) { console.log(e) }
|
||||
} catch (e) {
|
||||
console.log(e)
|
||||
}
|
||||
|
||||
MusicKit.getInstance().videoContainerElement = document.getElementById("apple-music-video-player")
|
||||
|
||||
|
|
@ -514,7 +511,8 @@ const app = new Vue({
|
|||
let previewURL = null
|
||||
try {
|
||||
previewURL = app.mk.nowPlayingItem.previewURL
|
||||
} catch (e) { }
|
||||
} catch (e) {
|
||||
}
|
||||
if (!previewURL) {
|
||||
app.mk.api.song(app.mk.nowPlayingItem._songId ?? app.mk.nowPlayingItem.relationships.catalog.data[0].id).then((response) => {
|
||||
previewURL = response.attributes.previews[0].url
|
||||
|
|
@ -526,7 +524,8 @@ const app = new Vue({
|
|||
ipcRenderer.send('getPreviewURL', previewURL)
|
||||
}
|
||||
|
||||
} catch (e) { }
|
||||
} catch (e) {
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
|
|
@ -623,11 +622,25 @@ const app = new Vue({
|
|||
})
|
||||
}
|
||||
},
|
||||
getPlaylistFolderChildren(id) {
|
||||
return this.playlists.listing.filter(playlist => {
|
||||
if (playlist.parent == id) {
|
||||
return playlist
|
||||
}
|
||||
})
|
||||
},
|
||||
async refreshPlaylists() {
|
||||
let self = this
|
||||
this.apiCall('https://api.music.apple.com/v1/me/library/playlist-folders/p.playlistsroot/children/', res => {
|
||||
self.playlists.listing = res.data
|
||||
self.playlists.listing.sort((a, b) => {
|
||||
self.playlists.listing.forEach(playlist => {
|
||||
playlist.parent = "p.playlistsroot"
|
||||
})
|
||||
self.sortPlaylists()
|
||||
})
|
||||
},
|
||||
sortPlaylists() {
|
||||
this.playlists.listing.sort((a, b) => {
|
||||
if (a.type === "library-playlist-folders" && b.type !== "library-playlist-folders") {
|
||||
return -1
|
||||
} else if (a.type !== "library-playlist-folders" && b.type === "library-playlist-folders") {
|
||||
|
|
@ -636,7 +649,6 @@ const app = new Vue({
|
|||
return 0
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
playlistHeaderContextMenu(event) {
|
||||
let menu = {
|
||||
|
|
@ -673,9 +685,17 @@ const app = new Vue({
|
|||
self.appRoute(`playlist_` + res.id);
|
||||
self.showingPlaylist = [];
|
||||
self.getPlaylistFromID(app.page.substring(9))
|
||||
self.playlists.listing.push({
|
||||
id: res.id,
|
||||
attributes: {
|
||||
name: name
|
||||
},
|
||||
parent: "p.playlistsroot"
|
||||
})
|
||||
self.sortPlaylists()
|
||||
setTimeout(() => {
|
||||
app.refreshPlaylists()
|
||||
}, 3000)
|
||||
}, 8000)
|
||||
})
|
||||
},
|
||||
deletePlaylist(id) {
|
||||
|
|
@ -1075,10 +1095,6 @@ const app = new Vue({
|
|||
break;
|
||||
}
|
||||
},
|
||||
pushNavigationEvent(item) {
|
||||
let self = this
|
||||
|
||||
},
|
||||
exitMV() {
|
||||
MusicKit.getInstance().stop()
|
||||
document.getElementById("apple-music-video-container").style.display = "none";
|
||||
|
|
@ -1118,8 +1134,7 @@ const app = new Vue({
|
|||
} finally {
|
||||
if (kind == "appleCurator") {
|
||||
app.appleCurator = a
|
||||
}
|
||||
else {
|
||||
} else {
|
||||
this.getPlaylistContinuous(a)
|
||||
}
|
||||
}
|
||||
|
|
@ -1735,7 +1750,9 @@ const app = new Vue({
|
|||
} else {
|
||||
if (app.cfg.lyrics.enable_mxm) {
|
||||
this.loadMXM();
|
||||
} else { this.loadAMLyrics(); }
|
||||
} else {
|
||||
this.loadAMLyrics();
|
||||
}
|
||||
}
|
||||
},
|
||||
loadAMLyrics() {
|
||||
|
|
@ -1771,8 +1788,12 @@ const app = new Vue({
|
|||
let ytid = result[0]['id']['videoId'];
|
||||
if (app.cfg.lyrics.enable_yt) {
|
||||
loadYT(ytid, app.cfg.lyrics.mxm_language ?? "en")
|
||||
} else { app.loadMXM() }
|
||||
} else { app.loadMXM() }
|
||||
} else {
|
||||
app.loadMXM()
|
||||
}
|
||||
} else {
|
||||
app.loadMXM()
|
||||
}
|
||||
|
||||
function loadYT(id, lang) {
|
||||
let req = new XMLHttpRequest();
|
||||
|
|
@ -2168,7 +2189,9 @@ const app = new Vue({
|
|||
app.mk.changeToMediaAtIndex(app.mk.queue._itemIDs.indexOf(item.id) ?? 1)
|
||||
app.mk.play()
|
||||
})
|
||||
} else { app.mk.play() }
|
||||
} else {
|
||||
app.mk.play()
|
||||
}
|
||||
})
|
||||
} else {
|
||||
try {
|
||||
|
|
@ -2186,7 +2209,9 @@ const app = new Vue({
|
|||
app.mk.changeToMediaAtIndex(app.mk.queue._itemIDs.indexOf(item.id) ?? 1)
|
||||
app.mk.play()
|
||||
})
|
||||
} else { app.mk.play() }
|
||||
} else {
|
||||
app.mk.play()
|
||||
}
|
||||
})
|
||||
}
|
||||
} catch (err) {
|
||||
|
|
@ -2318,7 +2343,9 @@ const app = new Vue({
|
|||
getMediaItemArtwork(url, height = 64, width) {
|
||||
let newurl = `${url.replace('{w}', width ?? height).replace('{h}', height).replace('{f}', "webp").replace('{c}', ((width === 900) ? "sr" : "cc"))}`;
|
||||
|
||||
if (newurl.includes("900x516")) { newurl = newurl.replace("900x516cc", "900x516sr").replace("900x516bb", "900x516sr"); }
|
||||
if (newurl.includes("900x516")) {
|
||||
newurl = newurl.replace("900x516cc", "900x516sr").replace("900x516bb", "900x516sr");
|
||||
}
|
||||
return newurl
|
||||
},
|
||||
getNowPlayingArtworkBG(size = 600) {
|
||||
|
|
@ -2656,6 +2683,7 @@ document.addEventListener('musickitloaded', function () {
|
|||
app.init()
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
request.addEventListener("load", loadAlternateKey);
|
||||
request.open("GET", "https://raw.githubusercontent.com/lujjjh/LitoMusic/main/token.json");
|
||||
request.send();
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script type="text/x-template" id="sidebar-playlist">
|
||||
<div class="sidebar-playlist">
|
||||
<div class="sidebar-playlist" :key="item.id">
|
||||
<button class="app-sidebar-item app-sidebar-item-playlist" :key="item.id" v-if="item.type != 'library-playlist-folders'"
|
||||
:class="{'active': $root.page.includes(item.id)}"
|
||||
@contextmenu="playlistContextMenu($event, item.id)"
|
||||
|
|
@ -50,9 +50,18 @@
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
move(item, sendTo) {
|
||||
async getChildren() {
|
||||
let self = this
|
||||
console.log(item, sendTo)
|
||||
this.children = []
|
||||
this.children = this.$root.playlists.listing.filter(child => {
|
||||
if(child.parent == self.item.id) {
|
||||
return child
|
||||
}
|
||||
})
|
||||
},
|
||||
async move(item, sendTo) {
|
||||
let self = this
|
||||
console.log(sendTo)
|
||||
let type = item.type.replace("library-", "")
|
||||
let typeTo = sendTo.type
|
||||
this.$root.mk.api.v3.music(`/v1/me/library/${type}/${item.id}/parent`, {}, {
|
||||
|
|
@ -67,10 +76,21 @@
|
|||
}
|
||||
})
|
||||
|
||||
// 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) {
|
||||
console.log(playlist)
|
||||
playlist.parent = sendTo.id
|
||||
|
||||
setTimeout(()=>{
|
||||
this.$root.refreshPlaylists()
|
||||
}, 3000)
|
||||
}
|
||||
})
|
||||
if(typeof this.$parent.getChildren == "function") {
|
||||
this.$parent.getChildren()
|
||||
console.log(this.$parent.children)
|
||||
}
|
||||
await this.getChildren()
|
||||
this.$root.sortPlaylists()
|
||||
// await this.$root.refreshPlaylists()
|
||||
},
|
||||
playlistContextMenu(event, playlist_id) {
|
||||
let menu = {
|
||||
|
|
@ -78,10 +98,12 @@
|
|||
"moveToParent": {
|
||||
name: "Move to top",
|
||||
action: () => {
|
||||
let self = this
|
||||
this.move(this.item, {
|
||||
id: this.playlistRoot,
|
||||
type: "library-playlist-folders"
|
||||
})
|
||||
setTimeout(()=>{self.getChildren()}, 2000)
|
||||
}
|
||||
},
|
||||
"deleteFromPlaylist": {
|
||||
|
|
@ -130,10 +152,18 @@
|
|||
},
|
||||
getPlaylistChildren(item) {
|
||||
let self = this
|
||||
this.children = []
|
||||
this.getChildren()
|
||||
this.toggleFolder()
|
||||
this.$root.mk.api.library.playlistFolderChildren(item.id).then(children => {
|
||||
self.children = children
|
||||
self.children.sort((a, b) => {
|
||||
children.forEach(child => {
|
||||
if(!self.$root.playlists.listing.find(listing => listing.id == child.id)) {
|
||||
child.parent = self.item.id
|
||||
self.$root.playlists.listing.push(child)
|
||||
}
|
||||
})
|
||||
|
||||
self.$root.playlists.listing.sort((a, b) => {
|
||||
if (a.type === 'library-playlist-folders' && b.type !== 'library-playlist-folders') {
|
||||
return -1
|
||||
} else if (a.type !== 'library-playlist-folders' && b.type === 'library-playlist-folders') {
|
||||
|
|
@ -142,6 +172,7 @@
|
|||
return 0
|
||||
}
|
||||
})
|
||||
self.getChildren()
|
||||
})
|
||||
},
|
||||
isPlaylistSelected(item) {
|
||||
|
|
|
|||
|
|
@ -23,6 +23,7 @@
|
|||
<script src="sortable.min.js"></script>
|
||||
<script src="vuedraggable.umd.min.js"></script>
|
||||
<link rel="manifest" href="./manifest.json?v=2">
|
||||
<script src="bootbox.all.js"></script>
|
||||
<script src="https://js-cdn.music.apple.com/hls.js/2.141.0/hls.js/hls.js"></script>
|
||||
<script src="hlscider.js"></script>
|
||||
</head>
|
||||
|
|
@ -183,7 +184,7 @@
|
|||
<div class="app-sidebar-header-text" @contextmenu="playlistHeaderContextMenu">
|
||||
Playlists
|
||||
</div>
|
||||
<sidebar-playlist v-for="item in playlists.listing" :item="item"></sidebar-playlist>
|
||||
<sidebar-playlist v-for="item in getPlaylistFolderChildren('p.playlistsroot')" :item="item"></sidebar-playlist>
|
||||
</div>
|
||||
<transition name="wpfade">
|
||||
<div class="usermenu-container" v-if="chrome.menuOpened">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue