diff options
Diffstat (limited to 'ext/js/pages/settings')
| -rw-r--r-- | ext/js/pages/settings/audio-controller.js | 146 | ||||
| -rw-r--r-- | ext/js/pages/settings/backup-controller.js | 17 |
2 files changed, 121 insertions, 42 deletions
diff --git a/ext/js/pages/settings/audio-controller.js b/ext/js/pages/settings/audio-controller.js index 2581893c..c74c1477 100644 --- a/ext/js/pages/settings/audio-controller.js +++ b/ext/js/pages/settings/audio-controller.js @@ -19,15 +19,17 @@ * AudioSystem */ -class AudioController { +class AudioController extends EventDispatcher { constructor(settingsController, modalController) { + super(); this._settingsController = settingsController; this._modalController = modalController; this._audioSystem = new AudioSystem(); this._audioSourceContainer = null; this._audioSourceAddButton = null; this._audioSourceEntries = []; - this._ttsVoiceTestTextInput = null; + this._voiceTestTextInput = null; + this._voices = []; } get settingsController() { @@ -41,7 +43,7 @@ class AudioController { async prepare() { this._audioSystem.prepare(); - this._ttsVoiceTestTextInput = document.querySelector('#text-to-speech-voice-test-text'); + this._voiceTestTextInput = document.querySelector('#text-to-speech-voice-test-text'); this._audioSourceContainer = document.querySelector('#audio-source-list'); this._audioSourceAddButton = document.querySelector('#audio-source-add'); this._audioSourceContainer.textContent = ''; @@ -76,6 +78,14 @@ class AudioController { }]); } + getVoices() { + return this._voices; + } + + setTestVoice(voice) { + this._voiceTestTextInput.dataset.voice = voice; + } + // Private _onOptionsChanged({options}) { @@ -96,9 +106,8 @@ class AudioController { _onTestTextToSpeech() { try { - const text = this._ttsVoiceTestTextInput.value || ''; - const voiceUri = document.querySelector('[data-setting="audio.textToSpeechVoice"]').value; - + const text = this._voiceTestTextInput.value || ''; + const voiceUri = this._voiceTestTextInput.dataset.voice; const audio = this._audioSystem.createTextToSpeechAudio(text, voiceUri); audio.volume = 1.0; audio.play(); @@ -118,25 +127,8 @@ class AudioController { [] ); voices.sort(this._textToSpeechVoiceCompare.bind(this)); - - for (const select of document.querySelectorAll('[data-setting="audio.textToSpeechVoice"]')) { - const fragment = document.createDocumentFragment(); - - let option = document.createElement('option'); - option.value = ''; - option.textContent = 'None'; - fragment.appendChild(option); - - for (const {voice} of voices) { - option = document.createElement('option'); - option.value = voice.voiceURI; - option.textContent = `${voice.name} (${voice.lang})`; - fragment.appendChild(option); - } - - select.textContent = ''; - select.appendChild(fragment); - } + this._voices = voices; + this.trigger('voicesUpdated'); } _textToSpeechVoiceCompare(a, b) { @@ -163,9 +155,9 @@ class AudioController { ); } - _createAudioSourceEntry(index, type) { + _createAudioSourceEntry(index, source) { const node = this._settingsController.instantiateTemplate('audio-source'); - const entry = new AudioSourceEntry(this, index, type, node); + const entry = new AudioSourceEntry(this, index, source, node); this._audioSourceEntries.push(entry); this._audioSourceContainer.appendChild(node); entry.prepare(); @@ -188,25 +180,31 @@ class AudioController { async _addAudioSource() { const type = this._getUnusedAudioSourceType(); + const source = {type, url: '', voice: ''}; const index = this._audioSourceEntries.length; - this._createAudioSourceEntry(index, type); + this._createAudioSourceEntry(index, source); await this._settingsController.modifyProfileSettings([{ action: 'splice', path: 'audio.sources', start: index, deleteCount: 0, - items: [type] + items: [source] }]); } } class AudioSourceEntry { - constructor(parent, index, type, node) { + constructor(parent, index, source, node) { this._parent = parent; this._index = index; - this._type = type; + this._type = source.type; + this._url = source.url; + this._voice = source.voice; this._node = node; this._eventListeners = new EventListenerCollection(); + this._typeSelect = null; + this._urlInput = null; + this._voiceSelect = null; } get index() { @@ -222,14 +220,23 @@ class AudioSourceEntry { } prepare() { - const select = this._node.querySelector('.audio-source-select'); + this._updateTypeParameter(); + const menuButton = this._node.querySelector('.audio-source-menu-button'); + this._typeSelect = this._node.querySelector('.audio-source-type-select'); + this._urlInput = this._node.querySelector('.audio-source-parameter-container[data-field=url] .audio-source-parameter'); + this._voiceSelect = this._node.querySelector('.audio-source-parameter-container[data-field=voice] .audio-source-parameter'); - select.value = this._type; + this._typeSelect.value = this._type; + this._urlInput.value = this._url; - this._eventListeners.addEventListener(select, 'change', this._onAudioSourceSelectChange.bind(this), false); + this._eventListeners.addEventListener(this._typeSelect, 'change', this._onTypeSelectChange.bind(this), false); + this._eventListeners.addEventListener(this._urlInput, 'change', this._onUrlInputChange.bind(this), false); + this._eventListeners.addEventListener(this._voiceSelect, 'change', this._onVoiceSelectChange.bind(this), false); this._eventListeners.addEventListener(menuButton, 'menuOpen', this._onMenuOpen.bind(this), false); this._eventListeners.addEventListener(menuButton, 'menuClose', this._onMenuClose.bind(this), false); + this._eventListeners.on(this._parent, 'voicesUpdated', this._onVoicesUpdated.bind(this)); + this._onVoicesUpdated(); } cleanup() { @@ -241,8 +248,38 @@ class AudioSourceEntry { // Private - _onAudioSourceSelectChange(event) { - this._setType(event.currentTarget.value); + _onVoicesUpdated() { + const voices = this._parent.getVoices(); + + const fragment = document.createDocumentFragment(); + + let option = document.createElement('option'); + option.value = ''; + option.textContent = 'None'; + fragment.appendChild(option); + + for (const {voice} of voices) { + option = document.createElement('option'); + option.value = voice.voiceURI; + option.textContent = `${voice.name} (${voice.lang})`; + fragment.appendChild(option); + } + + this._voiceSelect.textContent = ''; + this._voiceSelect.appendChild(fragment); + this._voiceSelect.value = this._voice; + } + + _onTypeSelectChange(e) { + this._setType(e.currentTarget.value); + } + + _onUrlInputChange(e) { + this._setUrl(e.currentTarget.value); + } + + _onVoiceSelectChange(e) { + this._setVoice(e.currentTarget.value); } _onMenuOpen(e) { @@ -252,6 +289,8 @@ class AudioSourceEntry { switch (this._type) { case 'custom': case 'custom-json': + case 'text-to-speech': + case 'text-to-speech-reading': hasHelp = true; break; } @@ -272,7 +311,35 @@ class AudioSourceEntry { async _setType(value) { this._type = value; - await this._parent.settingsController.setProfileSetting(`audio.sources[${this._index}]`, value); + this._updateTypeParameter(); + await this._parent.settingsController.setProfileSetting(`audio.sources[${this._index}].type`, value); + } + + async _setUrl(value) { + this._url = value; + await this._parent.settingsController.setProfileSetting(`audio.sources[${this._index}].url`, value); + } + + async _setVoice(value) { + this._voice = value; + await this._parent.settingsController.setProfileSetting(`audio.sources[${this._index}].voice`, value); + } + + _updateTypeParameter() { + let field = null; + switch (this._type) { + case 'custom': + case 'custom-json': + field = 'url'; + break; + case 'text-to-speech': + case 'text-to-speech-reading': + field = 'voice'; + break; + } + for (const node of this._node.querySelectorAll('.audio-source-parameter-container')) { + node.hidden = (field === null || node.dataset.field !== field); + } } _showHelp(type) { @@ -283,6 +350,11 @@ class AudioSourceEntry { case 'custom-json': this._showModal('audio-source-help-custom-json'); break; + case 'text-to-speech': + case 'text-to-speech-reading': + this._parent.setTestVoice(this._voice); + this._showModal('audio-source-help-text-to-speech'); + break; } } diff --git a/ext/js/pages/settings/backup-controller.js b/ext/js/pages/settings/backup-controller.js index c961d40e..02ad368c 100644 --- a/ext/js/pages/settings/backup-controller.js +++ b/ext/js/pages/settings/backup-controller.js @@ -278,11 +278,18 @@ class BackupController { const audio = options.audio; if (isObject(audio)) { - const customSourceUrl = audio.customSourceUrl; - if (typeof customSourceUrl === 'string' && customSourceUrl.length > 0 && !this._isLocalhostUrl(customSourceUrl)) { - warnings.push('audio.customSourceUrl uses a non-localhost URL'); - if (!dryRun) { - audio.customSourceUrl = ''; + const sources = audio.sources; + if (Array.isArray(sources)) { + for (let i = 0, ii = sources.length; i < ii; ++i) { + const source = sources[i]; + if (!isObject(source)) { continue; } + const {url} = source; + if (typeof url === 'string' && url.length > 0 && !this._isLocalhostUrl(url)) { + warnings.push(`audio.sources[${i}].url uses a non-localhost URL`); + if (!dryRun) { + sources[i].url = ''; + } + } } } } |