Various changes to userinfo footer, Discord now works, as does sign out, handling for deauth needs to be done
This commit is contained in:
Core
parent
85f2b36ef2
commit
2f07a48124
5 changed files with 212 additions and 147 deletions
BIN
resources/cider-ui-tests/assets/logocut.png
Normal file
BIN
resources/cider-ui-tests/assets/logocut.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -145,7 +145,14 @@ const app = new Vue({
|
|||
chrome: {
|
||||
hideUserInfo: false,
|
||||
artworkReady: false,
|
||||
userinfo: {},
|
||||
userinfo: {
|
||||
"id": "",
|
||||
"attributes": {
|
||||
"name": "Cider User",
|
||||
"handle": "CiderUser",
|
||||
"artwork": {"url": "http://localhost:9000/assets/logocut.png"}
|
||||
}
|
||||
},
|
||||
menuOpened: false,
|
||||
maximized: false,
|
||||
drawerOpened: false,
|
||||
|
|
@ -158,14 +165,20 @@ const app = new Vue({
|
|||
type: ""
|
||||
},
|
||||
currentSongInfo: {},
|
||||
page: "artist-page",
|
||||
page: "browse",
|
||||
pageHistory: [],
|
||||
songstest: false
|
||||
},
|
||||
watch: {
|
||||
page: () => {document.getElementById("app-content").scrollTo(0,0);},
|
||||
showingPlaylist: () => {document.getElementById("app-content").scrollTo(0,0);},
|
||||
artistPage: () => {document.getElementById("app-content").scrollTo(0,0);},
|
||||
page: () => {
|
||||
document.getElementById("app-content").scrollTo(0, 0);
|
||||
},
|
||||
showingPlaylist: () => {
|
||||
document.getElementById("app-content").scrollTo(0, 0);
|
||||
},
|
||||
artistPage: () => {
|
||||
document.getElementById("app-content").scrollTo(0, 0);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
async init() {
|
||||
|
|
@ -179,8 +192,16 @@ const app = new Vue({
|
|||
this.chrome.userinfo = await this.mkapi("personalSocialProfile", false, "")
|
||||
// API Fallback
|
||||
if (!this.chrome.userinfo) {
|
||||
this.chrome.userinfo = {"attributes": {"name": "Cider User", "handle": "CiderUser", "artwork": {"url": "../icons/icon.png"}}}
|
||||
this.chrome.userinfo = {
|
||||
"id": "",
|
||||
"attributes": {
|
||||
"name": "Cider User",
|
||||
"handle": "CiderUser",
|
||||
"artwork": {"url": "http://localhost:9000/assets/logocut.png"}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// load cached library
|
||||
if (localStorage.getItem("librarySongs") != null) {
|
||||
|
|
@ -265,7 +286,8 @@ const app = new Vue({
|
|||
this.currentSongInfo = a
|
||||
try {
|
||||
a = a.item.attributes;
|
||||
} catch(_){}
|
||||
} catch (_) {
|
||||
}
|
||||
|
||||
let type = (self.mk.nowPlayingItem != null) ? self.mk.nowPlayingItem["type"] ?? '' : '';
|
||||
|
||||
|
|
@ -294,7 +316,8 @@ const app = new Vue({
|
|||
silent: true
|
||||
})
|
||||
}
|
||||
} catch (_){}
|
||||
} catch (_) {
|
||||
}
|
||||
})
|
||||
|
||||
this.apiCall('https://api.music.apple.com/v1/me/library/playlists', res => {
|
||||
|
|
@ -353,13 +376,15 @@ const app = new Vue({
|
|||
await this.showCollection(responseFormat, title, "search")
|
||||
},
|
||||
async getPlaylistFromID(id) {
|
||||
const params = {include: "tracks",
|
||||
const params = {
|
||||
include: "tracks",
|
||||
platform: "web",
|
||||
"include[library-playlists]": "catalog,tracks",
|
||||
"fields[playlists]": "curatorName,playlistType,name,artwork,url",
|
||||
"include[library-songs]": "catalog,artists,albums",
|
||||
"fields[catalog]": "artistUrl,albumUrl",
|
||||
"fields[songs]": "artistUrl,albumUrl"}
|
||||
"fields[songs]": "artistUrl,albumUrl"
|
||||
}
|
||||
try {
|
||||
this.showingPlaylist = await app.mk.api.library.playlist(id, params)
|
||||
} catch (e) {
|
||||
|
|
@ -459,13 +484,18 @@ const app = new Vue({
|
|||
if (kind.toString().includes("artist")) {
|
||||
app.getArtistInfo(id, isLibrary)
|
||||
} else if (kind.toString().includes("record-label") || kind.toString().includes("curator")) {
|
||||
if (kind.toString().includes("record-label"))
|
||||
{kind = "recordLabel"}
|
||||
else {kind = "curator"}
|
||||
app.page = (kind) + "_" + (id);
|
||||
app.getTypeFromID((kind), (id), (isLibrary), {extend: "editorialVideo",include: 'grouping,playlists', views: 'top-releases,latest-releases,top-artists'});
|
||||
if (kind.toString().includes("record-label")) {
|
||||
kind = "recordLabel"
|
||||
} else {
|
||||
kind = "curator"
|
||||
}
|
||||
else if (!kind.toString().includes("radioStation") && !kind.toString().includes("song") && !kind.toString().includes("musicVideo") && !kind.toString().includes("uploadedVideo")) {
|
||||
app.page = (kind) + "_" + (id);
|
||||
app.getTypeFromID((kind), (id), (isLibrary), {
|
||||
extend: "editorialVideo",
|
||||
include: 'grouping,playlists',
|
||||
views: 'top-releases,latest-releases,top-artists'
|
||||
});
|
||||
} else if (!kind.toString().includes("radioStation") && !kind.toString().includes("song") && !kind.toString().includes("musicVideo") && !kind.toString().includes("uploadedVideo")) {
|
||||
app.page = (kind) + "_" + (id);
|
||||
app.getTypeFromID((kind), (id), (isLibrary), {extend: "editorialVideo"});
|
||||
} else {
|
||||
|
|
@ -485,24 +515,31 @@ const app = new Vue({
|
|||
let artistId = '';
|
||||
try {
|
||||
if (item.relationships.artists && item.relationships.artists.data.length > 0) {
|
||||
if (item.relationships.artists.data[0].type === "artist" || item.relationships.artists.data[0].type === "artists") { artistId = item.relationships.artists.data[0].id }
|
||||
if (item.relationships.artists.data[0].type === "artist" || item.relationships.artists.data[0].type === "artists") {
|
||||
artistId = item.relationships.artists.data[0].id
|
||||
}
|
||||
} else {
|
||||
const url = (item.relationships.catalog.data[0].attributes.artistUrl);
|
||||
artistId = (url).substring(url.lastIndexOf('/') + 1)
|
||||
if (artistId.includes('viewCollaboration')) { artistId = artistId.substring(artistId.lastIndexOf('ids=') + 4, artistId.lastIndexOf('-')) }
|
||||
if (artistId.includes('viewCollaboration')) {
|
||||
artistId = artistId.substring(artistId.lastIndexOf('ids=') + 4, artistId.lastIndexOf('-'))
|
||||
}
|
||||
}
|
||||
catch (_) { }
|
||||
} catch (_) {
|
||||
}
|
||||
|
||||
if (artistId == "") {
|
||||
let artistQuery = await app.mk.api.search(item.attributes.artistName, { limit: 1, types: 'artists' })
|
||||
let artistQuery = await app.mk.api.search(item.attributes.artistName, {
|
||||
limit: 1,
|
||||
types: 'artists'
|
||||
})
|
||||
try {
|
||||
if (artistQuery.artists.data.length > 0) {
|
||||
artistId = artistQuery.artists.data[0].id;
|
||||
console.log(artistId)
|
||||
}
|
||||
} catch (e) {
|
||||
}
|
||||
catch (e) {}
|
||||
}
|
||||
console.log(artistId);
|
||||
if (artistId != "")
|
||||
|
|
@ -512,45 +549,52 @@ const app = new Vue({
|
|||
let albumId = '';
|
||||
try {
|
||||
if (item.relationships.albums && item.relationships.albums.data.length > 0) {
|
||||
if (item.relationships.albums.data[0].type === "album" || item.relationships.albums.data[0].type === "albums") { albumId = item.relationships.albums.data[0].id }
|
||||
if (item.relationships.albums.data[0].type === "album" || item.relationships.albums.data[0].type === "albums") {
|
||||
albumId = item.relationships.albums.data[0].id
|
||||
}
|
||||
}
|
||||
catch (_) { }
|
||||
} catch (_) {
|
||||
}
|
||||
|
||||
if (albumId == "") {
|
||||
try {
|
||||
let albumQuery = await app.mk.api.search(item.attributes.albumName +" "+ (item.attributes.artistName ?? ""), { limit: 1, types: 'albums' })
|
||||
let albumQuery = await app.mk.api.search(item.attributes.albumName + " " + (item.attributes.artistName ?? ""), {
|
||||
limit: 1,
|
||||
types: 'albums'
|
||||
})
|
||||
if (albumQuery.albums.data.length > 0) {
|
||||
albumId = albumQuery.albums.data[0].id;
|
||||
console.log(albumId)
|
||||
}
|
||||
} catch (e) {
|
||||
}
|
||||
catch (e) {}
|
||||
}
|
||||
if (albumId != "")
|
||||
{
|
||||
if (albumId != "") {
|
||||
app.getTypeFromID("album", albumId, false);
|
||||
app.page = "album_" + albumId;}
|
||||
app.page = "album_" + albumId;
|
||||
}
|
||||
break;
|
||||
case "recordLabel":
|
||||
let labelId = '';
|
||||
try {
|
||||
labelId = item.relationships['record-labels'].data[0].id
|
||||
} catch (_) {
|
||||
}
|
||||
catch (_) { }
|
||||
|
||||
if (labelId == "") {
|
||||
try {
|
||||
let labelQuery = await app.mk.api.search(item.attributes.recordLabel, { limit: 1, types: 'record-labels' })
|
||||
let labelQuery = await app.mk.api.search(item.attributes.recordLabel, {
|
||||
limit: 1,
|
||||
types: 'record-labels'
|
||||
})
|
||||
if (labelQuery["record-labels"].data.length > 0) {
|
||||
labelId = labelQuery["record-labels"].data[0].id;
|
||||
console.log(labelId)
|
||||
}
|
||||
} catch (e) {
|
||||
}
|
||||
catch (e) {}
|
||||
}
|
||||
if (labelId != "")
|
||||
{
|
||||
if (labelId != "") {
|
||||
app.showingPlaylist = []
|
||||
|
||||
await app.getTypeFromID("recordLabel", labelId, false, {views: 'top-releases,latest-releases,top-artists'});
|
||||
|
|
@ -700,6 +744,7 @@ const app = new Vue({
|
|||
// make a copy of searchLibrarySongs except use Albums instead of Songs
|
||||
searchLibraryAlbums() {
|
||||
let self = this
|
||||
|
||||
function sortAlbums() {
|
||||
if (self.library.albums.sortOrder == "asc") {
|
||||
// sort this.library.albums.displayListing by album.attributes[self.library.albums.sorting] in ascending order based on alphabetical order and numeric order
|
||||
|
|
@ -750,6 +795,7 @@ const app = new Vue({
|
|||
})
|
||||
}
|
||||
}
|
||||
|
||||
if (this.library.albums.search == "") {
|
||||
this.library.albums.displayListing = this.library.albums.listing
|
||||
sortAlbums()
|
||||
|
|
@ -835,7 +881,8 @@ const app = new Vue({
|
|||
this.library.downloadNotification.message = "Updating library songs..."
|
||||
|
||||
function downloadChunk() {
|
||||
const params = {"include[library-songs]": "artists,albums",
|
||||
const params = {
|
||||
"include[library-songs]": "artists,albums",
|
||||
"fields[artists]": "name,url,id",
|
||||
"fields[albums]": "name,url,id",
|
||||
platform: "web",
|
||||
|
|
@ -953,6 +1000,7 @@ const app = new Vue({
|
|||
console.log(library)
|
||||
}
|
||||
}
|
||||
|
||||
downloadChunk()
|
||||
},
|
||||
getTotalTime() {
|
||||
|
|
@ -960,7 +1008,10 @@ const app = new Vue({
|
|||
if (app.showingPlaylist.relationships.tracks.data.length > 0) {
|
||||
time = Math.round([].concat(...app.showingPlaylist.relationships.tracks.data).reduce((a, {attributes: {durationInMillis}}) => a + durationInMillis, 0) / 60000);
|
||||
return app.showingPlaylist.relationships.tracks.data.length + " tracks, " + time + " mins.";
|
||||
} else return ""} catch(err){return ""}
|
||||
} else return ""
|
||||
} catch (err) {
|
||||
return ""
|
||||
}
|
||||
},
|
||||
async getLibrarySongs() {
|
||||
var response = await this.mkapi("songs", true, "", {limit: 100}, {includeResponseMeta: !0})
|
||||
|
|
@ -1515,10 +1566,13 @@ const app = new Vue({
|
|||
if (this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"]) {
|
||||
document.querySelector('.bg-artwork').style.src = this.mk["nowPlayingItem"]["attributes"]["artwork"]["url"].replace('{w}', size).replace('{h}', size);
|
||||
} else {
|
||||
this.setLibraryArtBG()}
|
||||
this.setLibraryArtBG()
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
this.setLibraryArtBG()}},200)
|
||||
this.setLibraryArtBG()
|
||||
}
|
||||
}, 200)
|
||||
},
|
||||
getNowPlayingArtwork(size = 600) {
|
||||
let interval = setInterval(() => {
|
||||
|
|
@ -1544,7 +1598,6 @@ const app = new Vue({
|
|||
}, 200)
|
||||
|
||||
|
||||
|
||||
},
|
||||
|
||||
async setLibraryArt() {
|
||||
|
|
@ -1565,7 +1618,8 @@ const app = new Vue({
|
|||
if (data != null && data !== "") {
|
||||
document.querySelector('.bg-artwork').src = (data["attributes"]["artwork"]["url"]).toString();
|
||||
}
|
||||
} catch (e) {}
|
||||
} catch (e) {
|
||||
}
|
||||
|
||||
},
|
||||
quickPlay(query) {
|
||||
|
|
|
|||
|
|
@ -697,8 +697,8 @@ input[type=range].web-slider::-webkit-slider-runnable-track {
|
|||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
height: 1.2em;
|
||||
line-height: 1.2em;
|
||||
/*height: 1.2em;
|
||||
line-height: 1.2em;*/
|
||||
overflow: hidden;
|
||||
/* animation: marquee 10s linear infinite; */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -185,13 +185,13 @@
|
|||
<button class="usermenu-item">
|
||||
About
|
||||
</button>
|
||||
<button class="usermenu-item">
|
||||
<button class="usermenu-item" @click="window.open('https://discord.gg/CezHYdXHEM')">
|
||||
Discord
|
||||
</button>
|
||||
<button class="usermenu-item">
|
||||
Settings
|
||||
</button>
|
||||
<button class="usermenu-item">
|
||||
<button class="usermenu-item" @click="mk.unauthorize()">
|
||||
Sign Out
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -204,14 +204,13 @@
|
|||
<button class="app-sidebar-button" style="width:100%"
|
||||
:class="{active: chrome.menuOpened}"
|
||||
@blur="chrome.menuOpened = false"
|
||||
@click="chrome.menuOpened = !chrome.menuOpened">
|
||||
<template v-if="chrome.userinfo.attributes">
|
||||
@click="(chrome.userinfo.id) ? chrome.menuOpened = !chrome.menuOpened : false">
|
||||
|
||||
<img class="sidebar-user-icon" loading="lazy"
|
||||
:src="getMediaItemArtwork(chrome.userinfo.attributes['artwork'] ? chrome.userinfo.attributes['artwork']['url'] : '', 26)"/>
|
||||
</template>
|
||||
:src="getMediaItemArtwork(chrome.hideUserInfo ? 'http://localhost:9000/assets/logocut.png' : (chrome.userinfo.attributes['artwork'] ? chrome.userinfo.attributes['artwork']['url'] : ''), 26)"/>
|
||||
|
||||
<div class="sidebar-user-text" v-if="!chrome.hideUserInfo">
|
||||
<template v-if="chrome.userinfo.attributes">
|
||||
<template v-if="chrome.userinfo.id">
|
||||
<div class="fullname text-overflow-elipsis">{{ chrome.userinfo.attributes.name }}
|
||||
</div>
|
||||
<div class="handle-text text-overflow-elipsis">@{{ chrome.userinfo.attributes.handle
|
||||
|
|
@ -219,7 +218,9 @@
|
|||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
Sign in
|
||||
<div @click="mk.authorize()">
|
||||
Sign In
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="sidebar-user-text" v-else>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
const {app, BrowserWindow, ipcMain, protocol} = require("electron")
|
||||
const {app, BrowserWindow, ipcMain, protocol, shell} = require("electron")
|
||||
const {join, resolve} = require("path")
|
||||
const getPort = require("get-port");
|
||||
const express = require("express");
|
||||
|
|
@ -52,6 +52,16 @@ const CiderBase = {
|
|||
win = new BrowserWindow(options)
|
||||
}
|
||||
|
||||
win.webContents.setWindowOpenHandler(({url}) => {
|
||||
if (url.includes("apple") || url.includes("localhost")) {
|
||||
return { action: "allow"}
|
||||
}
|
||||
shell.openExternal(url).catch(() => {})
|
||||
return {
|
||||
action: 'deny'
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
// intercept "https://js-cdn.music.apple.com/hls.js/2.141.0/hls.js/hls.js" and redirect to local file "./apple-hls.js" instead
|
||||
win.webContents.session.webRequest.onBeforeRequest(
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue