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

Fixed fullscreen queue

Browse source
This commit is contained in:
Core 2022-09-26 22:41:05 +01:00
parent 0459851b19
commit 5921b98619
No known key found for this signature in database
GPG key ID: 2AB8327FBA02D1C0
4 changed files with 24 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/preload/cider-preload.js
View file

@ -41,6 +41,12 @@ const MusicKitInterop = {
/* MusicKit.Events.nowPlayingItemDidChange */ /* MusicKit.Events.nowPlayingItemDidChange */
MusicKit.getInstance().addEventListener(MusicKit.Events.nowPlayingItemDidChange, async () => { MusicKit.getInstance().addEventListener(MusicKit.Events.nowPlayingItemDidChange, async () => {
if (window?.localStorage) {
window.localStorage.setItem("currentTrack", JSON.stringify(MusicKit.getInstance().nowPlayingItem));
window.localStorage.setItem("currentTime", JSON.stringify(MusicKit.getInstance().currentPlaybackTime));
window.localStorage.setItem("currentQueue", JSON.stringify(MusicKit.getInstance().queue?._unplayedQueueItems));
}
const attributes = MusicKitInterop.getAttributes(); const attributes = MusicKitInterop.getAttributes();
if (!attributes) return; if (!attributes) return;
attributes.primaryArtist = app.cfg.connectivity.lastfm.remove_featured ? await this.fetchSongRelationships() : attributes.artistName; attributes.primaryArtist = app.cfg.connectivity.lastfm.remove_featured ? await this.fetchSongRelationships() : attributes.artistName;

14
src/renderer/main/vueapp.js
View file

@ -1059,9 +1059,14 @@ const app = new Vue({
}); });
this.mk.addEventListener(MusicKit.Events.queueItemsDidChange, () => { this.mk.addEventListener(MusicKit.Events.queueItemsDidChange, () => {
if (self.$refs.queue) { if (self.$refs.queue || self.$refs.fsView?.$refs?.queue) {
setTimeout(() => { setTimeout(() => {
self.$refs.queue.updateQueue(); if (self.$refs.fsView?.$refs?.queue) {
self.$refs.fsView?.$refs?.queue.updateQueue();
}
if (self.$refs?.queue) {
self.$refs.queue.updateQueue();
}
}, 100); }, 100);
} }
}); });
@ -1083,7 +1088,10 @@ const app = new Vue({
}); });
this.mk.addEventListener(MusicKit.Events.nowPlayingItemDidChange, (a) => { this.mk.addEventListener(MusicKit.Events.nowPlayingItemDidChange, (a) => {
if (self.$refs.queue) { if (self.$refs.fsView?.$refs?.queue) {
self.$refs.fsView?.$refs?.queue.updateQueue();
}
if (self.$refs?.queue) {
self.$refs.queue.updateQueue(); self.$refs.queue.updateQueue();
} }
this.currentSongInfo = a; this.currentSongInfo = a;

24
src/renderer/views/components/fullscreen.ejs
View file

@ -47,18 +47,16 @@
:url="(image ?? '').replace('{w}','600').replace('{h}','600')" :url="(image ?? '').replace('{w}','600').replace('{h}','600')"
></mediaitem-artwork> ></mediaitem-artwork>
</div> </div>
<div class="controls-parents"> <div class="controls-parents" v-if="app.mkReady()">
<template v-if="app.mkReady()">
<div class="app-playback-controls" @mouseover="app.chrome.progresshover = true" <div class="app-playback-controls" @mouseover="app.chrome.progresshover = true"
@mouseleave="app.chrome.progresshover = false" @contextmenu="app.nowPlayingContextMenu"> @mouseleave="app.chrome.progresshover = false" @contextmenu="app.nowPlayingContextMenu">
<div class="playback-info"> <div class="playback-info">
<div class="song-name"> <div class="song-name">
{{ app.mk.nowPlayingItem["attributes"]["name"] }} {{ app.mk.nowPlayingItem["attributes"]["name"] }}
</div> </div>
<div <div style="display: inline-block; -webkit-box-orient: horizontal; white-space: nowrap; margin-top: 0.25vh; overflow: hidden;">
style="display: inline-block; -webkit-box-orient: horizontal; white-space: nowrap; margin-top: 0.25vh; overflow: hidden;">
<div class="item-navigate song-artist" style="display: inline-block;" <div class="item-navigate song-artist" style="display: inline-block;"
@click="app.getNowPlayingItemDetailed(`artist`) && app.fullscreen(false)"> @click="app.getNowPlasssyingItemDetailed(`artist`) && app.fullscreen(false)">
{{ app.mk.nowPlayingItem["attributes"]["artistName"] }} {{ app.mk.nowPlayingItem["attributes"]["artistName"] }}
</div> </div>
<div class="song-artist" style="display: inline-block;"> <div class="song-artist" style="display: inline-block;">
@ -70,14 +68,12 @@
(app.mk.nowPlayingItem["attributes"]["albumName"]) : "" }} (app.mk.nowPlayingItem["attributes"]["albumName"]) : "" }}
</div> </div>
</div> </div>
<div class="song-progress"> <div class="song-progress">
<div class="song-duration" style="justify-content: space-between; height: 1px;" <div class="song-duration" style="justify-content: space-between; height: 1px;"
:style="[app.chrome.progresshover ? {'display': 'flex'} : {'display' : 'none'} ]"> :style="[app.chrome.progresshover ? {'display': 'flex'} : {'display' : 'none'} ]">
<p style="width: auto">{{ app.convertTime(app.getSongProgress()) }}</p> <p style="width: auto">{{ app.convertTime(app.getSongProgress()) }}</p>
<p style="width: auto">{{ app.convertTime(app.mk.currentPlaybackDuration) }}</p> <p style="width: auto">{{ app.convertTime(app.mk.currentPlaybackDuration) }}</p>
</div> </div>
<input type="range" step="0.01" min="0" :style="app.progressBarStyle()" <input type="range" step="0.01" min="0" :style="app.progressBarStyle()"
@input="app.playerLCD.desiredDuration = $event.target.value;app.playerLCD.userInteraction = true" @input="app.playerLCD.desiredDuration = $event.target.value;app.playerLCD.userInteraction = true"
@mouseup="app.mk.seekToTime($event.target.value);app.playerLCD.desiredDuration = 0;app.playerLCD.userInteraction = false" @mouseup="app.mk.seekToTime($event.target.value);app.playerLCD.desiredDuration = 0;app.playerLCD.userInteraction = false"
@ -148,20 +144,14 @@
</div> </div>
</div> </div>
</div> </div>
</template>
</div> </div>
<div class="col right-col" v-if="tabMode != ''"> <div class="col right-col" v-if="tabMode !== ''">
<!-- <div class="fs-info">
<div>Name</div>
<div>Name</div>
<div>Name</div>
</div> -->
<div class="lyrics-col" v-if="tabMode == 'lyrics'"> <div class="lyrics-col" v-if="tabMode == 'lyrics'">
<lyrics-view :yoffset="120" :time="time" :lyrics="lyrics" <lyrics-view :yoffset="120" :time="time" :lyrics="lyrics"
:richlyrics="richlyrics"></lyrics-view> :richlyrics="richlyrics"></lyrics-view>
</div> </div>
<div class="queue-col" v-if="tabMode == 'queue'"> <div class="queue-col" v-else>
<cider-queue v-if="tabMode == 'queue'" ref="queue"></cider-queue> <cider-queue ref="queue"></cider-queue>
</div> </div>
</div> </div>
</div> </div>
@ -178,8 +168,6 @@
@click="tabMode = (tabMode == 'catalog') ? '' :'catalog'"></div> @click="tabMode = (tabMode == 'catalog') ? '' :'catalog'"></div>
</div> </div>
</div> </div>
</script> </script>
<script> <script>

2
src/renderer/views/main.ejs
View file

@ -97,7 +97,7 @@
</transition> </transition>
<transition name="fsModeSwitch"> <transition name="fsModeSwitch">
<div class="fullscreen-view-container" v-if="appMode == 'fullscreen'"> <div class="fullscreen-view-container" v-if="appMode == 'fullscreen'">
<fullscreen-view :image="currentArtUrlRaw" :time="mk.currentPlaybackTime - lyricOffset" :lyrics="lyrics" <fullscreen-view ref="fsView" :image="currentArtUrlRaw" :time="mk.currentPlaybackTime - lyricOffset" :lyrics="lyrics"
:richlyrics="richlyrics"></fullscreen-view> :richlyrics="richlyrics"></fullscreen-view>
</div> </div>
</transition> </transition>