aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--ext/bg/js/anki.js5
-rw-r--r--ext/bg/js/api.js68
-rw-r--r--ext/bg/js/backend.js12
-rw-r--r--ext/bg/js/dictionary.js3
-rw-r--r--ext/bg/js/options.js10
-rw-r--r--ext/bg/js/settings.js7
-rw-r--r--ext/bg/settings.html13
-rw-r--r--ext/fg/js/api.js12
-rw-r--r--ext/fg/js/frontend.js4
-rw-r--r--ext/fg/js/popup.js8
-rw-r--r--ext/mixed/js/display.js43
11 files changed, 175 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..29d8a215 100644
--- a/ext/bg/js/options.js
+++ b/ext/bg/js/options.js
@@ -175,6 +175,10 @@ function optionsFieldTemplates() {
<a href="{{definition.url}}">{{definition.url}}</a>
{{/inline}}
+{{#*inline "screenshot"}}
+ <img src="{{definition.screenshotFileName}}" />
+{{/inline}}
+
{{~> (lookup . "marker") ~}}
`.trim();
}
@@ -220,6 +224,7 @@ function optionsSetDefaults(options) {
server: 'http://127.0.0.1:8765',
tags: ['yomichan'],
sentenceExt: 200,
+ screenshot: {format: 'png', quality: 92},
terms: {deck: '', model: '', fields: {}},
kanji: {deck: '', model: '', fields: {}},
fieldTemplates: optionsFieldTemplates()
@@ -283,6 +288,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..75082f3e 100644
--- a/ext/bg/js/settings.js
+++ b/ext/bg/js/settings.js
@@ -51,6 +51,8 @@ async function formRead() {
optionsNew.anki.tags = $('#card-tags').val().split(/[,; ]+/);
optionsNew.anki.sentenceExt = parseInt($('#sentence-detection-extent').val(), 10);
optionsNew.anki.server = $('#interface-server').val();
+ optionsNew.anki.screenshot.format = $('#screenshot-format').val();
+ optionsNew.anki.screenshot.quality = parseInt($('#screenshot-quality').val(), 10);
optionsNew.anki.fieldTemplates = $('#field-templates').val();
if (optionsOld.anki.enable && !ankiErrorShown()) {
@@ -188,6 +190,8 @@ async function onReady() {
$('#card-tags').val(options.anki.tags.join(' '));
$('#sentence-detection-extent').val(options.anki.sentenceExt);
$('#interface-server').val(options.anki.server);
+ $('#screenshot-format').val(options.anki.screenshot.format);
+ $('#screenshot-quality').val(options.anki.screenshot.quality);
$('#field-templates').val(options.anki.fieldTemplates);
$('#field-templates-reset').click(utilAsync(onAnkiFieldTemplatesReset));
$('input, select, textarea').not('.anki-model').change(utilAsync(onFormOptionsChanged));
@@ -505,7 +509,8 @@ async function ankiFieldsPopulate(element, options) {
'reading',
'sentence',
'tags',
- 'url'
+ 'url',
+ 'screenshot'
],
'kanji': [
'character',
diff --git a/ext/bg/settings.html b/ext/bg/settings.html
index 086d67d2..c6677018 100644
--- a/ext/bg/settings.html
+++ b/ext/bg/settings.html
@@ -293,6 +293,19 @@
<input type="text" id="interface-server" class="form-control">
</div>
+ <div class="form-group options-advanced">
+ <label for="screenshot-format">Screenshot format</label>
+ <select class="form-control" id="screenshot-format">
+ <option value="png">PNG</option>
+ <option value="jpeg">JPEG</option>
+ </select>
+ </div>
+
+ <div class="form-group options-advanced">
+ <label for="screenshot-quality">Screenshot quality (JPEG only)</label>
+ <input type="number" min="0" max="100" step="1" id="screenshot-quality" class="form-control">
+ </div>
+
<div id="anki-format">
<p class="help-block">
Specify the information you would like included in your flashcards in the field editor below.
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 97849a09..25dd38e1 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 8433c4b5..01cb406e 100644
--- a/ext/mixed/js/display.js
+++ b/ext/mixed/js/display.js
@@ -435,7 +435,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');
@@ -488,10 +496,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, quality} = this.options.anki.screenshot;
+ const dataUrl = await apiScreenshotGet({format, quality});
+ 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()
@@ -517,4 +554,8 @@ class Display {
static viewerButtonFind(index) {
return $('.entry').eq(index).find('.action-view-note');
}
+
+ static delay(time) {
+ return new Promise((resolve) => setTimeout(resolve, time));
+ }
}