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

starting electron store, improvements to add to playlist

Browse source
This commit is contained in:
booploops 2021-12-23 02:53:46 -08:00
parent a763047661
commit 5bc98f5187
5 changed files with 145 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

77
src/main/cider-base.js
View file

@ -5,6 +5,83 @@ const express = require("express");
const path = require("path");
const windowStateKeeper = require("electron-window-state");
const os = require('os');
const Store = require("electron-store");
const store = new Store();
const schema = {
"general": {
"close_behavior": {
type: "number",
default: 0
},
"startup_behavior": {
type: "number",
default: 0
},
"discord_rpc": {
type: "number",
default: 1
},
},
"behavior": {
"hw_acceleration": {
type: "number",
default: 0 // 0 = default, 1 = webgpu, 2 = gpu disabled
}
},
"audio": {
"quality": {
type: "string",
default: "extreme",
},
"seamless_audio": {
type: "boolean",
default: true,
}
},
"visual": {
"theme": {
type: "string",
default: ""
},
"scrollbars": {
type: "number",
default: 0
},
"refresh_rate": {
type: "number",
default: 0
},
"animated_artwork": {
type: "number",
default: 0 // 0 = always, 1 = limited, 2 = never
}
},
"lyrics": {
"enable_mxm": {
type: "boolean",
default: false
},
"mxm_language": {
type: "string",
default: "en"
}
},
"lastfm": {
"enabled": {
type: "boolean",
default: false
},
"scrobble_after": {
type: "number",
default: 30
},
"auth_token": {
type: "string",
default: ""
}
}
}
// Analytics for debugging.
const ElectronSentry = require("@sentry/electron");

59
src/renderer/style.less
View file

