orchard/src/renderer/views/components/audio-settings.ejs

62 lines
No EOL
2.7 KiB
Text

<script type="text/x-template" id="audio-settings">
<template>
<div class="modal-fullscreen addtoplaylist-panel" @click.self="app.modals.audioSettings = false" @contextmenu.self="app.modals.audioSettings = false">
<div class="modal-window">
<div class="modal-header">
<div class="modal-title">{{app.getLz('term.audioSettings')}}</div>
<button class="close-btn" @click="app.modals.audioSettings = false" :aria-label="app.getLz('action.close')"></button>
</div>
<div class="modal-content">
<button class="playlist-item"
@click="openEqualizer()" style="width:100%;">
<div class="icon"><%- include("../svg/speaker.svg") %></div>
<div class="name">{{app.getLz('term.equalizer')}}</div>
</button>
<button class="playlist-item"
@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.openSettingsPage('audiolabs')" style="width:100%;">
<div class="icon"><%- include("../svg/speaker.svg") %></div>
<div class="name">{{app.getLz('settings.option.audio.audioLab')}}</div>
</button>
</div>
</div>
</div>
</template>
</script>
<script>
Vue.component('audio-settings', {
template: '#audio-settings',
data: function () {
return {
app: this.$root,
}
},
props: {},
mounted() {},
methods: {
openEqualizer() {
app.modals.equalizer = true
app.modals.audioSettings = false
},
openAudioControls() {
app.modals.audioControls = true
app.modals.audioSettings = false
},
openAudioPlaybackRate() {
app.modals.audioPlaybackRate = true
app.modals.audioSettings = false
},
},
}
);
</script>