Anki note clipboard marker (#780)

* Update fields reference

* Add support for adding clipboard images to anki notes

* Add handlebars templates

* Add markers

* Add markers to readme

1 files changed, 37 insertions, 1 deletions

diff --git a/ext/bg/js/anki-note-builder.js b/ext/bg/js/anki-note-builder.js
index 041e6dcd..d69a4fea 100644
--- a/ext/bg/js/anki-note-builder.js
+++ b/ext/bg/js/anki-note-builder.js
@@ -20,10 +20,11 @@
  */
 
 class AnkiNoteBuilder {
-    constructor({anki, audioSystem, renderTemplate}) {
+    constructor({anki, audioSystem, renderTemplate, getClipboardImage=null}) {
         this._anki = anki;
         this._audioSystem = audioSystem;
         this._renderTemplate = renderTemplate;
+        this._getClipboardImage = getClipboardImage;
     }
 
     async createNote(definition, mode, context, options, templates) {
@@ -138,6 +139,31 @@ class AnkiNoteBuilder {
         definition.screenshotFileName = fileName;
     }
 
+    async injectClipboardImage(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 extension = this._getImageExtensionFromDataUrl(dataUrl);
+            if (extension === null) { return; }
+
+            let fileName = `yomichan_clipboard_image_${reading}_${this._dateToString(now)}.${extension}`;
+            fileName = AnkiNoteBuilder.replaceInvalidFileNameCharacters(fileName);
+            const data = dataUrl.replace(/^data:[\w\W]*?,/, '');
+
+            await this._anki.storeMediaFile(fileName, data);
+
+            definition.clipboardImageFileName = fileName;
+        } catch (e) {
+            // NOP
+        }
+    }
+
     _createInjectedAudioFileName(definition) {
         const {reading, expression} = definition;
         if (!reading && !expression) { return null; }
@@ -170,6 +196,16 @@ class AnkiNoteBuilder {
         return false;
     }
 
+    _getImageExtensionFromDataUrl(dataUrl) {
+        const match = /^data:([^;]*);/.exec(dataUrl);
+        if (match === null) { return null; }
+        switch (match[1].toLowerCase()) {
+            case 'image/png': return 'png';
+            case 'image/jpeg': return 'jpeg';
+            default: return null;
+        }
+    }
+
     static replaceInvalidFileNameCharacters(fileName) {
         // eslint-disable-next-line no-control-regex
         return fileName.replace(/[<>:"/\\|?*\x00-\x1F]/g, '-');