@ -1528,7 +1528,7 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
background: rgba(0, 0, 0, 0.3);
z-index: 9999;
.modal-window {
background: #333;
@ -1536,11 +1536,24 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
box-shadow: var(--mediaItemShadow-Shadow);
display:flex;
flex-flow: column;
max-height: 500px;
max-width: 360px;
background: #121212;
width: 100%;
position: relative;
&:after {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
box-shadow: var(--mediaItemShadow);
z-index: 1;
border-radius: inherit;
}
.modal-header {
width:100%;
@ -1562,9 +1575,10 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
.modal-window {
max-height: 600px;
max-width: 400px;
background: #121212;
background: rgb(18 18 18 / 90%);
overflow: hidden;
backdrop-filter: blur(16px) saturate(180%);
.modal-header {
padding: 16px;
position:relative;
@ -1601,19 +1615,34 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
.playlist-item {
appearance: none;
border: 0px;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
text-align: left;
width: 100%;
margin: 0;
display: block;
background: rgba(200, 200, 200, 0.02);
display: flex;
background: rgba(32, 32, 32, 0.46);
color: #eee;
font-family: inherit;
font-size: 0.98em;
padding: 12px 12px;
padding: 6px 12px;
align-items: center;
flex-flow: row;
.icon {
pointer-events: none;
width: 32px;
height: 32px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 6px;
}
.name {
}
&:hover {
background: rgb(200 200 200 / 4%);
background: var(--selected);
}
&:active {
@ -2759,6 +2788,18 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
/* Cider */
/* Transitions */
.modal-enter-active,
.modal-leave-active {
transition: opacity .1s var(--appleEase), transform .1s var(--appleEase);
}
.modal-enter,
.modal-leave-to {
opacity: 0;
transform: scale(1.10);
}
.wpfade-enter-active,
.wpfade-leave-active {
transition: opacity .1s var(--appleEase);

24
src/renderer/views/components/add-to-playlist.ejs
View file

@ -1,11 +1,19 @@
<script type="text/x-template" id="add-to-playlist">
<template>
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()">
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.resetState()" @contextmenu.self="app.resetState()">
<div class="modal-window">
<div class="modal-header">
<div class="modal-title">Add to Playlist</div>
<button class="close-btn" @click="app.resetState()"></button>
</div>
<div class="modal-content">
<button class="playlist-item"
:class="{ focused: playlist.id == focused }"
@click="addToPlaylist(playlist.id)" style="width:100%;" v-for="playlist in playlistSorted" v-if="playlist.attributes.canEdit && playlist.type != 'library-playlist-folders'">
<div class="icon"><%- include("../svg/playlist.svg") %></div>
<div class="name">{{ playlist.attributes.name }}</div>
</button>
</div>
<div class="modal-search">
<div class="search-input-container" style="width:100%;margin: 16px 0px;">
<div class="search-input--icon"></div>
@ -17,11 +25,7 @@
v-model="searchQuery"
@input="search()"
class="search-input">
</div> </div>
<div class="modal-content">
<button class="playlist-item"
:class="{ focused: playlist.id == focused }"
@click="addToPlaylist(playlist.id)" style="width:100%;" v-for="playlist in playlistSorted" v-if="playlist.attributes.canEdit && playlist.type != 'library-playlist-folders'">{{ playlist.attributes.name }}</button>
</div>
</div>
</div>
</div>
@ -47,9 +51,9 @@
mounted() {
this.search()
this.$refs.searchInput.focus()
this.$refs.searchInput.addEventListener('keydown', (e)=>{
if(e.keyCode == 13){
if(this.focused != "") {
this.$refs.searchInput.addEventListener('keydown', (e) => {
if (e.keyCode == 13) {
if (this.focused != "") {
this.addToPlaylist(this.focused)
}
}
@ -67,7 +71,7 @@
this.playlistSorted = this.playlists.filter(playlist => {
return playlist.attributes.name.toLowerCase().indexOf(this.searchQuery.toLowerCase()) > -1
})
if(this.playlistSorted.length == 1) {
if (this.playlistSorted.length == 1) {
this.focused = this.playlistSorted[0].id
}
}

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

@ -428,7 +428,7 @@
<transition name="wpfade">
<div class="bg-artwork--placeholder" v-else></div>
</transition>
<transition name="wpfade">
<transition name="modal">
<add-to-playlist :playlists="playlists.listing" v-if="modals.addToPlaylist"></add-to-playlist>
</transition>
<div id="apple-music-video-container">
@ -458,17 +458,9 @@
</div>
</div>
<!-- Media Item Artwork-->
<%- include("components/mediaitem-artwork"); %>
<!-- Generic Collection of MediaItems -->
<script type="text/x-template" id="collection-view-generic">
<template>
<div class="content-inner">
</div>
</template>
</script>
<!-- Browse -->
<%- include('pages/browse') %>

1
src/renderer/views/svg/playlist.svg Normal file
View file

@ -0,0 +1 @@
<svg class="svg-icon" style="width: 1em; height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M682.666667 222.72V725.333333c0 2.56-0.213333 4.992-0.64 7.424A149.333333 149.333333 0 1 1 597.333333 611.712V170.666667a42.666667 42.666667 0 0 1 51.029334-41.813334l213.333333 42.666667A42.666667 42.666667 0 0 1 896 213.333333v170.666667a42.666667 42.666667 0 0 1-51.029333 41.813333l-74.368-14.848a42.666667 42.666667 0 1 1 16.725333-83.669333l23.338667 4.693333V248.32l-128-25.6zM533.333333 810.666667a64 64 0 1 0 0-128 64 64 0 0 0 0 128zM170.666667 341.333333a42.666667 42.666667 0 1 1 0-85.333333h298.666666a42.666667 42.666667 0 0 1 0 85.333333H170.666667z m0 170.666667a42.666667 42.666667 0 0 1 0-85.333333h298.666666a42.666667 42.666667 0 0 1 0 85.333333H170.666667z m0 170.666667a42.666667 42.666667 0 0 1 0-85.333334h128a42.666667 42.666667 0 0 1 0 85.333334H170.666667z" /></svg>
Side by side

After

Width:  |  Height:  |  Size: 989 B