Added spatialized audio settings
This commit is contained in:
booploops
parent
acf66945c3
commit
b7c61d0847
5 changed files with 240 additions and 16 deletions
37
index.js
37
index.js
|
|
@ -7,7 +7,7 @@ const { app, components } = require('electron'),
|
|||
const ElectronSentry = require("@sentry/electron");
|
||||
ElectronSentry.init({dsn: "https://68c422bfaaf44dea880b86aad5a820d2@o954055.ingest.sentry.io/6112214"});
|
||||
|
||||
const configSchema = {
|
||||
const configDefaults = {
|
||||
"general": {
|
||||
"close_behavior": 0, // 0 = close, 1 = minimize, 2 = minimize to tray
|
||||
"startup_behavior": 0, // 0 = nothing, 1 = open on startup
|
||||
|
|
@ -24,12 +24,29 @@ const configSchema = {
|
|||
"seamless_audio": true,
|
||||
"normalization": false,
|
||||
"spatial": false,
|
||||
"test": false,
|
||||
"spatial_properties": {
|
||||
"gain": 0.8,
|
||||
"room_dimensions": {
|
||||
"width": 5,
|
||||
"height": 6,
|
||||
"depth": 4
|
||||
},
|
||||
"room_materials": {
|
||||
"left": 'acoustic-ceiling-tiles',
|
||||
"right": 'acoustic-ceiling-tiles',
|
||||
"front": 'glass-thin',
|
||||
"back": 'glass-thin',
|
||||
"down": 'grass',
|
||||
"up": 'acoustic-ceiling-tiles'
|
||||
}
|
||||
}
|
||||
},
|
||||
"visual": {
|
||||
"theme": "",
|
||||
"scrollbars": 0, // 0 = show on hover, 2 = always hide, 3 = always show
|
||||
"refresh_rate": 0,
|
||||
"animated_artwork": "always", // 0 = always, 1 = limited, 2 = never
|
||||
"animated_artwork": "limited", // 0 = always, 1 = limited, 2 = never
|
||||
"animated_artwork_qualityLevel": 1,
|
||||
"hw_acceleration": "default", // default, webgpu, disabled
|
||||
"window_transparency": "default"
|
||||
|
|
@ -52,13 +69,17 @@ const configSchema = {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
// Enable WebGPU and list adapters (EXPERIMENTAL.)
|
||||
// Note: THIS HAS TO BE BEFORE ANYTHING GETS INITIALIZED.
|
||||
|
||||
const Store = require("electron-store");
|
||||
app.cfg = new Store({
|
||||
defaults: configSchema,
|
||||
defaults: configDefaults
|
||||
});
|
||||
let currentCfg = app.cfg.get()
|
||||
app.cfg.set(Object.assign(configDefaults, currentCfg))
|
||||
|
||||
|
||||
switch (app.cfg.get("visual.hw_acceleration")) {
|
||||
default:
|
||||
|
|
@ -77,7 +98,10 @@ switch (app.cfg.get("visual.hw_acceleration")) {
|
|||
|
||||
// Creating the Application Window and Calling all the Functions
|
||||
function CreateWindow() {
|
||||
if (app.isQuiting) { app.quit(); return; }
|
||||
if (app.isQuiting) {
|
||||
app.quit();
|
||||
return;
|
||||
}
|
||||
|
||||
/** CIDER **/
|
||||
const ciderwin = require("./src/main/cider-base")
|
||||
|
|
@ -101,7 +125,10 @@ app.on('ready', () => {
|
|||
app.whenReady().then(async () => {
|
||||
await components.whenReady().catch(e => console.log(`component ready fail:`, e));
|
||||
console.log('components ready:', components.status());
|
||||
if (app.isQuiting) { app.quit(); return; }
|
||||
if (app.isQuiting) {
|
||||
app.quit();
|
||||
return;
|
||||
}
|
||||
app.commandLine.appendSwitch('high-dpi-support', 1)
|
||||
app.commandLine.appendSwitch('force-device-scale-factor', 1)
|
||||
app.commandLine.appendSwitch('disable-pinch');
|
||||
|
|
|
|||
|
|
@ -256,7 +256,8 @@ const app = new Vue({
|
|||
routes: ["browse", "listen_now", "radio"],
|
||||
musicBaseUrl: "https://api.music.apple.com/",
|
||||
modals: {
|
||||
addToPlaylist: false
|
||||
addToPlaylist: false,
|
||||
spatialProperties: false
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
|
|
|
|||
|
|
@ -1648,6 +1648,45 @@ input[type="range"].web-slider.display--small::-webkit-slider-thumb {
|
|||
}
|
||||
}
|
||||
|
||||
.spatialproperties-panel {
|
||||
.modal-window {
|
||||
height: 600px;
|
||||
max-height: 600px;
|
||||
width: 800px;
|
||||
max-width: 800px;
|
||||
overflow: hidden;
|
||||
|
||||
.modal-header {
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
.modal-title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
width: 50px;
|
||||
height: 100%;
|
||||
background-image: var(--gfx-closeBtn);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
-webkit-app-region: no-drag;
|
||||
appearance: none;
|
||||
border: 0;
|
||||
background-color: transparent;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
|
||||
&:hover {
|
||||
background-color: rgb(196, 43, 28)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.addtoplaylist-panel {
|
||||
.modal-window {
|
||||
max-height: 600px;
|
||||
|
|
|
|||
149
src/renderer/views/components/spatial-properties.ejs
Normal file
149
src/renderer/views/components/spatial-properties.ejs
Normal file
|
|
@ -0,0 +1,149 @@
|
|||
<script type="text/x-template" id="spatial-properties">
|
||||
<div class="modal-fullscreen spatialproperties-panel">
|
||||
<div class="modal-window">
|
||||
<div class="modal-header">
|
||||
<div class="modal-title">Spatial Properties</div>
|
||||
<button class="close-btn" @click="app.resetState()"></button>
|
||||
</div>
|
||||
<div class="modal-content">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<label>
|
||||
Width
|
||||
<input type="number" min="0" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_dimensions.width" step="1"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Height
|
||||
<input type="number" min="0" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_dimensions.height" step="1"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Depth
|
||||
<input type="number" min="0" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_dimensions.depth" step="1"/>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Gain
|
||||
<input type="number" min="0" v-model="app.cfg.audio.spatial_properties.gain" step="0.1"/>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col"></div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Up
|
||||
<select class="md-select" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_materials.up">
|
||||
<option v-for="prop in roomProps" :value="prop">{{ prop }}</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<label>
|
||||
Left
|
||||
<select class="md-select" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_materials.left">
|
||||
<option v-for="prop in roomProps" :value="prop">{{ prop }}</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Front
|
||||
<select class="md-select" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_materials.front">
|
||||
<option v-for="prop in roomProps" :value="prop">{{ prop }}</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
Back
|
||||
<select class="md-select" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_materials.back">
|
||||
<option v-for="prop in roomProps" :value="prop">{{ prop }}</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Right
|
||||
<select class="md-select" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_materials.right">
|
||||
<option v-for="prop in roomProps" :value="prop">{{ prop }}</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col"></div>
|
||||
<div class="col">
|
||||
<label>
|
||||
Down
|
||||
<select class="md-select" @change="setRoom()"
|
||||
v-model="app.cfg.audio.spatial_properties.room_materials.down">
|
||||
<option v-for="prop in roomProps" :value="prop">{{ prop }}</option>
|
||||
</select>
|
||||
</label>
|
||||
</div>
|
||||
<div class="col"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script>
|
||||
Vue.component('spatial-properties', {
|
||||
template: '#spatial-properties',
|
||||
data: function () {
|
||||
return {
|
||||
app: this.$root,
|
||||
roomProps: [
|
||||
'transparent',
|
||||
'acoustic-ceiling-tiles',
|
||||
'brick-bare',
|
||||
'brick-painted',
|
||||
'concrete-block-coarse',
|
||||
'concrete-block-painted',
|
||||
'curtain-heavy',
|
||||
'fiber-glass-insulation',
|
||||
'glass-thin',
|
||||
'glass-thick',
|
||||
'grass',
|
||||
'linoleum-on-concrete',
|
||||
'marble',
|
||||
'metal',
|
||||
'parquet-on-concrete',
|
||||
'plaster-smooth',
|
||||
'plywood-panel',
|
||||
'polished-concrete-or-tile',
|
||||
'sheetrock',
|
||||
'water-or-ice-surface',
|
||||
'wood-ceiling',
|
||||
'wood-panel',
|
||||
'uniform'
|
||||
]
|
||||
}
|
||||
},
|
||||
props: {},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
setRoom() {
|
||||
window.CiderAudio.audioNodes.spatialNode.setRoomProperties(app.cfg.audio.spatial_properties.room_dimensions, app.cfg.audio.spatial_properties.room_materials);
|
||||
window.CiderAudio.audioNodes.gainNode.gain.value = app.cfg.audio.spatial_properties.gain
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
|
@ -215,6 +215,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</button>
|
||||
<button class="usermenu-item" v-if="cfg.advanced.AudioContext && cfg.audio.spatial" @click="modals.spatialProperties = true">
|
||||
Spatialized Audio Settings
|
||||
</button>
|
||||
<button class="usermenu-item">
|
||||
About
|
||||
</button>
|
||||
|
|
@ -472,6 +475,9 @@
|
|||
<transition name="modal">
|
||||
<add-to-playlist :playlists="playlists.listing" v-if="modals.addToPlaylist"></add-to-playlist>
|
||||
</transition>
|
||||
<transition name="modal">
|
||||
<spatial-properties v-if="modals.spatialProperties"></spatial-properties>
|
||||
</transition>
|
||||
<div id="apple-music-video-container">
|
||||
<div id="apple-music-video-player-controls">
|
||||
<div id="player-exit" title="Close" @click="app.exitMV()">
|
||||
|
|
@ -551,6 +557,8 @@
|
|||
</button>
|
||||
</script>
|
||||
|
||||
<!-- Spatial Properties -->
|
||||
<%- include('components/spatial-properties') %>
|
||||
<!-- Add to playlist -->
|
||||
<%- include('components/add-to-playlist') %>
|
||||
<!-- Queue -->
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue