alex/yomichan
1
Fork 0
Code Releases Activity

Anki note media injection move (#801)

Browse Source 
* Move anki note media injection functionality into Backend

* Add marker/mode checks

* Remove media injection from AnkiNoteBuilder
This commit is contained in:
toasted-nutbread 2020-09-10 15:04:54 -04:00 committed by GitHub
parent 52b0feb255
commit 3dd4822ab3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 170 additions and 164 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

168
ext/bg/js/anki-note-builder.js
View File

@ -20,11 +20,8 @@
*/
class AnkiNoteBuilder {
constructor({renderTemplate, getDefinitionAudio=null, getClipboardImage=null, getScreenshot=null}) {
constructor({renderTemplate}) {
this._renderTemplate = renderTemplate;
this._getDefinitionAudio = getDefinitionAudio;
this._getClipboardImage = getClipboardImage;
this._getScreenshot = getScreenshot;
}
async createNote({
@ -74,6 +71,16 @@ class AnkiNoteBuilder {
return note;
}
containsMarker(fields, marker) {
marker = `{${marker}}`;
for (const fieldValue of Object.values(fields)) {
if (fieldValue.includes(marker)) {
return true;
}
}
return false;
}
// Private
_createNoteData(definition, mode, context, resultOutputMode, compactGlossaries) {
@ -106,159 +113,6 @@ class AnkiNoteBuilder {
});
}
async _injectMedia(anki, definition, fields, mode, audioDetails, screenshotDetails, clipboardImage) {
if (screenshotDetails !== null) {
await this._injectScreenshot(anki, definition, fields, screenshotDetails);
}
if (clipboardImage) {
await this._injectClipboardImage(anki, definition, fields);
}
if (mode !== 'kanji' && audioDetails !== null) {
await this._injectAudio(anki, definition, fields, audioDetails);
}
}
async _injectAudio(anki, definition, fields, details) {
if (!this._containsMarker(fields, 'audio')) { return; }
try {
const {sources, customSourceUrl} = details;
const expressions = definition.expressions;
const {expression, reading} = Array.isArray(expressions) ? expressions[0] : definition;
let fileName = this._createInjectedAudioFileName(expression, reading);
if (fileName === null) { return; }
fileName = this._replaceInvalidFileNameCharacters(fileName);
const {audio: data} = await this._getDefinitionAudio(
sources,
expression,
reading,
{
textToSpeechVoice: null,
customSourceUrl,
binary: true,
disableCache: true
}
);
await anki.storeMediaFile(fileName, data);
definition.audioFileName = fileName;
} catch (e) {
// NOP
}
}
async _injectScreenshot(anki, definition, fields, details) {
if (!this._containsMarker(fields, 'screenshot')) { return; }
const reading = definition.reading;
const now = new Date(Date.now());
try {
const {windowId, tabId, ownerFrameId, format, quality} = details;
const dataUrl = await this._getScreenshot(windowId, tabId, ownerFrameId, format, quality);
const {mediaType, data} = this._getDataUrlInfo(dataUrl);
const extension = this._getImageExtensionFromMediaType(mediaType);
if (extension === null) { return; }
let fileName = `yomichan_browser_screenshot_${reading}_${this._dateToString(now)}.${extension}`;
fileName = this._replaceInvalidFileNameCharacters(fileName);
await anki.storeMediaFile(fileName, data);
definition.screenshotFileName = fileName;
} catch (e) {
// NOP
}
}
async _injectClipboardImage(anki, definition, fields) {
if (!this._containsMarker(fields, 'clipboard-image')) { return; }
const reading = definition.reading;
const now = new Date(Date.now());
try {
const dataUrl = await this._getClipboardImage();
if (dataUrl === null) { return; }
const {mediaType, data} = this._getDataUrlInfo(dataUrl);
const extension = this._getImageExtensionFromMediaType(mediaType);
if (extension === null) { return; }
let fileName = `yomichan_clipboard_image_${reading}_${this._dateToString(now)}.${extension}`;
fileName = this._replaceInvalidFileNameCharacters(fileName);
await anki.storeMediaFile(fileName, data);
definition.clipboardImageFileName = fileName;
} catch (e) {
// NOP
}
}
_createInjectedAudioFileName(expression, reading) {
if (!reading && !expression) { return null; }
let fileName = 'yomichan';
if (reading) { fileName += `_${reading}`; }
if (expression) { fileName += `_${expression}`; }
fileName += '.mp3';
fileName = fileName.replace(/\]/g, '');
return fileName;
}
_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}`;
}
_containsMarker(fields, marker) {
marker = `{${marker}}`;
for (const fieldValue of Object.values(fields)) {
if (fieldValue.includes(marker)) {
return true;
}
}
return false;
}
_getDataUrlInfo(dataUrl) {
const match = /^data:([^,]*?)(;base64)?,/.exec(dataUrl);
if (match === null) {
throw new Error('Invalid data URL');
}
let mediaType = match[1];
if (mediaType.length === 0) { mediaType = 'text/plain'; }
let data = dataUrl.substring(match[0].length);
if (typeof match[2] === 'undefined') { data = btoa(data); }
return {mediaType, data};
}
_getImageExtensionFromMediaType(mediaType) {
switch (mediaType.toLowerCase()) {
case 'image/png': return 'png';
case 'image/jpeg': return 'jpeg';
default: return null;
}
}
_replaceInvalidFileNameCharacters(fileName) {
// eslint-disable-next-line no-control-regex
return fileName.replace(/[<>:"/\\|?*\x00-\x1F]/g, '-');
}
_stringReplaceAsync(str, regex, replacer) {
let match;
let index = 0;

163
ext/bg/js/backend.js
View File

@ -58,10 +58,7 @@ class Backend {
useCache: false
});
this._ankiNoteBuilder = new AnkiNoteBuilder({
renderTemplate: this._renderTemplate.bind(this),
getDefinitionAudio: this._getDefinitionAudio.bind(this),
getClipboardImage: this._onApiClipboardImageGet.bind(this),
getScreenshot: this._getScreenshot.bind(this)
renderTemplate: this._renderTemplate.bind(this)
});
this._templateRenderer = new TemplateRenderer();
@ -1584,8 +1581,29 @@ class Backend {
const modeOptions = (mode === 'kanji') ? kanji : terms;
const {windowId, tabId, ownerFrameId} = (isObject(screenshotTarget) ? screenshotTarget : {});
if (injectMedia) {
const fields = modeOptions.fields;
const timestamp = Date.now();
const definitionExpressions = definition.expressions;
const {expression, reading} = Array.isArray(definitionExpressions) ? definitionExpressions[0] : definition;
const audioDetails = (mode !== 'kanji' && this._ankiNoteBuilder.containsMarker(fields, 'audio') ? {sources, customSourceUrl} : null);
const screenshotDetails = (this._ankiNoteBuilder.containsMarker(fields, 'screenshot') ? {windowId, tabId, ownerFrameId, format, quality} : null);
const clipboardImage = (this._ankiNoteBuilder.containsMarker(fields, 'clipboard-image'));
const {screenshotFileName, clipboardImageFileName, audioFileName} = await this._injectAnkNoteMedia(
this._anki,
expression,
reading,
timestamp,
audioDetails,
screenshotDetails,
clipboardImage
);
if (screenshotFileName !== null) { definition.screenshotFileName = screenshotFileName; }
if (clipboardImageFileName !== null) { definition.clipboardImageFileName = clipboardImageFileName; }
if (audioFileName !== null) { definition.audioFileName = audioFileName; }
}
return await this._ankiNoteBuilder.createNote({
anki: injectMedia ? this._anki : null,
definition,
mode,
context,
@ -1640,4 +1658,139 @@ class Backend {
async _getDefinitionAudio(sources, expression, reading, details) {
return await this._audioSystem.getDefinitionAudio(sources, expression, reading, details);
}
async _injectAnkNoteMedia(ankiConnect, expression, reading, timestamp, audioDetails, screenshotDetails, clipboardImage) {
const screenshotFileName = (
screenshotDetails !== null ?
await this._injectAnkNoteScreenshot(ankiConnect, expression, reading, timestamp, screenshotDetails) :
null
);
const clipboardImageFileName = (
clipboardImage ?
await this._injectAnkNoteClipboardImage(ankiConnect, expression, reading, timestamp) :
null
);
const audioFileName = (
audioDetails !== null ?
await this._injectAnkNoteAudio(ankiConnect, expression, reading, timestamp, audioDetails) :
null
);
return {screenshotFileName, clipboardImageFileName, audioFileName};
}
async _injectAnkNoteAudio(ankiConnect, expression, reading, timestamp, details) {
try {
if (!reading && !expression) {
throw new Error('Invalid reading and expression');
}
let fileName = 'yomichan';
if (reading) { fileName += `_${reading}`; }
if (expression) { fileName += `_${expression}`; }
fileName += '.mp3';
fileName = fileName.replace(/\]/g, '');
fileName = this._replaceInvalidFileNameCharacters(fileName);
const {sources, customSourceUrl} = details;
const {audio: data} = await this._getDefinitionAudio(
sources,
expression,
reading,
{
textToSpeechVoice: null,
customSourceUrl,
binary: true,
disableCache: true
}
);
await ankiConnect.storeMediaFile(fileName, data);
return fileName;
} catch (e) {
return null;
}
}
async _injectAnkNoteScreenshot(ankiConnect, expression, reading, timestamp, details) {
try {
const now = new Date(timestamp);
const {windowId, tabId, ownerFrameId, format, quality} = details;
const dataUrl = await this._getScreenshot(windowId, tabId, ownerFrameId, format, quality);
const {mediaType, data} = this._getDataUrlInfo(dataUrl);
const extension = this._getImageExtensionFromMediaType(mediaType);
let fileName = `yomichan_browser_screenshot_${reading}_${this._ankNoteDateToString(now)}.${extension}`;
fileName = this._replaceInvalidFileNameCharacters(fileName);
await ankiConnect.storeMediaFile(fileName, data);
return fileName;
} catch (e) {
return null;
}
}
async _injectAnkNoteClipboardImage(ankiConnect, expression, reading, timestamp) {
try {
const now = new Date(timestamp);
const dataUrl = await this._onApiClipboardImageGet();
if (dataUrl === null) {
throw new Error('No clipboard image');
}
const {mediaType, data} = this._getDataUrlInfo(dataUrl);
const extension = this._getImageExtensionFromMediaType(mediaType);
let fileName = `yomichan_clipboard_image_${reading}_${this._ankNoteDateToString(now)}.${extension}`;
fileName = this._replaceInvalidFileNameCharacters(fileName);
await ankiConnect.storeMediaFile(fileName, data);
return fileName;
} catch (e) {
return null;
}
}
_replaceInvalidFileNameCharacters(fileName) {
// eslint-disable-next-line no-control-regex
return fileName.replace(/[<>:"/\\|?*\x00-\x1F]/g, '-');
}
_ankNoteDateToString(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}`;
}
_getDataUrlInfo(dataUrl) {
const match = /^data:([^,]*?)(;base64)?,/.exec(dataUrl);
if (match === null) {
throw new Error('Invalid data URL');
}
let mediaType = match[1];
if (mediaType.length === 0) { mediaType = 'text/plain'; }
let data = dataUrl.substring(match[0].length);
if (typeof match[2] === 'undefined') { data = btoa(data); }
return {mediaType, data};
}
_getImageExtensionFromMediaType(mediaType) {
switch (mediaType.toLowerCase()) {
case 'image/png': return 'png';
case 'image/jpeg': return 'jpeg';
default: throw new Error('Unknown image media type');
}
}
}

3
ext/bg/js/settings/anki-templates-controller.js
View File

@ -144,8 +144,7 @@ class AnkiTemplatesController {
let templates = options.anki.fieldTemplates;
if (typeof templates !== 'string') { templates = this._defaultFieldTemplates; }
const ankiNoteBuilder = new AnkiNoteBuilder({
renderTemplate: api.templateRender.bind(api),
getClipboardImage: api.clipboardGetImage.bind(api)
renderTemplate: api.templateRender.bind(api)
});
const {general: {resultOutputMode, compactGlossaries}} = options;
const note = await ankiNoteBuilder.createNote({