exttex
/
freezerpc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Bug fixes, better lyrics, sorting

This commit is contained in:
exttex 2020-09-28 18:17:23 +02:00
parent 83860ff052
commit 80f6cbf870
14 changed files with 186 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
app/assets/pause.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 370 B

BIN
app/assets/play.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 552 B

BIN
app/assets/skip-next.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 479 B

BIN
app/assets/skip-previous.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 524 B

55
app/background.js
View File

@ -7,6 +7,7 @@ let tray;
let settings;
let shouldExit = false;
let playing = false;
//Get path to asset
function assetPath(a) {
@ -74,26 +75,38 @@ async function createWindow() {
return false;
});
//Thumbnail Toolbars
setThumbarButtons();
}
//Create window
app.on('ready', async () => {
createWindow();
//Create tray
//Create Tray
tray = new Tray(assetPath("icon-taskbar.png"));
tray.on('double-click', () => win.show());
tray.on('click', () => win.show());
//Tray menu
setTray();
});
//Update tray context menu
function setTray() {
const contextMenu = Menu.buildFromTemplate([
{
label: 'Restore',
type: 'normal',
click: () => win.show()
},
playing ?
{
label: 'Play/Pause',
label: 'Pause',
type: 'normal',
click: () => win.webContents.send('togglePlayback')
}
: {
label: 'Play',
type: 'normal',
click: () => win.webContents.send('togglePlayback')
},
@ -117,6 +130,42 @@ app.on('ready', async () => {
}
]);
tray.setContextMenu(contextMenu);
}
//Update Thumbnail Toolbars (Windows)
function setThumbarButtons() {
win.setThumbarButtons([
{
tooltip: 'Skip Previous',
icon: assetPath('skip-previous.png'),
click: () => win.webContents.send('skipPrev')
},
//Play/Pause
playing ?
{
tooltip: 'Pause',
icon: assetPath('pause.png'),
click: () => win.webContents.send('togglePlayback')
} :
{
tooltip: 'Play',
icon: assetPath('play.png'),
click: () => win.webContents.send('togglePlayback')
},
//Skip next
{
tooltip: 'Skip Next',
icon: assetPath('skip-next.png'),
click: () => win.webContents.send('skipNext')
},
]);
}
//Playing state change from UI
ipcMain.on('playing', (event, args) => {
playing = args;
setThumbarButtons();
setTray();
});
//Update settings from ui

7
app/client/src/App.vue
View File

@ -371,8 +371,8 @@ export default {
});
// /search
document.addEventListener('keypress', (event) => {
if (event.keyCode != 47) return;
document.addEventListener('keypress', (e) => {
if (e.keyCode != 47) return;
this.$refs.searchBar.focus();
setTimeout(() => {
if (this.searchQuery.startsWith('/')) this.searchQuery = this.searchQuery.substring(1);
@ -394,6 +394,9 @@ export default {
if (this.$root.audio) this.$root.audio.volume = this.volume;
this.$root.volume = this.volume;
},
'$root.volume'() {
this.volume = this.$root.volume;
},
//Update position
'$root.position'() {
this.position = (this.$root.position / this.$root.duration()) * 100;

88
app/client/src/components/LibraryTracks.vue
View File

@ -1,19 +1,35 @@
<template>
<v-list :height='height' class='overflow-y-auto' v-scroll.self='scroll'>
<v-lazy
v-for='(track, index) in tracks'
:key='index + "t" + track.id'
max-height="100"
><TrackTile :track='track' @click='play(index)' @remove='removedTrack(index)'>
</TrackTile>
</v-lazy>
<div class='text-center' v-if='loading'>
<v-progress-circular indeterminate></v-progress-circular>
<div v-scroll.self='scroll'>
<div class='px-4 pt-2 d-flex' style='max-height: 50px;'>
<div class='text-overline px-2 pt-1'>
{{count}} TRACKS.
</div>
<div style="max-width: 200px;" class='d-flex mx-2'>
<v-select class='px-2' dense solo :items='sortTypes' @change='sort' label='Sort By'>
</v-select>
</div>
<div class='px-2' @click='reverseSort'>
<v-btn icon>
<v-icon v-if='isReversed'>mdi-sort-reverse-variant</v-icon>
<v-icon v-if='!isReversed'>mdi-sort-variant</v-icon>
</v-btn>
</div>
</div>
<v-list :height='height' class='overflow-y-auto'>
<v-lazy
v-for='(track, index) in tracks'
:key='index + "t" + track.id'
max-height="100"
><TrackTile :track='track' @click='play(index)' @remove='removedTrack(index)'>
</TrackTile>
</v-lazy>
</v-list>
<div class='text-center' v-if='loading'>
<v-progress-circular indeterminate></v-progress-circular>
</div>
</v-list>
</div>
</template>
<script>
@ -28,7 +44,15 @@ export default {
return {
loading: false,
tracks: [],
count: 0
count: 0,
sortTypes: [
'Date Added',
'Name (A-Z)',
'Artist (A-Z)',
'Album (A-Z)'
],
tracksUnsorted: null,
isReversed: false
}
},
props: {
@ -88,8 +112,44 @@ export default {
this.$root.replaceQueue(this.tracks);
});
}
},
//Sort changed
async sort(type) {
let index = this.sortTypes.indexOf(type);
//Preload all tracks
if (this.tracks.length < this.count)
await this.loadAll();
//Copy original
if (!this.tracksUnsorted)
this.tracksUnsorted = JSON.parse(JSON.stringify(this.tracks));
//Using indexes, so it can be translated later
this.isReversed = false;
switch (index) {
//Default
case 0:
this.tracks = JSON.parse(JSON.stringify(this.tracksUnsorted));
break;
//Name
case 1:
this.tracks = this.tracks.sort((a, b) => {return a.title.localeCompare(b.title);});
break;
//Artist
case 2:
this.tracks = this.tracks.sort((a, b) => {return a.artistString.localeCompare(b.artistString);});
break;
//Album
case 3:
this.tracks = this.tracks.sort((a, b) => {return a.album.title.localeCompare(b.album.title);});
break;
}
},
async reverseSort() {
//Preload tracks if not sorted yet
if (this.tracks.length < this.count)
await this.sort(0);
this.isReversed = !this.isReversed;
this.tracks.reverse();
},
removedTrack(index) {
this.tracks.splice(index, 1);

14
app/client/src/components/Lyrics.vue
View File

@ -5,7 +5,12 @@
</div>
<div v-if='!loading && lyrics && lyrics.lyrics.length > 0' class='text-center'>
<div v-for='(lyric, index) in lyrics.lyrics' :key='lyric.offset' class='my-8 mx-4'>
<div
v-for='(lyric, index) in lyrics.lyrics'
:key='lyric.offset'
class='my-6 mx-4 pa-2 rounded'
:class='{"grey darken-3": playingNow(index)}'
@click='seekTo(index)'>
<span
class='my-8'
:class='{"text-h6 font-weight-regular": !playingNow(index), "text-h5 font-weight-bold": playingNow(index)}'
@ -27,7 +32,7 @@
</div>
<!-- Error -->
<div v-if='!loading && !lyrics && lyrics.text.length == 0 && lyrics.lyrics.length == 0' class='pa-4 text-center'>
<div v-if='!loading && (!lyrics || (lyrics.text.length == 0 && lyrics.lyrics.length == 0))' class='pa-4 text-center'>
<span class='red--text text-h5'>
Error loading lyrics or lyrics not found!
</span>
@ -94,10 +99,15 @@ export default {
//Roughly middle
let offset = window.innerHeight / 2 - 500;
if (!this.$refs["l"+this.currentLyricIndex]) return;
this.$refs.content.scrollTo({
top: this.$refs["l"+this.currentLyricIndex][0].offsetTop + offset,
behavior: 'smooth'
});
},
//Seek to lyric in song
seekTo(i) {
this.$root.seek(this.lyrics.lyrics[i].offset);
}
},
mounted() {

4
app/client/src/components/TrackTile.vue
View File

@ -177,7 +177,7 @@ export default {
addLibrary() {
this.isLibrary = true;
this.$root.libraryTracks.push(this.track.id);
this.$axios.put(`/library/tracks?id=${this.track.id}`);
this.$axios.put(`/library/track?id=${this.track.id}`);
},
goAlbum() {
this.$emit('redirect')
@ -196,7 +196,7 @@ export default {
async removeLibrary() {
this.isLibrary = false;
this.$root.libraryTracks.splice(this.$root.libraryTracks.indexOf(this.track.id), 1);
await this.$axios.delete(`/library/tracks?id=${this.track.id}`);
await this.$axios.delete(`/library/track?id=${this.track.id}`);
this.$emit('remove');
},
//Remove from playlist

41
app/client/src/main.js
View File

@ -213,6 +213,8 @@ new Vue({
this.configureAudio();
this.state = 1;
if (autoplay) this.play();
//MediaSession
this.updateMediaSession();
//Loads more tracks if end of list
this.loadSTL();
@ -275,6 +277,7 @@ new Vue({
//Play
this.state = 2;
this.audio.play();
this.updateMediaSession();
await this.savePlaybackInfo();
return;
}
@ -282,7 +285,6 @@ new Vue({
this.skip(1);
this.savePlaybackInfo();
});
this.updateMediaSession();
},
//Update media session with current track metadata
updateMediaSession() {
@ -417,6 +419,12 @@ new Vue({
state: this.state,
track: this.track
});
//Update in electron
if (this.settings.electron) {
const {ipcRenderer} = window.require('electron');
ipcRenderer.send('playing', this.state == 2);
}
}
},
async created() {
@ -511,17 +519,40 @@ new Vue({
//Don't handle keystrokes in text fields
if (e.target.tagName == "INPUT") return;
//K toggle playback
//e.keyCode === 32
if (e.keyCode === 75 || e.keyCode === 107) this.$root.toggle();
if (e.code == "KeyK" || e.code == "Space") this.$root.toggle();
//L +10s (from YT)
if (e.keyCode === 108 || e.keyCode === 76) this.$root.seek((this.position + 10000));
if (e.code == "KeyL") this.$root.seek((this.position + 10000));
//J -10s (from YT)
if (e.keyCode === 106 || e.keyCode === 74) this.$root.seek((this.position - 10000));
if (e.code == "KeyJ") this.$root.seek((this.position - 10000));
//-> +5s (from YT)
if (e.code == "ArrowRight") this.$root.seek((this.position + 5000));
//<- -5s (from YT)
if (e.code == "ArrowLeft") this.$root.seek((this.position - 5000));
// ^ v - Volume
if (e.code == 'ArrowUp' && this.audio) {
if ((this.audio.volume + 0.05) > 1) {
this.audio.volume = 1.00;
this.volume = 1.00;
return;
}
this.audio.volume += 0.05;
this.volume = this.audio.volume;
}
if (e.code == 'ArrowDown' && this.audio) {
if ((this.audio.volume - 0.05) < 0) {
this.audio.volume = 0.00;
this.volume = 0.00;
return;
}
this.audio.volume -= 0.05;
this.volume = this.audio.volume;
}
});
},
watch: {
//Watch state for integrations
state() {
this.updateMediaSession();
this.updateState();
}
},

2
app/package.json
View File

@ -1,7 +1,7 @@
{
"name": "freezer",
"private": true,
"version": "1.0.6",
"version": "1.0.7",
"description": "",
"main": "background.js",
"scripts": {

2
app/src/deezer.js
View File

@ -192,7 +192,7 @@ class DeezerAPI {
url: `/stream/${info}?q=9`
}
} catch (e) {
logger.warning('Qualiy fallback: ' + e);
logger.warn('Qualiy fallback: ' + e);
//Fallback
//9 - FLAC
//3 - MP3 320

3
app/src/integrations.js
View File

@ -80,7 +80,7 @@ class Integrations extends EventEmitter {
//Always accept join requests
this.discordRPC.subscribe('ACTIVITY_JOIN_REQUEST', (user) => {
this.discordRPC.sendJoinInvite(user.user).catch((e) => {
logger.warning('Unable to accept Discord invite: ' + e);
logger.warn('Unable to accept Discord invite: ' + e);
});
});
//Joined
@ -93,7 +93,6 @@ class Integrations extends EventEmitter {
});
//Connect to discord
this.discordRPC.login({clientId: CLIENTID}).catch(() => {
logger.info('Error connecting to Discord!');
//Wait 5s to retry
setTimeout(() => {
if (!this.discordReady)

2
package.json
View File

@ -1,7 +1,7 @@
{
"name": "freezer",
"private": true,
"version": "1.0.6",
"version": "1.0.7",
"description": "",
"scripts": {
"pack": "electron-builder --dir",