From 3c48290cd83744983df2e708b892a8415bcf750f Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 11 Apr 2020 15:17:25 -0400 Subject: Add isExtensionUrl utility function to yomichan object --- ext/mixed/js/core.js | 9 +++++++++ 1 file changed, 9 insertions(+) (limited to 'ext/mixed') diff --git a/ext/mixed/js/core.js b/ext/mixed/js/core.js index 2d11c11a..6a3298fc 100644 --- a/ext/mixed/js/core.js +++ b/ext/mixed/js/core.js @@ -316,6 +316,15 @@ const yomichan = (() => { this.trigger('orphaned', {error}); } + isExtensionUrl(url) { + try { + const urlBase = chrome.runtime.getURL('/'); + return url.substring(0, urlBase.length) === urlBase; + } catch (e) { + return false; + } + } + getTemporaryListenerResult(eventHandler, userCallback, timeout=null) { if (!( typeof eventHandler.addListener === 'function' && -- cgit v1.2.3 From 51e17b35e3a855c0db6c4be94a8cb416b14c8ad7 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 11 Apr 2020 15:21:43 -0400 Subject: Convert some util* functions into api* functions --- ext/bg/js/backend.js | 45 +++++++++++++++++++++++++++++++++++++- ext/bg/js/settings/anki.js | 10 ++++----- ext/bg/js/settings/dictionaries.js | 12 +++++----- ext/bg/js/util.js | 29 ------------------------ ext/mixed/js/api.js | 24 ++++++++++++++++++++ 5 files changed, 79 insertions(+), 41 deletions(-) (limited to 'ext/mixed') diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index be8ea322..bc687a24 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -102,7 +102,13 @@ class Backend { ['getQueryParserTemplatesHtml', {handler: this._onApiGetQueryParserTemplatesHtml.bind(this), async: true}], ['getZoom', {handler: this._onApiGetZoom.bind(this), async: true}], ['getMessageToken', {handler: this._onApiGetMessageToken.bind(this), async: false}], - ['getDefaultAnkiFieldTemplates', {handler: this._onApiGetDefaultAnkiFieldTemplates.bind(this), async: false}] + ['getDefaultAnkiFieldTemplates', {handler: this._onApiGetDefaultAnkiFieldTemplates.bind(this), async: false}], + ['getAnkiDeckNames', {handler: this._onApiGetAnkiDeckNames.bind(this), async: true}], + ['getAnkiModelNames', {handler: this._onApiGetAnkiModelNames.bind(this), async: true}], + ['getAnkiModelFieldNames', {handler: this._onApiGetAnkiModelFieldNames.bind(this), async: true}], + ['getDictionaryInfo', {handler: this._onApiGetDictionaryInfo.bind(this), async: true}], + ['getDictionaryCounts', {handler: this._onApiGetDictionaryCounts.bind(this), async: true}], + ['purgeDatabase', {handler: this._onApiPurgeDatabase.bind(this), async: true}] ]); this._commandHandlers = new Map([ @@ -704,6 +710,36 @@ class Backend { return this.defaultAnkiFieldTemplates; } + async _onApiGetAnkiDeckNames(params, sender) { + this._validatePrivilegedMessageSender(sender); + return await this.anki.getDeckNames(); + } + + async _onApiGetAnkiModelNames(params, sender) { + this._validatePrivilegedMessageSender(sender); + return await this.anki.getModelNames(); + } + + async _onApiGetAnkiModelFieldNames({modelName}, sender) { + this._validatePrivilegedMessageSender(sender); + return await this.anki.getModelFieldNames(modelName); + } + + async _onApiGetDictionaryInfo(params, sender) { + this._validatePrivilegedMessageSender(sender); + return await this.translator.database.getDictionaryInfo(); + } + + async _onApiGetDictionaryCounts({dictionaryNames, getTotal}, sender) { + this._validatePrivilegedMessageSender(sender); + return await this.translator.database.getDictionaryCounts(dictionaryNames, getTotal); + } + + async _onApiPurgeDatabase(params, sender) { + this._validatePrivilegedMessageSender(sender); + return await this.translator.purgeDatabase(); + } + // Command handlers async _onCommandSearch(params) { @@ -800,6 +836,13 @@ class Backend { // Utilities + _validatePrivilegedMessageSender(sender) { + const url = sender.url; + if (!(typeof url === 'string' && yomichan.isExtensionUrl(url))) { + throw new Error('Invalid message sender'); + } + } + async _getAudioUri(definition, source, details) { let optionsContext = (typeof details === 'object' && details !== null ? details.optionsContext : null); if (!(typeof optionsContext === 'object' && optionsContext !== null)) { diff --git a/ext/bg/js/settings/anki.js b/ext/bg/js/settings/anki.js index b32a9517..ff1277ed 100644 --- a/ext/bg/js/settings/anki.js +++ b/ext/bg/js/settings/anki.js @@ -16,13 +16,13 @@ */ /* global + * apiGetAnkiDeckNames + * apiGetAnkiModelFieldNames + * apiGetAnkiModelNames * getOptionsContext * getOptionsMutable * onFormOptionsChanged * settingsSaveOptions - * utilAnkiGetDeckNames - * utilAnkiGetModelFieldNames - * utilAnkiGetModelNames * utilBackgroundIsolate */ @@ -107,7 +107,7 @@ async function _ankiDeckAndModelPopulate(options) { const kanjiModel = {value: options.anki.kanji.model, selector: '#anki-kanji-model'}; try { _ankiSpinnerShow(true); - const [deckNames, modelNames] = await Promise.all([utilAnkiGetDeckNames(), utilAnkiGetModelNames()]); + const [deckNames, modelNames] = await Promise.all([apiGetAnkiDeckNames(), apiGetAnkiModelNames()]); deckNames.sort(); modelNames.sort(); termsDeck.values = deckNames; @@ -180,7 +180,7 @@ async function _onAnkiModelChanged(e) { let fieldNames; try { const modelName = node.value; - fieldNames = await utilAnkiGetModelFieldNames(modelName); + fieldNames = await apiGetAnkiModelFieldNames(modelName); _ankiSetError(null); } catch (error) { _ankiSetError(error); diff --git a/ext/bg/js/settings/dictionaries.js b/ext/bg/js/settings/dictionaries.js index 1a6d452b..7eed4273 100644 --- a/ext/bg/js/settings/dictionaries.js +++ b/ext/bg/js/settings/dictionaries.js @@ -17,8 +17,11 @@ /* global * PageExitPrevention + * apiGetDictionaryCounts + * apiGetDictionaryInfo * apiOptionsGet * apiOptionsGetFull + * apiPurgeDatabase * getOptionsContext * getOptionsFullMutable * getOptionsMutable @@ -27,10 +30,7 @@ * storageUpdateStats * utilBackgroundIsolate * utilDatabaseDeleteDictionary - * utilDatabaseGetDictionaryCounts - * utilDatabaseGetDictionaryInfo * utilDatabaseImport - * utilDatabasePurge */ let dictionaryUI = null; @@ -431,7 +431,7 @@ async function onDictionaryOptionsChanged() { async function onDatabaseUpdated() { try { - const dictionaries = await utilDatabaseGetDictionaryInfo(); + const dictionaries = await apiGetDictionaryInfo(); dictionaryUI.setDictionaries(dictionaries); document.querySelector('#dict-warning').hidden = (dictionaries.length > 0); @@ -439,7 +439,7 @@ async function onDatabaseUpdated() { updateMainDictionarySelectOptions(dictionaries); await updateMainDictionarySelectValue(); - const {counts, total} = await utilDatabaseGetDictionaryCounts(dictionaries.map((v) => v.title), true); + const {counts, total} = await apiGetDictionaryCounts(dictionaries.map((v) => v.title), true); dictionaryUI.setCounts(counts, total); } catch (e) { dictionaryErrorsShow([e]); @@ -618,7 +618,7 @@ async function onDictionaryPurge(e) { dictionaryErrorsShow(null); dictionarySpinnerShow(true); - await utilDatabasePurge(); + await apiPurgeDatabase(); for (const {options} of toIterable((await getOptionsFullMutable()).profiles)) { options.dictionaries = utilBackgroundIsolate({}); options.general.mainDictionary = ''; diff --git a/ext/bg/js/util.js b/ext/bg/js/util.js index 69536f02..106365ac 100644 --- a/ext/bg/js/util.js +++ b/ext/bg/js/util.js @@ -79,35 +79,6 @@ function utilBackend() { return backend; } -async function utilAnkiGetModelNames() { - return utilIsolate(await utilBackend().anki.getModelNames()); -} - -async function utilAnkiGetDeckNames() { - return utilIsolate(await utilBackend().anki.getDeckNames()); -} - -async function utilDatabaseGetDictionaryInfo() { - return utilIsolate(await utilBackend().translator.database.getDictionaryInfo()); -} - -async function utilDatabaseGetDictionaryCounts(dictionaryNames, getTotal) { - return utilIsolate(await utilBackend().translator.database.getDictionaryCounts( - utilBackgroundIsolate(dictionaryNames), - utilBackgroundIsolate(getTotal) - )); -} - -async function utilAnkiGetModelFieldNames(modelName) { - return utilIsolate(await utilBackend().anki.getModelFieldNames( - utilBackgroundIsolate(modelName) - )); -} - -async function utilDatabasePurge() { - return utilIsolate(await utilBackend().translator.purgeDatabase()); -} - async function utilDatabaseDeleteDictionary(dictionaryName, onProgress) { return utilIsolate(await utilBackend().translator.database.deleteDictionary( utilBackgroundIsolate(dictionaryName), diff --git a/ext/mixed/js/api.js b/ext/mixed/js/api.js index 50b285a5..56e6a715 100644 --- a/ext/mixed/js/api.js +++ b/ext/mixed/js/api.js @@ -120,6 +120,30 @@ function apiGetDefaultAnkiFieldTemplates() { return _apiInvoke('getDefaultAnkiFieldTemplates'); } +function apiGetAnkiDeckNames() { + return _apiInvoke('getAnkiDeckNames'); +} + +function apiGetAnkiModelNames() { + return _apiInvoke('getAnkiModelNames'); +} + +function apiGetAnkiModelFieldNames(modelName) { + return _apiInvoke('getAnkiModelFieldNames', {modelName}); +} + +function apiGetDictionaryInfo() { + return _apiInvoke('getDictionaryInfo'); +} + +function apiGetDictionaryCounts(dictionaryNames, getTotal) { + return _apiInvoke('getDictionaryCounts', {dictionaryNames, getTotal}); +} + +function apiPurgeDatabase() { + return _apiInvoke('purgeDatabase'); +} + function _apiInvoke(action, params={}) { const data = {action, params}; return new Promise((resolve, reject) => { -- cgit v1.2.3 From 7fc3882607f48bb9371649ceacddf2fe278282d2 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 10 Apr 2020 13:44:31 -0400 Subject: Update the parameters passed to various audio-related functions --- ext/bg/js/anki-note-builder.js | 4 ++-- ext/bg/js/audio-uri-builder.js | 26 ++++++++++++-------------- ext/bg/js/backend.js | 22 +++++++--------------- ext/bg/js/settings/audio.js | 7 +------ ext/mixed/js/api.js | 4 ++-- ext/mixed/js/audio-system.js | 21 ++++++++++++--------- ext/mixed/js/display.js | 17 +++++++++-------- 7 files changed, 45 insertions(+), 56 deletions(-) (limited to 'ext/mixed') diff --git a/ext/bg/js/anki-note-builder.js b/ext/bg/js/anki-note-builder.js index 700d8237..9bab095d 100644 --- a/ext/bg/js/anki-note-builder.js +++ b/ext/bg/js/anki-note-builder.js @@ -85,14 +85,14 @@ class AnkiNoteBuilder { }); } - async injectAudio(definition, fields, sources, optionsContext) { + async injectAudio(definition, fields, sources, details) { if (!this._containsMarker(fields, 'audio')) { return; } try { const expressions = definition.expressions; const audioSourceDefinition = Array.isArray(expressions) ? expressions[0] : definition; - const {uri} = await this._audioSystem.getDefinitionAudio(audioSourceDefinition, sources, {tts: false, optionsContext}); + const {uri} = await this._audioSystem.getDefinitionAudio(audioSourceDefinition, sources, details); const filename = this._createInjectedAudioFileName(audioSourceDefinition); if (filename !== null) { definition.audio = {url: uri, filename}; diff --git a/ext/bg/js/audio-uri-builder.js b/ext/bg/js/audio-uri-builder.js index dfd195d8..27e97680 100644 --- a/ext/bg/js/audio-uri-builder.js +++ b/ext/bg/js/audio-uri-builder.js @@ -49,11 +49,11 @@ class AudioUriBuilder { return url; } - async getUri(definition, source, options) { + async getUri(definition, source, details) { const handler = this._getUrlHandlers.get(source); if (typeof handler === 'function') { try { - return await handler(definition, options); + return await handler(definition, details); } catch (e) { // NOP } @@ -132,26 +132,24 @@ class AudioUriBuilder { throw new Error('Failed to find audio URL'); } - async _getUriTextToSpeech(definition, options) { - const voiceURI = options.audio.textToSpeechVoice; - if (!voiceURI) { + async _getUriTextToSpeech(definition, {textToSpeechVoice}) { + if (!textToSpeechVoice) { throw new Error('No voice'); } - - return `tts:?text=${encodeURIComponent(definition.expression)}&voice=${encodeURIComponent(voiceURI)}`; + return `tts:?text=${encodeURIComponent(definition.expression)}&voice=${encodeURIComponent(textToSpeechVoice)}`; } - async _getUriTextToSpeechReading(definition, options) { - const voiceURI = options.audio.textToSpeechVoice; - if (!voiceURI) { + async _getUriTextToSpeechReading(definition, {textToSpeechVoice}) { + if (!textToSpeechVoice) { throw new Error('No voice'); } - - return `tts:?text=${encodeURIComponent(definition.reading || definition.expression)}&voice=${encodeURIComponent(voiceURI)}`; + return `tts:?text=${encodeURIComponent(definition.reading || definition.expression)}&voice=${encodeURIComponent(textToSpeechVoice)}`; } - async _getUriCustom(definition, options) { - const customSourceUrl = options.audio.customSourceUrl; + async _getUriCustom(definition, {customSourceUrl}) { + if (typeof customSourceUrl !== 'string') { + throw new Error('No custom URL defined'); + } return customSourceUrl.replace(/\{([^}]*)\}/g, (m0, m1) => (hasOwn(definition, m1) ? `${definition[m1]}` : m0)); } } diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index a1b788df..79402e67 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -51,8 +51,10 @@ class Backend { this.options = null; this.optionsSchema = null; this.defaultAnkiFieldTemplates = null; - this.audioSystem = new AudioSystem({getAudioUri: this._getAudioUri.bind(this)}); this.audioUriBuilder = new AudioUriBuilder(); + this.audioSystem = new AudioSystem({ + audioUriBuilder: this.audioUriBuilder + }); this.ankiNoteBuilder = new AnkiNoteBuilder({ anki: this.anki, audioSystem: this.audioSystem, @@ -494,11 +496,12 @@ class Backend { const templates = this.defaultAnkiFieldTemplates; if (mode !== 'kanji') { + const {customSourceUrl} = options.audio; await this.ankiNoteBuilder.injectAudio( definition, options.anki.terms.fields, options.audio.sources, - optionsContext + {textToSpeechVoice: null, customSourceUrl} ); } @@ -573,9 +576,8 @@ class Backend { return this._runCommand(command, params); } - async _onApiAudioGetUri({definition, source, optionsContext}) { - const options = this.getOptions(optionsContext); - return await this.audioUriBuilder.getUri(definition, source, options); + async _onApiAudioGetUri({definition, source, details}) { + return await this.audioUriBuilder.getUri(definition, source, details); } _onApiScreenshotGet({options}, sender) { @@ -861,16 +863,6 @@ class Backend { } } - async _getAudioUri(definition, source, details) { - let optionsContext = (typeof details === 'object' && details !== null ? details.optionsContext : null); - if (!(typeof optionsContext === 'object' && optionsContext !== null)) { - optionsContext = this.optionsContext; - } - - const options = this.getOptions(optionsContext); - return await this.audioUriBuilder.getUri(definition, source, options); - } - async _renderTemplate(template, data) { return handlebarsRenderDynamic(template, data); } diff --git a/ext/bg/js/settings/audio.js b/ext/bg/js/settings/audio.js index 3c6e126c..e9aa72e1 100644 --- a/ext/bg/js/settings/audio.js +++ b/ext/bg/js/settings/audio.js @@ -28,12 +28,7 @@ let audioSourceUI = null; let audioSystem = null; async function audioSettingsInitialize() { - audioSystem = new AudioSystem({ - getAudioUri: async (definition, source) => { - const optionsContext = getOptionsContext(); - return await apiAudioGetUri(definition, source, optionsContext); - } - }); + audioSystem = new AudioSystem({audioUriBuilder: null}); const optionsContext = getOptionsContext(); const options = await getOptionsMutable(optionsContext); diff --git a/ext/mixed/js/api.js b/ext/mixed/js/api.js index 7080d93a..c97dc687 100644 --- a/ext/mixed/js/api.js +++ b/ext/mixed/js/api.js @@ -64,8 +64,8 @@ function apiTemplateRender(template, data) { return _apiInvoke('templateRender', {data, template}); } -function apiAudioGetUri(definition, source, optionsContext) { - return _apiInvoke('audioGetUri', {definition, source, optionsContext}); +function apiAudioGetUri(definition, source, details) { + return _apiInvoke('audioGetUri', {definition, source, details}); } function apiCommandExec(command, params) { diff --git a/ext/mixed/js/audio-system.js b/ext/mixed/js/audio-system.js index 45b733fc..574ad3dc 100644 --- a/ext/mixed/js/audio-system.js +++ b/ext/mixed/js/audio-system.js @@ -66,10 +66,10 @@ class TextToSpeechAudio { } class AudioSystem { - constructor({getAudioUri}) { + constructor({audioUriBuilder}) { this._cache = new Map(); this._cacheSizeMaximum = 32; - this._getAudioUri = getAudioUri; + this._audioUriBuilder = audioUriBuilder; if (typeof speechSynthesis !== 'undefined') { // speechSynthesis.getVoices() will not be populated unless some API call is made. @@ -90,7 +90,7 @@ class AudioSystem { if (uri === null) { continue; } try { - const audio = await this._createAudio(uri, details); + const audio = await this._createAudio(uri); this._cacheCheck(); this._cache.set(key, {audio, uri, source}); return {audio, uri, source}; @@ -114,20 +114,23 @@ class AudioSystem { // NOP } - async _createAudio(uri, details) { + async _createAudio(uri) { const ttsParameters = this._getTextToSpeechParameters(uri); if (ttsParameters !== null) { - if (typeof details === 'object' && details !== null) { - if (details.tts === false) { - throw new Error('Text-to-speech not permitted'); - } - } return this.createTextToSpeechAudio(ttsParameters); } return await this._createAudioFromUrl(uri); } + _getAudioUri(definition, source, details) { + return ( + this._audioUriBuilder !== null ? + this._audioUriBuilder.getUri(definition, source, details) : + null + ); + } + _createAudioFromUrl(url) { return new Promise((resolve, reject) => { const audio = new Audio(url); diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 63687dc2..7f3ba859 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -45,7 +45,13 @@ class Display { this.index = 0; this.audioPlaying = null; this.audioFallback = null; - this.audioSystem = new AudioSystem({getAudioUri: this._getAudioUri.bind(this)}); + this.audioSystem = new AudioSystem({ + audioUriBuilder: { + async getUri(definition, source, details) { + return await apiAudioGetUri(definition, source, details); + } + } + }); this.styleNode = null; this.eventListeners = new EventListenerCollection(); @@ -789,10 +795,10 @@ class Display { this.audioPlaying = null; } - const sources = this.options.audio.sources; let audio, source, info; try { - ({audio, source} = await this.audioSystem.getDefinitionAudio(expression, sources)); + const {sources, textToSpeechVoice, customSourceUrl} = this.options.audio; + ({audio, source} = await this.audioSystem.getDefinitionAudio(expression, sources, {textToSpeechVoice, customSourceUrl})); info = `From source ${1 + sources.indexOf(source)}: ${source}`; } catch (e) { if (this.audioFallback === null) { @@ -947,9 +953,4 @@ class Display { } }; } - - async _getAudioUri(definition, source) { - const optionsContext = this.getOptionsContext(); - return await apiAudioGetUri(definition, source, optionsContext); - } } -- cgit v1.2.3 From 823c026533dcd758c2a93038fa526978a5fa9cc3 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 10 Apr 2020 13:51:47 -0400 Subject: Remove de/structuring from public API --- ext/bg/js/settings/audio.js | 2 +- ext/mixed/js/audio-system.js | 5 +++-- 2 files changed, 4 insertions(+), 3 deletions(-) (limited to 'ext/mixed') diff --git a/ext/bg/js/settings/audio.js b/ext/bg/js/settings/audio.js index e9aa72e1..68dfe71e 100644 --- a/ext/bg/js/settings/audio.js +++ b/ext/bg/js/settings/audio.js @@ -110,7 +110,7 @@ function textToSpeechTest() { const text = document.querySelector('#text-to-speech-voice-test').dataset.speechText || ''; const voiceUri = document.querySelector('#text-to-speech-voice').value; - const audio = audioSystem.createTextToSpeechAudio({text, voiceUri}); + const audio = audioSystem.createTextToSpeechAudio(text, voiceUri); audio.volume = 1.0; audio.play(); } catch (e) { diff --git a/ext/mixed/js/audio-system.js b/ext/mixed/js/audio-system.js index 574ad3dc..5366e3e0 100644 --- a/ext/mixed/js/audio-system.js +++ b/ext/mixed/js/audio-system.js @@ -102,7 +102,7 @@ class AudioSystem { throw new Error('Could not create audio'); } - createTextToSpeechAudio({text, voiceUri}) { + createTextToSpeechAudio(text, voiceUri) { const voice = this._getTextToSpeechVoiceFromVoiceUri(voiceUri); if (voice === null) { throw new Error('Invalid text-to-speech voice'); @@ -117,7 +117,8 @@ class AudioSystem { async _createAudio(uri) { const ttsParameters = this._getTextToSpeechParameters(uri); if (ttsParameters !== null) { - return this.createTextToSpeechAudio(ttsParameters); + const {text, voiceUri} = ttsParameters; + return this.createTextToSpeechAudio(text, voiceUri); } return await this._createAudioFromUrl(uri); -- cgit v1.2.3 From e1ebfb02f724518432b2e1c5ec2a80ff03b38fd8 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 10 Apr 2020 16:12:55 -0400 Subject: Disable cache on the backend and fix a bug with the cache key --- ext/bg/js/backend.js | 3 ++- ext/bg/js/settings/audio.js | 5 ++++- ext/mixed/js/audio-system.js | 22 ++++++++++++++-------- ext/mixed/js/display.js | 3 ++- 4 files changed, 22 insertions(+), 11 deletions(-) (limited to 'ext/mixed') diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index 79402e67..9d1fa6c1 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -53,7 +53,8 @@ class Backend { this.defaultAnkiFieldTemplates = null; this.audioUriBuilder = new AudioUriBuilder(); this.audioSystem = new AudioSystem({ - audioUriBuilder: this.audioUriBuilder + audioUriBuilder: this.audioUriBuilder, + useCache: false }); this.ankiNoteBuilder = new AnkiNoteBuilder({ anki: this.anki, diff --git a/ext/bg/js/settings/audio.js b/ext/bg/js/settings/audio.js index 68dfe71e..98ed9b8b 100644 --- a/ext/bg/js/settings/audio.js +++ b/ext/bg/js/settings/audio.js @@ -28,7 +28,10 @@ let audioSourceUI = null; let audioSystem = null; async function audioSettingsInitialize() { - audioSystem = new AudioSystem({audioUriBuilder: null}); + audioSystem = new AudioSystem({ + audioUriBuilder: null, + useCache: true + }); const optionsContext = getOptionsContext(); const options = await getOptionsMutable(optionsContext); diff --git a/ext/mixed/js/audio-system.js b/ext/mixed/js/audio-system.js index 5366e3e0..255a96de 100644 --- a/ext/mixed/js/audio-system.js +++ b/ext/mixed/js/audio-system.js @@ -66,8 +66,8 @@ class TextToSpeechAudio { } class AudioSystem { - constructor({audioUriBuilder}) { - this._cache = new Map(); + constructor({audioUriBuilder, useCache}) { + this._cache = useCache ? new Map() : null; this._cacheSizeMaximum = 32; this._audioUriBuilder = audioUriBuilder; @@ -79,10 +79,14 @@ class AudioSystem { async getDefinitionAudio(definition, sources, details) { const key = `${definition.expression}:${definition.reading}`; - const cacheValue = this._cache.get(definition); - if (typeof cacheValue !== 'undefined') { - const {audio, uri, source} = cacheValue; - return {audio, uri, source}; + const hasCache = (this._cache !== null); + + if (hasCache) { + const cacheValue = this._cache.get(key); + if (typeof cacheValue !== 'undefined') { + const {audio, uri, source} = cacheValue; + return {audio, uri, source}; + } } for (const source of sources) { @@ -91,8 +95,10 @@ class AudioSystem { try { const audio = await this._createAudio(uri); - this._cacheCheck(); - this._cache.set(key, {audio, uri, source}); + if (hasCache) { + this._cacheCheck(); + this._cache.set(key, {audio, uri, source}); + } return {audio, uri, source}; } catch (e) { // NOP diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 7f3ba859..8edae7c9 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -50,7 +50,8 @@ class Display { async getUri(definition, source, details) { return await apiAudioGetUri(definition, source, details); } - } + }, + useCache: true }); this.styleNode = null; -- cgit v1.2.3 From f50aee1021179411322f67c5951eb35de81c5174 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 10 Apr 2020 16:35:43 -0400 Subject: Only return the cached value if it uses a valid source --- ext/mixed/js/audio-system.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'ext/mixed') diff --git a/ext/mixed/js/audio-system.js b/ext/mixed/js/audio-system.js index 255a96de..0ded3490 100644 --- a/ext/mixed/js/audio-system.js +++ b/ext/mixed/js/audio-system.js @@ -85,7 +85,9 @@ class AudioSystem { const cacheValue = this._cache.get(key); if (typeof cacheValue !== 'undefined') { const {audio, uri, source} = cacheValue; - return {audio, uri, source}; + if (sources.includes(source)) { + return {audio, uri, source}; + } } } -- cgit v1.2.3 From 7eb7c88394ebb56936861b91e6b04525abb57490 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 10 Apr 2020 16:38:53 -0400 Subject: Return index of the source instead of the source value --- ext/mixed/js/audio-system.js | 10 ++++++---- ext/mixed/js/display.js | 7 ++++--- 2 files changed, 10 insertions(+), 7 deletions(-) (limited to 'ext/mixed') diff --git a/ext/mixed/js/audio-system.js b/ext/mixed/js/audio-system.js index 0ded3490..94885d34 100644 --- a/ext/mixed/js/audio-system.js +++ b/ext/mixed/js/audio-system.js @@ -85,13 +85,15 @@ class AudioSystem { const cacheValue = this._cache.get(key); if (typeof cacheValue !== 'undefined') { const {audio, uri, source} = cacheValue; - if (sources.includes(source)) { - return {audio, uri, source}; + const index = sources.indexOf(source); + if (index >= 0) { + return {audio, uri, index}; } } } - for (const source of sources) { + for (let i = 0, ii = sources.length; i < ii; ++i) { + const source = sources[i]; const uri = await this._getAudioUri(definition, source, details); if (uri === null) { continue; } @@ -101,7 +103,7 @@ class AudioSystem { this._cacheCheck(); this._cache.set(key, {audio, uri, source}); } - return {audio, uri, source}; + return {audio, uri, index: i}; } catch (e) { // NOP } diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 8edae7c9..5b8d3610 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -796,11 +796,12 @@ class Display { this.audioPlaying = null; } - let audio, source, info; + let audio, info; try { const {sources, textToSpeechVoice, customSourceUrl} = this.options.audio; - ({audio, source} = await this.audioSystem.getDefinitionAudio(expression, sources, {textToSpeechVoice, customSourceUrl})); - info = `From source ${1 + sources.indexOf(source)}: ${source}`; + let index; + ({audio, index} = await this.audioSystem.getDefinitionAudio(expression, sources, {textToSpeechVoice, customSourceUrl})); + info = `From source ${1 + index}: ${sources[index]}`; } catch (e) { if (this.audioFallback === null) { this.audioFallback = new Audio('/mixed/mp3/button.mp3'); -- cgit v1.2.3 From 5c2dff345eb9d4a25cf1022d14e28ba5925b0b10 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 10 Apr 2020 16:43:57 -0400 Subject: Fix button title text not updating correctly in merge mode --- ext/mixed/js/display.js | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) (limited to 'ext/mixed') diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 5b8d3610..d4481349 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -810,7 +810,7 @@ class Display { info = 'Could not find audio'; } - const button = this.audioButtonFindImage(entryIndex); + const button = this.audioButtonFindImage(entryIndex, expressionIndex); if (button !== null) { let titleDefault = button.dataset.titleDefault; if (!titleDefault) { @@ -909,9 +909,16 @@ class Display { viewerButton.dataset.noteId = noteId; } - audioButtonFindImage(index) { + audioButtonFindImage(index, expressionIndex) { const entry = this.getEntry(index); - return entry !== null ? entry.querySelector('.action-play-audio>img') : null; + if (entry === null) { return null; } + + const container = ( + expressionIndex >= 0 ? + entry.querySelector(`.term-expression:nth-of-type(${expressionIndex + 1})`) : + entry + ); + return container !== null ? container.querySelector('.action-play-audio>img') : null; } async getDefinitionsAddable(definitions, modes) { -- cgit v1.2.3 From 92790763d19a5259e4b091b72a51e67f45548685 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Tue, 14 Apr 2020 18:22:51 -0400 Subject: Update style --- ext/mixed/js/display.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'ext/mixed') diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index d4481349..f30a65e6 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -47,7 +47,7 @@ class Display { this.audioFallback = null; this.audioSystem = new AudioSystem({ audioUriBuilder: { - async getUri(definition, source, details) { + getUri: async (definition, source, details) => { return await apiAudioGetUri(definition, source, details); } }, -- cgit v1.2.3 From fcbfde506abf6ca3474d2dfdf4f337b86b0bb579 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 17 Apr 2020 17:48:55 -0400 Subject: Await and handle errors from audio.play() --- ext/mixed/js/audio-system.js | 2 +- ext/mixed/js/display.js | 9 ++++++++- 2 files changed, 9 insertions(+), 2 deletions(-) (limited to 'ext/mixed') diff --git a/ext/mixed/js/audio-system.js b/ext/mixed/js/audio-system.js index 94885d34..3273f982 100644 --- a/ext/mixed/js/audio-system.js +++ b/ext/mixed/js/audio-system.js @@ -40,7 +40,7 @@ class TextToSpeechAudio { } } - play() { + async play() { try { if (this._utterance === null) { this._utterance = new SpeechSynthesisUtterance(this.text || ''); diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index f30a65e6..b4a93d99 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -823,7 +823,14 @@ class Display { this.audioPlaying = audio; audio.currentTime = 0; audio.volume = this.options.audio.volume / 100.0; - audio.play(); + const playPromise = audio.play(); + if (typeof playPromise !== 'undefined') { + try { + await playPromise; + } catch (e2) { + // NOP + } + } } catch (e) { this.onError(e); } finally { -- cgit v1.2.3 From 320852f2d01d72c1039d098033081e8266d02be7 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Fri, 17 Apr 2020 18:00:28 -0400 Subject: Fix overlapping audio.play calls due to await --- ext/mixed/js/display.js | 14 ++++++++++---- 1 file changed, 10 insertions(+), 4 deletions(-) (limited to 'ext/mixed') diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index b4a93d99..c2284ffe 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -791,10 +791,7 @@ class Display { const expression = expressionIndex === -1 ? definition : definition.expressions[expressionIndex]; - if (this.audioPlaying !== null) { - this.audioPlaying.pause(); - this.audioPlaying = null; - } + this._stopPlayingAudio(); let audio, info; try { @@ -820,6 +817,8 @@ class Display { button.title = `${titleDefault}\n${info}`; } + this._stopPlayingAudio(); + this.audioPlaying = audio; audio.currentTime = 0; audio.volume = this.options.audio.volume / 100.0; @@ -838,6 +837,13 @@ class Display { } } + _stopPlayingAudio() { + if (this.audioPlaying !== null) { + this.audioPlaying.pause(); + this.audioPlaying = null; + } + } + noteUsesScreenshot(mode) { const optionsAnki = this.options.anki; const fields = (mode === 'kanji' ? optionsAnki.kanji : optionsAnki.terms).fields; -- cgit v1.2.3 From 350a1139968ec3db4da95cd27c4ce8b5be45c56a Mon Sep 17 00:00:00 2001 From: siikamiika Date: Sat, 18 Apr 2020 02:05:18 +0300 Subject: use getFullscreenElement to check fullscreen --- ext/fg/js/frontend-initialize.js | 3 ++- ext/fg/js/popup.js | 13 ++----------- ext/mixed/js/dom.js | 10 ++++++++++ 3 files changed, 14 insertions(+), 12 deletions(-) (limited to 'ext/mixed') diff --git a/ext/fg/js/frontend-initialize.js b/ext/fg/js/frontend-initialize.js index 2e63c29f..2df59e20 100644 --- a/ext/fg/js/frontend-initialize.js +++ b/ext/fg/js/frontend-initialize.js @@ -16,6 +16,7 @@ */ /* global + * DOM * FrameOffsetForwarder * Frontend * PopupProxy @@ -95,7 +96,7 @@ async function main() { } let popup; - if (isIframe && options.general.showIframePopupsInRootFrame && !document.fullscreen && iframePopupsInRootFrameAvailable) { + if (isIframe && options.general.showIframePopupsInRootFrame && DOM.getFullscreenElement() === null && iframePopupsInRootFrameAvailable) { popup = popups.iframe || await createIframePopupProxy(url, frameOffsetForwarder, disableIframePopupsInRootFrame); popups.iframe = popup; } else if (proxy) { diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index 99610e17..ae158263 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -16,6 +16,7 @@ */ /* global + * DOM * apiGetMessageToken * apiInjectStylesheet */ @@ -271,7 +272,7 @@ class Popup { } _onFullscreenChanged() { - const parent = (Popup._getFullscreenElement() || document.body || null); + const parent = (DOM.getFullscreenElement() || document.body || null); if (parent !== null && this._container.parentNode !== parent) { parent.appendChild(this._container); } @@ -365,16 +366,6 @@ class Popup { contentWindow.postMessage({action, params, token}, this._targetOrigin); } - static _getFullscreenElement() { - return ( - document.fullscreenElement || - document.msFullscreenElement || - document.mozFullScreenElement || - document.webkitFullscreenElement || - null - ); - } - static _getPositionForHorizontalText(elementRect, width, height, viewport, offsetScale, optionsGeneral) { const preferBelow = (optionsGeneral.popupHorizontalTextPosition === 'below'); const horizontalOffset = optionsGeneral.popupHorizontalOffset * offsetScale; diff --git a/ext/mixed/js/dom.js b/ext/mixed/js/dom.js index 03acbb80..31ba33d6 100644 --- a/ext/mixed/js/dom.js +++ b/ext/mixed/js/dom.js @@ -62,4 +62,14 @@ class DOM { default: return false; } } + + static getFullscreenElement() { + return ( + document.fullscreenElement || + document.msFullscreenElement || + document.mozFullScreenElement || + document.webkitFullscreenElement || + null + ); + } } -- cgit v1.2.3 From fd6ea0e404da2657f110599061af4034a524283a Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 11 Apr 2020 14:23:02 -0400 Subject: Add API for getting media data --- ext/bg/js/backend.js | 7 ++++++- ext/bg/js/database.js | 32 ++++++++++++++++++++++++++++++++ ext/mixed/js/api.js | 4 ++++ 3 files changed, 42 insertions(+), 1 deletion(-) (limited to 'ext/mixed') diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index e0814c17..8a19203f 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -111,7 +111,8 @@ class Backend { ['getAnkiModelFieldNames', {handler: this._onApiGetAnkiModelFieldNames.bind(this), async: true}], ['getDictionaryInfo', {handler: this._onApiGetDictionaryInfo.bind(this), async: true}], ['getDictionaryCounts', {handler: this._onApiGetDictionaryCounts.bind(this), async: true}], - ['purgeDatabase', {handler: this._onApiPurgeDatabase.bind(this), async: true}] + ['purgeDatabase', {handler: this._onApiPurgeDatabase.bind(this), async: true}], + ['getMedia', {handler: this._onApiGetMedia.bind(this), async: true}] ]); this._commandHandlers = new Map([ @@ -762,6 +763,10 @@ class Backend { return await this.translator.purgeDatabase(); } + async _onApiGetMedia({targets}) { + return await this.database.getMedia(targets); + } + // Command handlers async _onCommandSearch(params) { diff --git a/ext/bg/js/database.js b/ext/bg/js/database.js index 0c7eee6a..16612403 100644 --- a/ext/bg/js/database.js +++ b/ext/bg/js/database.js @@ -277,6 +277,34 @@ class Database { return result; } + async getMedia(targets) { + this._validate(); + + const count = targets.length; + const promises = []; + const results = new Array(count).fill(null); + const createResult = Database._createMedia; + const processRow = (row, [index, dictionaryName]) => { + if (row.dictionary === dictionaryName) { + results[index] = createResult(row, index); + } + }; + + const transaction = this.db.transaction(['media'], 'readonly'); + const objectStore = transaction.objectStore('media'); + const index = objectStore.index('path'); + + for (let i = 0; i < count; ++i) { + const {path, dictionaryName} = targets[i]; + const only = IDBKeyRange.only(path); + promises.push(Database._getAll(index, only, [i, dictionaryName], processRow)); + } + + await Promise.all(promises); + + return results; + } + async getDictionaryInfo() { this._validate(); @@ -441,6 +469,10 @@ class Database { return {character, mode, data, dictionary, index}; } + static _createMedia(row, index) { + return Object.assign({}, row, {index}); + } + static _getAll(dbIndex, query, context, processRow) { const fn = typeof dbIndex.getAll === 'function' ? Database._getAllFast : Database._getAllUsingCursor; return fn(dbIndex, query, context, processRow); diff --git a/ext/mixed/js/api.js b/ext/mixed/js/api.js index c97dc687..52f41646 100644 --- a/ext/mixed/js/api.js +++ b/ext/mixed/js/api.js @@ -140,6 +140,10 @@ function apiPurgeDatabase() { return _apiInvoke('purgeDatabase'); } +function apiGetMedia(targets) { + return _apiInvoke('getMedia', {targets}); +} + function _apiInvoke(action, params={}) { const data = {action, params}; return new Promise((resolve, reject) => { -- cgit v1.2.3 From ac603d54a3a53bec2881199756f3dd6a1aa44057 Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Sat, 11 Apr 2020 14:23:49 -0400 Subject: Add support for displaying images --- ext/bg/search.html | 1 + ext/fg/float.html | 1 + ext/mixed/css/display-dark.css | 7 +++ ext/mixed/css/display-default.css | 7 +++ ext/mixed/css/display.css | 96 ++++++++++++++++++++++++++++++++++ ext/mixed/display-templates.html | 1 + ext/mixed/js/display-generator.js | 85 ++++++++++++++++++++++++++++-- ext/mixed/js/display.js | 6 ++- ext/mixed/js/media-loader.js | 107 ++++++++++++++++++++++++++++++++++++++ 9 files changed, 306 insertions(+), 5 deletions(-) create mode 100644 ext/mixed/js/media-loader.js (limited to 'ext/mixed') diff --git a/ext/bg/search.html b/ext/bg/search.html index eacc1893..fe88e264 100644 --- a/ext/bg/search.html +++ b/ext/bg/search.html @@ -85,6 +85,7 @@ + diff --git a/ext/fg/float.html b/ext/fg/float.html index 3ccf68eb..c8ea9b67 100644 --- a/ext/fg/float.html +++ b/ext/fg/float.html @@ -51,6 +51,7 @@ + diff --git a/ext/mixed/css/display-dark.css b/ext/mixed/css/display-dark.css index e4549bbf..acfa2782 100644 --- a/ext/mixed/css/display-dark.css +++ b/ext/mixed/css/display-dark.css @@ -94,3 +94,10 @@ h2 { border-bottom-color: #2f2f2f; } #term-pitch-accent-graph-dot-downstep>circle:last-of-type { fill: #ffffff; } + +.term-glossary-image-container { + background-color: #2f2f2f; +} +.term-glossary-image-container-overlay { + color: #888888; +} diff --git a/ext/mixed/css/display-default.css b/ext/mixed/css/display-default.css index 7bcb1014..70f81eb6 100644 --- a/ext/mixed/css/display-default.css +++ b/ext/mixed/css/display-default.css @@ -94,3 +94,10 @@ h2 { border-bottom-color: #eeeeee; } #term-pitch-accent-graph-dot-downstep>circle:last-of-type { fill: #000000; } + +.term-glossary-image-container { + background-color: #eeeeee; +} +.term-glossary-image-container-overlay { + color: #777777; +} diff --git a/ext/mixed/css/display.css b/ext/mixed/css/display.css index d1a54064..ca1fa371 100644 --- a/ext/mixed/css/display.css +++ b/ext/mixed/css/display.css @@ -611,6 +611,102 @@ button.action-button { stroke-width: 5; } +.term-glossary-image-container { + display: inline-block; + white-space: nowrap; + max-width: 100%; + position: relative; + vertical-align: top; + line-height: 0; + font-size: 0.07142857em; /* 14px => 1px */ + overflow: hidden; +} + +.term-glossary-image-link { + cursor: inherit; + color: inherit; +} + +.term-glossary-image-link[href]:hover { + cursor: pointer; +} + +.term-glossary-image-container-overlay { + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + font-size: 14em; /* 1px => 14px; */ + line-height: 1.42857143; /* 14px => 20px */ + display: table; + table-layout: fixed; + white-space: normal; +} + +.term-glossary-item[data-has-image=true][data-image-load-state=load-error] .term-glossary-image-container-overlay:after { + content: "Image failed to load"; + display: table-cell; + width: 100%; + height: 100%; + vertical-align: middle; + text-align: center; + padding: 0.25em; +} + +.term-glossary-image { + display: inline-block; + position: absolute; + left: 0; + top: 0; + width: 100%; + height: 100%; + vertical-align: top; + object-fit: contain; + border: none; + outline: none; +} + +.term-glossary-image:not([src]) { + display: none; +} + +.term-glossary-image[data-pixelated=true] { + image-rendering: auto; + image-rendering: -moz-crisp-edges; + image-rendering: -webkit-optimize-contrast; + image-rendering: pixelated; + image-rendering: crisp-edges; +} + +.term-glossary-image-aspect-ratio-sizer { + content: ""; + display: inline-block; + width: 0; + vertical-align: top; + font-size: 0; +} + +.term-glossary-image-link-text:before { + content: "["; +} + +.term-glossary-image-link-text:after { + content: "]"; +} + +:root[data-compact-glossaries=true] .term-glossary-image-container { + display: none; +} + +:root:not([data-compact-glossaries=true]) .term-glossary-image-link-text { + display: none; +} + +:root:not([data-compact-glossaries=true]) .term-glossary-image-description { + display: block; +} + /* * Kanji diff --git a/ext/mixed/display-templates.html b/ext/mixed/display-templates.html index 3baa8293..5ecf2240 100644 --- a/ext/mixed/display-templates.html +++ b/ext/mixed/display-templates.html @@ -35,6 +35,7 @@ + - +