Added Playback Rate functionality (#933)

* Add () to openAudioControls function call

* Duplicate new placeholder modal

* Add to app.modals

* Make modal do something

* Changed input to slider

* Change i18n string name and remove con.log

* Finalized i18n strings

* Add to store.ts and update i18n hehe

* Save rate to cfg

* fuck off

* AAHH

* Make auto-set more reliable

* no nightcore stuff here

Co-authored-by: cryptofyre <cryptofyre@cryptofyre.org>
This commit is contained in:
Amaru8 2022-04-25 07:55:13 +02:00 committed by GitHub
parent 67834c192a
commit 144127f142
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 106 additions and 2 deletions

View file

@ -271,6 +271,12 @@ Update 22/04/2022 16:00 UTC
* `settings.option.visual.theme.github.openfolder`: Added for `en_US`
Update 24/04/2022 19:00 UTC
* `settings.option.audio.changePlaybackRate`: Added for `en_US`
* `settings.option.audio.playbackRate`: Added for `en_US`
* `settings.option.audio.playbackRate.change`: Added for `en_US`
Update 25/04/2022 00:21 UTC
* `settings.description.search`: Added for `en_US`
@ -284,4 +290,3 @@ Update 25/04/2022 00:21 UTC
* `settings.description.cast`: Added for `en_US`
* `settings.description.settings`: Added for `en_US`
* `settings.description.developer`: Added for `en_US`

View file

@ -300,6 +300,9 @@
"settings.header.audio.description": "Adjust the audio settings for Cider.",
"settings.option.audio.volumeStep": "Volume Step",
"settings.option.audio.maxVolume": "Max Volume",
"settings.option.audio.changePlaybackRate": "Change Playback Rate",
"settings.option.audio.playbackRate": "Playback Rate",
"settings.option.audio.playbackRate.change": "Change",
"settings.option.audio.quality": "Audio Quality",
"settings.header.audio.quality.hireslossless": "Hi-Res Lossless",
"settings.header.audio.quality.hireslossless.description": "up to 24-bit/192 kHz",

View file

@ -289,6 +289,9 @@
"settings.header.audio.description": "A Cider hangbeállításainak módosítása.",
"settings.option.audio.volumeStep": "Hangerő lépték",
"settings.option.audio.maxVolume": "Maximum hangerő",
"settings.option.audio.changePlaybackRate": "Lejátszási sebesség módosítása",
"settings.option.audio.playbackRate": "Sebesség",
"settings.option.audio.playbackRate.change": "Módosítás",
"settings.option.audio.quality": "Hangminőség",
"settings.header.audio.quality.hireslossless": "Nagy felbontású veszteségmentes",
"settings.header.audio.quality.hireslossless.description": "max. 24-bit/192 kHz sebességen",

View file

@ -300,6 +300,9 @@
"settings.header.audio.description": "Adjust the audio settings for Cider.",
"settings.option.audio.volumeStep": "Volume Step",
"settings.option.audio.maxVolume": "Max Volume",
"settings.option.audio.changePlaybackRate": "Change Playback Rate",
"settings.option.audio.playbackRate": "Playback Rate",
"settings.option.audio.playbackRate.change": "Change",
"settings.option.audio.quality": "Audio Quality",
"settings.header.audio.quality.hireslossless": "Hi-Res Lossless",
"settings.header.audio.quality.hireslossless.description": "up to 24-bit/192 kHz",

View file

@ -72,6 +72,7 @@ export class BrowserWindow {
"components/audio-settings",
"components/plugin-menu",
"components/audio-controls",
"components/audio-playbackrate",
"components/qrcode-modal",
"components/moreinfo-modal",
"components/equalizer",

View file

@ -68,6 +68,7 @@ export class Store {
"maxVolume": 1,
"lastVolume": 1,
"muted": false,
"playbackRate": '1',
"quality": "HIGH",
"seamless_audio": true,
"normalization": false,

View file

@ -37,6 +37,12 @@ const MusicKitInterop = {
if (trackFilter || !app.cfg.lastfm.filterLoop) {
global.ipcRenderer.send('nowPlayingItemDidChangeLastFM', attributes);
}
if (MusicKit.getInstance().nowPlayingItem) {
await this.sleep(1000);
console.log("Auto-updating Playback Rate from " + MusicKit.getInstance().playbackRate + " x to " + app.cfg.audio.playbackRate + " x");
MusicKit.getInstance().playbackRate = app.cfg.audio.playbackRate;
}
});
MusicKit.getInstance().addEventListener(MusicKit.Events.authorizationStatusDidChange, () => {
@ -47,6 +53,13 @@ const MusicKitInterop = {
console.warn(`[mediaPlaybackError] ${e}`);
})
},
sleep(ms) {
return new Promise((resolve) => {
setTimeout(resolve, ms);
});
},
async modifyNamesOnLocale() {
if (app.mklang === '' || app.mklang == null) {
return;

View file

@ -203,6 +203,7 @@ const app = new Vue({
audioSettings: false,
pluginMenu: false,
audioControls: false,
audioPlaybackRate: false,
showPlaylist: false,
castMenu: false,
moreInfo: false,

View file

@ -12954,6 +12954,10 @@ body[platform='darwin'] .app-chrome .app-chrome-item > .app-mainmenu {
.percent::after {
content: '%';
}
.playbackrate-text {
align-items: end;
margin-right: 5px;
}
.spatialproperties-panel.modal-fullscreen {
flex-direction: column;
}

View file

@ -3294,6 +3294,11 @@ body[platform='darwin'] {
content: '%';
}
.playbackrate-text {
align-items: end;
margin-right: 5px;
}
.modal .close {
color: transparent;
}

View file

@ -19,6 +19,9 @@
<transition name="modal">
<audio-controls v-if="modals.audioControls"></audio-controls>
</transition>
<transition name="modal">
<audio-playbackrate v-if="modals.audioPlaybackRate"></audio-playbackrate>
</transition>
<transition name="modal">
<audio-settings v-if="modals.audioSettings"></audio-settings>
</transition>

View file

@ -0,0 +1,43 @@
<script type="text/x-template" id="audio-playbackrate">
<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">{{app.getLz('settings.option.audio.changePlaybackRate')}}</div>
<button class="close-btn" @click="app.resetState()"></button>
</div>
<div class="modal-content">
<div class="md-option-line">
<div class="md-option-segment">
{{app.getLz('settings.option.audio.playbackRate')}}
</div>
<div class="md-option-segment playbackrate-text" v-if="this.playbackRate">
{{playbackRate}} ×
</div>
<div class="md-option-segment md-option-segment_auto">
<input type="range" :step="0.05" min="0.25" :max="2" v-model="playbackRate">
</div>
</div>
</div>
</div>
</div>
</script>
<script>
Vue.component('audio-playbackrate', {
template: '#audio-playbackrate',
data: function () {
return {
app: this.$root,
playbackRate: this.$root.cfg.audio.playbackRate
}
},
watch: {
playbackRate: function (newValue, _oldValue) {
this.$root.mk.playbackRate = newValue
this.$root.cfg.audio.playbackRate = newValue
this.playbackRate = newValue
}
}
});
</script>

View file

@ -18,10 +18,15 @@
<div class="name">{{app.getLz('settings.option.audio.enableAdvancedFunctionality.audioSpatialization')}}</div>
</button>
<button class="playlist-item"
@click="openAudioControls" style="width:100%;">
@click="openAudioControls()" style="width:100%;">
<div class="icon"><%- include("../svg/speaker.svg") %></div>
<div class="name">{{app.getLz('term.audioControls')}}</div>
</button>
<button class="playlist-item"
@click="openAudioPlaybackRate()" style="width:100%;">
<div class="icon"><%- include("../svg/speaker.svg") %></div>
<div class="name">{{app.getLz('settings.option.audio.changePlaybackRate')}}</div>
</button>
<button class="playlist-item"
@click="$root.appRoute('audiolabs')" style="width:100%;">
<div class="icon"><%- include("../svg/speaker.svg") %></div>
@ -60,6 +65,10 @@
app.modals.audioControls = true
app.modals.audioSettings = false
},
openAudioPlaybackRate() {
app.modals.audioPlaybackRate = true
app.modals.audioSettings = false
},
},
}
);

View file

@ -259,6 +259,16 @@
</button>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
{{$root.getLz('settings.option.audio.changePlaybackRate')}}
</div>
<div class="md-option-segment md-option-segment_auto">
<button class="md-btn" onclick="app.modals.audioPlaybackRate = true">
{{$root.getLz('settings.option.audio.playbackRate.change')}}
</button>
</div>
</div>
<div class="md-option-line">
<div class="md-option-segment">
{{$root.getLz('settings.option.audio.seamlessTransition')}}