From 0f0adf750c8cde668cdcf369cbe0ac173a9edf3f Mon Sep 17 00:00:00 2001 From: toasted-nutbread Date: Thu, 15 Aug 2019 19:39:58 -0400 Subject: Add ability to save screenshot to anki cards --- ext/bg/js/anki.js | 5 ++++ ext/bg/js/api.js | 68 ++++++++++++++++++++++++++++++++++++++++++++++++- ext/bg/js/backend.js | 12 +++++++-- ext/bg/js/dictionary.js | 3 ++- ext/bg/js/options.js | 9 +++++++ ext/bg/js/settings.js | 3 ++- ext/fg/js/api.js | 12 ++++++--- ext/fg/js/frontend.js | 4 +++ ext/fg/js/popup.js | 8 ++++++ ext/mixed/js/display.js | 43 ++++++++++++++++++++++++++++++- 10 files changed, 157 insertions(+), 10 deletions(-) diff --git a/ext/bg/js/anki.js b/ext/bg/js/anki.js index 183f37bc..bd4e46cd 100644 --- a/ext/bg/js/anki.js +++ b/ext/bg/js/anki.js @@ -58,6 +58,11 @@ class AnkiConnect { return await this.ankiInvoke('guiBrowse', {query}); } + async storeMediaFile(filename, dataBase64) { + await this.checkVersion(); + return await this.ankiInvoke('storeMediaFile', {filename, data: dataBase64}); + } + async checkVersion() { if (this.remoteVersion < this.localVersion) { this.remoteVersion = await this.ankiInvoke('version'); diff --git a/ext/bg/js/api.js b/ext/bg/js/api.js index de3ad64e..c33ba709 100644 --- a/ext/bg/js/api.js +++ b/ext/bg/js/api.js @@ -53,7 +53,7 @@ async function apiKanjiFind(text) { return definitions.slice(0, options.general.maxResults); } -async function apiDefinitionAdd(definition, mode) { +async function apiDefinitionAdd(definition, mode, context) { const options = utilBackend().options; if (mode !== 'kanji') { @@ -64,6 +64,14 @@ async function apiDefinitionAdd(definition, mode) { ); } + if (context.screenshot) { + await apiInjectScreenshot( + definition, + options.anki.terms.fields, + context.screenshot + ); + } + const note = await dictNoteFormat(definition, mode, options); return utilBackend().anki.addNote(note); } @@ -139,3 +147,61 @@ async function apiCommandExec(command) { async function apiAudioGetUrl(definition, source) { return audioBuildUrl(definition, source); } + +async function apiInjectScreenshot(definition, fields, screenshot) { + let usesScreenshot = false; + for (const name in fields) { + if (fields[name].includes('{screenshot}')) { + usesScreenshot = true; + break; + } + } + + if (!usesScreenshot) { + return; + } + + const dateToString = (date) => { + const year = date.getUTCFullYear(); + const month = date.getUTCMonth().toString().padStart(2, '0'); + const day = date.getUTCDate().toString().padStart(2, '0'); + const hours = date.getUTCHours().toString().padStart(2, '0'); + const minutes = date.getUTCMinutes().toString().padStart(2, '0'); + const seconds = date.getUTCSeconds().toString().padStart(2, '0'); + return `${year}-${month}-${day}-${hours}-${minutes}-${seconds}`; + }; + + const now = new Date(Date.now()); + const filename = `yomichan_browser_screenshot_${definition.reading}_${dateToString(now)}.${screenshot.format}`; + const data = screenshot.dataUrl.replace(/^data:[\w\W]*?,/, ''); + + try { + await utilBackend().anki.storeMediaFile(filename, data); + } catch (e) { + return; + } + + definition.screenshotFileName = filename; +} + +function apiScreenshotGet(options, sender) { + if (!(sender && sender.tab)) { + return Promise.resolve(); + } + + const windowId = sender.tab.windowId; + return new Promise((resolve) => { + chrome.tabs.captureVisibleTab(windowId, options, (dataUrl) => resolve(dataUrl)); + }); +} + +function apiForward(action, params, sender) { + if (!(sender && sender.tab)) { + return Promise.resolve(); + } + + const tabId = sender.tab.id; + return new Promise((resolve) => { + chrome.tabs.sendMessage(tabId, {action, params}, (response) => resolve(response)); + }); +} diff --git a/ext/bg/js/backend.js b/ext/bg/js/backend.js index c191a150..d49286d0 100644 --- a/ext/bg/js/backend.js +++ b/ext/bg/js/backend.js @@ -94,8 +94,8 @@ class Backend { forward(apiTermsFind(text), callback); }, - definitionAdd: ({definition, mode, callback}) => { - forward(apiDefinitionAdd(definition, mode), callback); + definitionAdd: ({definition, mode, context, callback}) => { + forward(apiDefinitionAdd(definition, mode, context), callback); }, definitionsAddable: ({definitions, modes, callback}) => { @@ -116,6 +116,14 @@ class Backend { audioGetUrl: ({definition, source, callback}) => { forward(apiAudioGetUrl(definition, source), callback); + }, + + screenshotGet: ({options}) => { + forward(apiScreenshotGet(options, sender), callback); + }, + + forward: ({action, params}) => { + forward(apiForward(action, params, sender), callback); } }; diff --git a/ext/bg/js/dictionary.js b/ext/bg/js/dictionary.js index 368bb18d..49afc368 100644 --- a/ext/bg/js/dictionary.js +++ b/ext/bg/js/dictionary.js @@ -343,7 +343,8 @@ async function dictFieldFormat(field, definition, mode, options) { 'reading', 'sentence', 'tags', - 'url' + 'url', + 'screenshot' ]; for (const marker of markers) { diff --git a/ext/bg/js/options.js b/ext/bg/js/options.js index f1fc2cf8..96e390f4 100644 --- a/ext/bg/js/options.js +++ b/ext/bg/js/options.js @@ -175,6 +175,10 @@ function optionsFieldTemplates() { {{definition.url}} {{/inline}} +{{#*inline "screenshot"}} + +{{/inline}} + {{~> (lookup . "marker") ~}} `.trim(); } @@ -283,6 +287,11 @@ function optionsVersion(options) { if (utilStringHashCode(options.anki.fieldTemplates) === 1285806040) { options.anki.fieldTemplates = optionsFieldTemplates(); } + }, + () => { + if (utilStringHashCode(options.anki.fieldTemplates) === -250091611) { + options.anki.fieldTemplates = optionsFieldTemplates(); + } } ]; diff --git a/ext/bg/js/settings.js b/ext/bg/js/settings.js index 953120da..594d53f7 100644 --- a/ext/bg/js/settings.js +++ b/ext/bg/js/settings.js @@ -505,7 +505,8 @@ async function ankiFieldsPopulate(element, options) { 'reading', 'sentence', 'tags', - 'url' + 'url', + 'screenshot' ], 'kanji': [ 'character', diff --git a/ext/fg/js/api.js b/ext/fg/js/api.js index 4b4d9d74..0c86b412 100644 --- a/ext/fg/js/api.js +++ b/ext/fg/js/api.js @@ -33,8 +33,8 @@ function apiKanjiFind(text) { return utilInvoke('kanjiFind', {text}); } -function apiDefinitionAdd(definition, mode) { - return utilInvoke('definitionAdd', {definition, mode}); +function apiDefinitionAdd(definition, mode, context) { + return utilInvoke('definitionAdd', {definition, mode, context}); } function apiDefinitionsAddable(definitions, modes) { @@ -53,6 +53,10 @@ function apiCommandExec(command) { return utilInvoke('commandExec', {command}); } -function apiAudioGetUrl(definition, source) { - return utilInvoke('audioGetUrl', {definition, source}); +function apiScreenshotGet(options) { + return utilInvoke('screenshotGet', {options}); +} + +function apiForward(action, params) { + return utilInvoke('forward', {action, params}); } diff --git a/ext/fg/js/frontend.js b/ext/fg/js/frontend.js index bd652f3b..bafd06bd 100644 --- a/ext/fg/js/frontend.js +++ b/ext/fg/js/frontend.js @@ -244,6 +244,10 @@ class Frontend { if (!this.options.enable) { this.searchClear(); } + }, + + popupSetVisible: ({visible}) => { + this.popup.setVisible(visible); } }; diff --git a/ext/fg/js/popup.js b/ext/fg/js/popup.js index c8cc9baa..18dc0386 100644 --- a/ext/fg/js/popup.js +++ b/ext/fg/js/popup.js @@ -113,6 +113,14 @@ class Popup { return this.injected && this.container.style.visibility !== 'hidden'; } + setVisible(visible) { + if (visible) { + this.container.style.setProperty('display', ''); + } else { + this.container.style.setProperty('display', 'none', 'important'); + } + } + containsPoint(point) { if (!this.isVisible()) { return false; diff --git a/ext/mixed/js/display.js b/ext/mixed/js/display.js index 3bb78fe1..eeb42040 100644 --- a/ext/mixed/js/display.js +++ b/ext/mixed/js/display.js @@ -432,7 +432,15 @@ class Display { try { this.spinner.show(); - const noteId = await apiDefinitionAdd(definition, mode); + const context = {}; + if (this.noteUsesScreenshot()) { + const screenshot = await this.getScreenshot(); + if (screenshot) { + context.screenshot = screenshot; + } + } + + const noteId = await apiDefinitionAdd(definition, mode, context); if (noteId) { const index = this.definitions.indexOf(definition); Display.adderButtonFind(index, mode).addClass('disabled'); @@ -485,10 +493,39 @@ class Display { } } + noteUsesScreenshot() { + const fields = this.options.anki.terms.fields; + for (const name in fields) { + if (fields[name].includes('{screenshot}')) { + return true; + } + } + return false; + } + + async getScreenshot() { + try { + await this.setPopupVisible(false); + await Display.delay(1); // Wait for popup to be hidden. + + const format = 'png'; + const dataUrl = await apiScreenshotGet({format}); + if (!dataUrl || dataUrl.error) { return; } + + return {dataUrl, format}; + } finally { + await this.setPopupVisible(true); + } + } + get firstExpressionIndex() { return this.options.general.resultOutputMode === 'merge' ? 0 : -1; } + setPopupVisible(visible) { + return apiForward('popupSetVisible', {visible}); + } + static clozeBuild(sentence, source) { const result = { sentence: sentence.text.trim() @@ -514,4 +551,8 @@ class Display { static viewerButtonFind(index) { return $('.entry').eq(index).find('.action-view-note'); } + + static delay(time) { + return new Promise((resolve) => setTimeout(resolve, time)); + } } -- cgit v1.2.3