diff options
| -rw-r--r-- | ext/bg/js/search.js | 14 | ||||
| -rw-r--r-- | ext/bg/js/settings/audio-ui.js (renamed from ext/bg/js/audio-ui.js) | 40 | ||||
| -rw-r--r-- | ext/bg/js/settings/audio.js | 41 | ||||
| -rw-r--r-- | ext/bg/settings.html | 4 | ||||
| -rw-r--r-- | ext/manifest.json | 2 |
5 files changed, 68 insertions, 33 deletions
diff --git a/ext/bg/js/search.js b/ext/bg/js/search.js index 00b7ca4b..d2e0fd56 100644 --- a/ext/bg/js/search.js +++ b/ext/bg/js/search.js @@ -227,6 +227,7 @@ class DisplaySearch extends Display { } else { this.container.textContent = ''; } + this.setTitleText(query); window.parent.postMessage('popupClose', '*'); } catch (e) { this.onError(e); @@ -356,6 +357,19 @@ class DisplaySearch extends Display { this.search.disabled = this.introVisible && (this.query === null || this.query.value.length === 0); } + setTitleText(text) { + // Chrome limits title to 1024 characters + if (text.length > 1000) { + text = text.substring(0, 1000) + '...'; + } + + if (text.length === 0) { + document.title = 'Yomichan Search'; + } else { + document.title = `${text} - Yomichan Search`; + } + } + static getSearchQueryFromLocation(url) { const match = /^[^?#]*\?(?:[^&#]*&)?query=([^&#]*)/.exec(url); return match !== null ? decodeURIComponent(match[1]) : null; diff --git a/ext/bg/js/audio-ui.js b/ext/bg/js/settings/audio-ui.js index 381129ac..de3be083 100644 --- a/ext/bg/js/audio-ui.js +++ b/ext/bg/js/settings/audio-ui.js @@ -21,7 +21,7 @@ class AudioSourceUI { static instantiateTemplate(templateSelector) { const template = document.querySelector(templateSelector); const content = document.importNode(template.content, true); - return $(content.firstChild); + return content.firstChild; } } @@ -32,13 +32,14 @@ AudioSourceUI.Container = class Container { this.addButton = addButton; this.children = []; - this.container.empty(); + this.container.textContent = ''; for (const audioSource of toIterable(audioSources)) { this.children.push(new AudioSourceUI.AudioSource(this, audioSource, this.children.length)); } - this.addButton.on('click', () => this.onAddAudioSource()); + this._clickListener = () => this.onAddAudioSource(); + this.addButton.addEventListener('click', this._clickListener, false); } cleanup() { @@ -46,8 +47,9 @@ AudioSourceUI.Container = class Container { child.cleanup(); } - this.addButton.off('click'); - this.container.empty(); + this.addButton.removeEventListener('click', this._clickListener, false); + this.container.textContent = ''; + this._clickListener = null; } save() { @@ -98,20 +100,28 @@ AudioSourceUI.AudioSource = class AudioSource { this.audioSource = audioSource; this.index = index; - this.container = AudioSourceUI.instantiateTemplate('#audio-source-template').appendTo(parent.container); - this.select = this.container.find('.audio-source-select'); - this.removeButton = this.container.find('.audio-source-remove'); + this.container = AudioSourceUI.instantiateTemplate('#audio-source-template'); + this.select = this.container.querySelector('.audio-source-select'); + this.removeButton = this.container.querySelector('.audio-source-remove'); - this.select.val(audioSource); + this.select.value = audioSource; - this.select.on('change', () => this.onSelectChanged()); - this.removeButton.on('click', () => this.onRemoveClicked()); + this._selectChangeListener = () => this.onSelectChanged(); + this._removeClickListener = () => this.onRemoveClicked(); + + this.select.addEventListener('change', this._selectChangeListener, false); + this.removeButton.addEventListener('click', this._removeClickListener, false); + + parent.container.appendChild(this.container); } cleanup() { - this.select.off('change'); - this.removeButton.off('click'); - this.container.remove(); + this.select.removeEventListener('change', this._selectChangeListener, false); + this.removeButton.removeEventListener('click', this._removeClickListener, false); + + if (this.container.parentNode !== null) { + this.container.parentNode.removeChild(this.container); + } } save() { @@ -119,7 +129,7 @@ AudioSourceUI.AudioSource = class AudioSource { } onSelectChanged() { - this.audioSource = this.select.val(); + this.audioSource = this.select.value; this.parent.audioSources[this.index] = this.audioSource; this.save(); } diff --git a/ext/bg/js/settings/audio.js b/ext/bg/js/settings/audio.js index f63551ed..2ac4590b 100644 --- a/ext/bg/js/settings/audio.js +++ b/ext/bg/js/settings/audio.js @@ -22,7 +22,11 @@ let audioSourceUI = null; async function audioSettingsInitialize() { const optionsContext = getOptionsContext(); const options = await apiOptionsGet(optionsContext); - audioSourceUI = new AudioSourceUI.Container(options.audio.sources, $('.audio-source-list'), $('.audio-source-add')); + audioSourceUI = new AudioSourceUI.Container( + options.audio.sources, + document.querySelector('.audio-source-list'), + document.querySelector('.audio-source-add') + ); audioSourceUI.save = () => settingsSaveOptions(); textToSpeechInitialize(); @@ -34,24 +38,33 @@ function textToSpeechInitialize() { speechSynthesis.addEventListener('voiceschanged', () => updateTextToSpeechVoices(), false); updateTextToSpeechVoices(); - $('#text-to-speech-voice-test').on('click', () => textToSpeechTest()); + document.querySelector('#text-to-speech-voice-test').addEventListener('click', () => textToSpeechTest(), false); } function updateTextToSpeechVoices() { const voices = Array.prototype.map.call(speechSynthesis.getVoices(), (voice, index) => ({voice, index})); voices.sort(textToSpeechVoiceCompare); - if (voices.length > 0) { - $('#text-to-speech-voice-container').css('display', ''); - } - const select = $('#text-to-speech-voice'); - select.empty(); - select.append($('<option>').val('').text('None')); + document.querySelector('#text-to-speech-voice-container').hidden = (voices.length === 0); + + const fragment = document.createDocumentFragment(); + + let option = document.createElement('option'); + option.value = ''; + option.textContent = 'None'; + fragment.appendChild(option); + for (const {voice} of voices) { - select.append($('<option>').val(voice.voiceURI).text(`${voice.name} (${voice.lang})`)); + option = document.createElement('option'); + option.value = voice.voiceURI; + option.textContent = `${voice.name} (${voice.lang})`; + fragment.appendChild(option); } - select.val(select.attr('data-value')); + const select = document.querySelector('#text-to-speech-voice'); + select.textContent = ''; + select.appendChild(fragment); + select.value = select.dataset.value; } function languageTagIsJapanese(languageTag) { @@ -78,15 +91,13 @@ function textToSpeechVoiceCompare(a, b) { if (bIsDefault) { return 1; } } - if (a.index < b.index) { return -1; } - if (a.index > b.index) { return 1; } - return 0; + return a.index - b.index; } function textToSpeechTest() { try { - const text = $('#text-to-speech-voice-test').attr('data-speech-text') || ''; - const voiceURI = $('#text-to-speech-voice').val(); + const text = document.querySelector('#text-to-speech-voice-test').dataset.speechText || ''; + const voiceURI = document.querySelector('#text-to-speech-voice').value; const voice = audioGetTextToSpeechVoice(voiceURI); if (voice === null) { return; } diff --git a/ext/bg/settings.html b/ext/bg/settings.html index 3c5494b8..46184842 100644 --- a/ext/bg/settings.html +++ b/ext/bg/settings.html @@ -299,7 +299,7 @@ <input type="number" min="0" max="100" id="audio-playback-volume" class="form-control"> </div> - <div class="form-group" style="display: none;" id="text-to-speech-voice-container"> + <div class="form-group" id="text-to-speech-voice-container" hidden> <label for="text-to-speech-voice">Text-to-speech voice</label> <div class="input-group"> <select class="form-control" id="text-to-speech-voice"></select> @@ -870,7 +870,6 @@ <script src="/bg/js/anki.js"></script> <script src="/bg/js/api.js"></script> - <script src="/bg/js/audio-ui.js"></script> <script src="/bg/js/conditions.js"></script> <script src="/bg/js/conditions-ui.js"></script> <script src="/bg/js/dictionary.js"></script> @@ -885,6 +884,7 @@ <script src="/bg/js/settings/anki.js"></script> <script src="/bg/js/settings/anki-templates.js"></script> <script src="/bg/js/settings/audio.js"></script> + <script src="/bg/js/settings/audio-ui.js"></script> <script src="/bg/js/settings/dictionaries.js"></script> <script src="/bg/js/settings/popup-preview.js"></script> <script src="/bg/js/settings/profiles.js"></script> diff --git a/ext/manifest.json b/ext/manifest.json index f91a6b33..225ca441 100644 --- a/ext/manifest.json +++ b/ext/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 2, "name": "Yomichan", - "version": "2.0.0", + "version": "2.0.1", "description": "Japanese dictionary with Anki integration", "icons": {"16": "mixed/img/icon16.png", "48": "mixed/img/icon48.png", "128": "mixed/img/icon128.png"}, |