summaryrefslogtreecommitdiff
path: root/ext/js/display/display-anki.js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2021-07-03 19:32:11 -0400
committerGitHub <noreply@github.com>2021-07-03 19:32:11 -0400
commitea47cb82487ac12379b2bdf89a3a9155608f45f7 (patch)
treed66cec528be57b9e2de2e1576a758ec4b68f0ca3 /ext/js/display/display-anki.js
parent82b7ebfa58c1d68916d66ffb49a0407a7dfc7aba (diff)
DisplayAnki (#1791)
* Remove anki functionality from display * Rename function * Display API updates * Use DisplayAnki * TODO
Diffstat (limited to 'ext/js/display/display-anki.js')
-rw-r--r--ext/js/display/display-anki.js582
1 files changed, 582 insertions, 0 deletions
diff --git a/ext/js/display/display-anki.js b/ext/js/display/display-anki.js
new file mode 100644
index 00000000..8dd94214
--- /dev/null
+++ b/ext/js/display/display-anki.js
@@ -0,0 +1,582 @@
+/*
+ * Copyright (C) 2021 Yomichan Authors
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <https://www.gnu.org/licenses/>.
+ */
+
+/* global
+ * AnkiNoteBuilder
+ * AnkiUtil
+ * DisplayNotification
+ */
+
+class DisplayAnki {
+ constructor(display) {
+ this._display = display;
+ this._ankiFieldTemplates = null;
+ this._ankiFieldTemplatesDefault = null;
+ this._ankiNoteBuilder = new AnkiNoteBuilder();
+ this._ankiNoteNotification = null;
+ this._ankiNoteNotificationEventListeners = null;
+ this._ankiTagNotification = null;
+ this._updateAdderButtonsPromise = Promise.resolve();
+ this._updateAdderButtonsToken = null;
+ this._eventListeners = new EventListenerCollection();
+ this._checkForDuplicates = false;
+ this._suspendNewCards = false;
+ this._compactTags = false;
+ this._resultOutputMode = 'split';
+ this._glossaryLayoutMode = 'default';
+ this._displayTags = 'never';
+ this._duplicateScope = 'collection';
+ this._screenshotFormat = 'png';
+ this._screenshotQuality = 100;
+ this._noteTags = [];
+ this._modeOptions = new Map();
+ this._onShowTagsBind = this._onShowTags.bind(this);
+ this._onNoteAddBind = this._onNoteAdd.bind(this);
+ this._onNoteViewBind = this._onNoteView.bind(this);
+ }
+
+ prepare() {
+ this._display.hotkeyHandler.registerActions([
+ ['addNoteKanji', () => { this._tryAddAnkiNoteForSelectedEntry('kanji'); }],
+ ['addNoteTermKanji', () => { this._tryAddAnkiNoteForSelectedEntry('term-kanji'); }],
+ ['addNoteTermKana', () => { this._tryAddAnkiNoteForSelectedEntry('term-kana'); }],
+ ['viewNote', () => { this._tryViewAnkiNoteForSelectedEntry(); }]
+ ]);
+ this._display.on('optionsUpdated', this._onOptionsUpdated.bind(this));
+ }
+
+ cleanupEntries() {
+ this._updateAdderButtonsToken = null;
+ this._hideAnkiNoteErrors(false);
+ }
+
+ setupEntry(entry) {
+ this._addMultipleEventListeners(entry, '.action-view-tags', 'click', this._onShowTagsBind);
+ this._addMultipleEventListeners(entry, '.action-add-note', 'click', this._onNoteAddBind);
+ this._addMultipleEventListeners(entry, '.action-view-note', 'click', this._onNoteViewBind);
+ }
+
+ setupEntriesComplete(isTerms, dictionaryEntries) { // TODO : Don't pass (isTerms, dictionaryEntries)
+ this._updateAdderButtons(isTerms, dictionaryEntries);
+ }
+
+ async getLogData(dictionaryEntry) {
+ const result = {};
+
+ // Anki note data
+ let ankiNoteData;
+ let ankiNoteDataException;
+ try {
+ const context = this._getNoteContext();
+ ankiNoteData = await this._ankiNoteBuilder.getRenderingData({
+ dictionaryEntry,
+ mode: 'test',
+ context,
+ resultOutputMode: this.resultOutputMode,
+ glossaryLayoutMode: this._glossaryLayoutMode,
+ compactTags: this._compactTags,
+ injectedMedia: null,
+ marker: 'test'
+ });
+ } catch (e) {
+ ankiNoteDataException = e;
+ }
+ result.ankiNoteData = ankiNoteData;
+ if (typeof ankiNoteDataException !== 'undefined') {
+ result.ankiNoteDataException = ankiNoteDataException;
+ }
+
+ // Anki notes
+ const ankiNotes = [];
+ const modes = this._getModes(dictionaryEntry.type === 'term');
+ for (const mode of modes) {
+ let note;
+ let errors;
+ try {
+ const noteContext = this._getNoteContext();
+ ({note: note, errors} = await this._createNote(dictionaryEntry, mode, noteContext, false));
+ } catch (e) {
+ errors = [e];
+ }
+ const entry = {mode, note};
+ if (Array.isArray(errors) && errors.length > 0) {
+ entry.errors = errors;
+ }
+ ankiNotes.push(entry);
+ }
+ result.ankiNotes = ankiNotes;
+
+ return result;
+ }
+
+ // Private
+
+ _onOptionsUpdated({options}) {
+ const {
+ general: {resultOutputMode, glossaryLayoutMode, compactTags},
+ anki: {tags, duplicateScope, suspendNewCards, checkForDuplicates, displayTags, kanji, terms, screenshot: {format, quality}}
+ } = options;
+
+ this._checkForDuplicates = checkForDuplicates;
+ this._suspendNewCards = suspendNewCards;
+ this._compactTags = compactTags;
+ this._resultOutputMode = resultOutputMode;
+ this._glossaryLayoutMode = glossaryLayoutMode;
+ this._displayTags = displayTags;
+ this._duplicateScope = duplicateScope;
+ this._screenshotFormat = format;
+ this._screenshotQuality = quality;
+ this._noteTags = [...tags];
+ this._modeOptions.clear();
+ this._modeOptions.set('kanji', kanji);
+ this._modeOptions.set('term-kanji', terms);
+ this._modeOptions.set('term-kana', terms);
+
+ this._updateAnkiFieldTemplates(options);
+ }
+
+ _onNoteAdd(e) {
+ e.preventDefault();
+ const node = e.currentTarget;
+ const index = this._display.getElementDictionaryEntryIndex(node);
+ this._addAnkiNote(index, node.dataset.mode);
+ }
+
+ _onShowTags(e) {
+ e.preventDefault();
+ const tags = e.currentTarget.title;
+ this._showAnkiTagsNotification(tags);
+ }
+
+ _onNoteView(e) {
+ e.preventDefault();
+ const link = e.currentTarget;
+ yomichan.api.noteView(link.dataset.noteId);
+ }
+
+ _addMultipleEventListeners(container, selector, ...args) {
+ for (const node of container.querySelectorAll(selector)) {
+ this._eventListeners.addEventListener(node, ...args);
+ }
+ }
+
+ _adderButtonFind(index, mode) {
+ const entry = this._getEntry(index);
+ return entry !== null ? entry.querySelector(`.action-add-note[data-mode="${mode}"]`) : null;
+ }
+
+ _tagsIndicatorFind(index) {
+ const entry = this._getEntry(index);
+ return entry !== null ? entry.querySelector('.action-view-tags') : null;
+ }
+
+ _viewerButtonFind(index) {
+ const entry = this._getEntry(index);
+ return entry !== null ? entry.querySelector('.action-view-note') : null;
+ }
+
+ _getEntry(index) {
+ const entries = this._display.dictionaryEntryNodes;
+ return index >= 0 && index < entries.length ? entries[index] : null;
+ }
+
+ _viewerButtonShow(index, noteId) {
+ const viewerButton = this._viewerButtonFind(index);
+ if (viewerButton === null) {
+ return;
+ }
+ viewerButton.disabled = false;
+ viewerButton.hidden = false;
+ viewerButton.dataset.noteId = noteId;
+ }
+
+ _getNoteContext() {
+ const {state} = this._display.history;
+ let {documentTitle, url, sentence} = (isObject(state) ? state : {});
+ if (typeof documentTitle !== 'string') {
+ documentTitle = document.title;
+ }
+ if (typeof url !== 'string') {
+ url = window.location.href;
+ }
+ sentence = this._getValidSentenceData(sentence);
+ return {
+ url,
+ sentence,
+ documentTitle,
+ query: this._display.query,
+ fullQuery: this._display.fullQuery
+ };
+ }
+
+ _getDictionaryEntryDetailsForNote(dictionaryEntry) {
+ const {type} = dictionaryEntry;
+ if (type === 'kanji') {
+ const {character} = dictionaryEntry;
+ return {type, character};
+ }
+
+ const {headwords} = dictionaryEntry;
+ let bestIndex = -1;
+ for (let i = 0, ii = headwords.length; i < ii; ++i) {
+ const {term, reading, sources} = headwords[i];
+ for (const {deinflectedText} of sources) {
+ if (term === deinflectedText) {
+ bestIndex = i;
+ i = ii;
+ break;
+ } else if (reading === deinflectedText && bestIndex < 0) {
+ bestIndex = i;
+ break;
+ }
+ }
+ }
+
+ const {term, reading} = headwords[Math.max(0, bestIndex)];
+ return {type, term, reading};
+ }
+
+ async _updateAdderButtons(isTerms, dictionaryEntries) {
+ const token = {};
+ this._updateAdderButtonsToken = token;
+ await this._updateAdderButtonsPromise;
+ if (this._updateAdderButtonsToken !== token) { return; }
+
+ const {promise, resolve} = deferPromise();
+ try {
+ this._updateAdderButtonsPromise = promise;
+
+ const modes = this._getModes(isTerms);
+ let states;
+ try {
+ const noteContext = this._getNoteContext();
+ states = await this._areDictionaryEntriesAddable(
+ dictionaryEntries,
+ modes,
+ noteContext,
+ this._checkForDuplicates ? null : true,
+ this._displayTags !== 'never'
+ );
+ } catch (e) {
+ return;
+ }
+
+ if (this._updateAdderButtonsToken !== token) { return; }
+
+ this._updateAdderButtons2(states, modes);
+ } finally {
+ resolve();
+ }
+ }
+
+ _updateAdderButtons2(states, modes) {
+ const displayTags = this._displayTags;
+ for (let i = 0, ii = states.length; i < ii; ++i) {
+ const infos = states[i];
+ let noteId = null;
+ for (let j = 0, jj = infos.length; j < jj; ++j) {
+ const {canAdd, noteIds, noteInfos} = infos[j];
+ const mode = modes[j];
+ const button = this._adderButtonFind(i, mode);
+ if (button === null) {
+ continue;
+ }
+
+ if (Array.isArray(noteIds) && noteIds.length > 0) {
+ noteId = noteIds[0];
+ }
+ button.disabled = !canAdd;
+ button.hidden = false;
+
+ if (displayTags !== 'never' && Array.isArray(noteInfos)) {
+ this._setupTagsIndicator(i, noteInfos);
+ }
+ }
+ if (noteId !== null) {
+ this._viewerButtonShow(i, noteId);
+ }
+ }
+ }
+
+ _setupTagsIndicator(i, noteInfos) {
+ const tagsIndicator = this._tagsIndicatorFind(i);
+ if (tagsIndicator === null) {
+ return;
+ }
+
+ const displayTags = new Set();
+ for (const {tags} of noteInfos) {
+ for (const tag of tags) {
+ displayTags.add(tag);
+ }
+ }
+ if (this._displayTags === 'non-standard') {
+ for (const tag of this._noteTags) {
+ displayTags.delete(tag);
+ }
+ }
+
+ if (displayTags.size > 0) {
+ tagsIndicator.disabled = false;
+ tagsIndicator.hidden = false;
+ tagsIndicator.title = `Card tags: ${[...displayTags].join(', ')}`;
+ }
+ }
+
+ _showAnkiTagsNotification(message) {
+ if (this._ankiTagNotification === null) {
+ const node = this._display.displayGenerator.createEmptyFooterNotification();
+ node.classList.add('click-scannable');
+ this._ankiTagNotification = new DisplayNotification(this._display.notificationContainer, node);
+ }
+
+ this._ankiTagNotification.setContent(message);
+ this._ankiTagNotification.open();
+ }
+
+
+ _tryAddAnkiNoteForSelectedEntry(mode) {
+ const index = this._display.selectedIndex;
+ this._addAnkiNote(index, mode);
+ }
+
+ _tryViewAnkiNoteForSelectedEntry() {
+ const index = this._display.selectedIndex;
+ const button = this._viewerButtonFind(index);
+ if (button !== null && !button.disabled) {
+ yomichan.api.noteView(button.dataset.noteId);
+ }
+ }
+
+ async _addAnkiNote(dictionaryEntryIndex, mode) {
+ const dictionaryEntries = this._display.dictionaryEntries;
+ if (dictionaryEntryIndex < 0 || dictionaryEntryIndex >= dictionaryEntries.length) { return; }
+ const dictionaryEntry = dictionaryEntries[dictionaryEntryIndex];
+
+ const button = this._adderButtonFind(dictionaryEntryIndex, mode);
+ if (button === null || button.disabled) { return; }
+
+ this._hideAnkiNoteErrors(true);
+
+ const allErrors = [];
+ const progressIndicatorVisible = this._display.progressIndicatorVisible;
+ const overrideToken = progressIndicatorVisible.setOverride(true);
+ try {
+ const noteContext = this._getNoteContext();
+ const {note, errors} = await this._createNote(dictionaryEntry, mode, noteContext, true);
+ allErrors.push(...errors);
+
+ let noteId = null;
+ let addNoteOkay = false;
+ try {
+ noteId = await yomichan.api.addAnkiNote(note);
+ addNoteOkay = true;
+ } catch (e) {
+ allErrors.length = 0;
+ allErrors.push(e);
+ }
+
+ if (addNoteOkay) {
+ if (noteId === null) {
+ allErrors.push(new Error('Note could not be added'));
+ } else {
+ if (this._suspendNewCards) {
+ try {
+ await yomichan.api.suspendAnkiCardsForNote(noteId);
+ } catch (e) {
+ allErrors.push(e);
+ }
+ }
+ button.disabled = true;
+ this._viewerButtonShow(dictionaryEntryIndex, noteId);
+ }
+ }
+ } catch (e) {
+ allErrors.push(e);
+ } finally {
+ progressIndicatorVisible.clearOverride(overrideToken);
+ }
+
+ if (allErrors.length > 0) {
+ this._showAnkiNoteErrors(allErrors);
+ } else {
+ this._hideAnkiNoteErrors(true);
+ }
+ }
+
+ _showAnkiNoteErrors(errors) {
+ if (this._ankiNoteNotificationEventListeners !== null) {
+ this._ankiNoteNotificationEventListeners.removeAllEventListeners();
+ }
+
+ if (this._ankiNoteNotification === null) {
+ const node = this._display.displayGenerator.createEmptyFooterNotification();
+ this._ankiNoteNotification = new DisplayNotification(this._display.notificationContainer, node);
+ this._ankiNoteNotificationEventListeners = new EventListenerCollection();
+ }
+
+ const content = this._display.displayGenerator.createAnkiNoteErrorsNotificationContent(errors);
+ for (const node of content.querySelectorAll('.anki-note-error-log-link')) {
+ this._ankiNoteNotificationEventListeners.addEventListener(node, 'click', () => {
+ console.log({ankiNoteErrors: errors});
+ }, false);
+ }
+
+ this._ankiNoteNotification.setContent(content);
+ this._ankiNoteNotification.open();
+ }
+
+ _hideAnkiNoteErrors(animate) {
+ if (this._ankiNoteNotification === null) { return; }
+ this._ankiNoteNotification.close(animate);
+ this._ankiNoteNotificationEventListeners.removeAllEventListeners();
+ }
+
+ async _updateAnkiFieldTemplates(options) {
+ this._ankiFieldTemplates = await this._getAnkiFieldTemplates(options);
+ }
+
+ async _getAnkiFieldTemplates(options) {
+ let templates = options.anki.fieldTemplates;
+ if (typeof templates === 'string') { return templates; }
+
+ templates = this._ankiFieldTemplatesDefault;
+ if (typeof templates === 'string') { return templates; }
+
+ templates = await yomichan.api.getDefaultAnkiFieldTemplates();
+ this._ankiFieldTemplatesDefault = templates;
+ return templates;
+ }
+
+ async _areDictionaryEntriesAddable(dictionaryEntries, modes, context, forceCanAddValue, fetchAdditionalInfo) {
+ const modeCount = modes.length;
+ const notePromises = [];
+ for (const dictionaryEntry of dictionaryEntries) {
+ for (const mode of modes) {
+ const notePromise = this._createNote(dictionaryEntry, mode, context, false);
+ notePromises.push(notePromise);
+ }
+ }
+ const notes = (await Promise.all(notePromises)).map(({note}) => note);
+
+ let infos;
+ if (forceCanAddValue !== null) {
+ if (!await yomichan.api.isAnkiConnected()) {
+ throw new Error('Anki not connected');
+ }
+ infos = this._getAnkiNoteInfoForceValue(notes, forceCanAddValue);
+ } else {
+ infos = await yomichan.api.getAnkiNoteInfo(notes, fetchAdditionalInfo);
+ }
+
+ const results = [];
+ for (let i = 0, ii = infos.length; i < ii; i += modeCount) {
+ results.push(infos.slice(i, i + modeCount));
+ }
+ return results;
+ }
+
+ _getAnkiNoteInfoForceValue(notes, canAdd) {
+ const results = [];
+ for (const note of notes) {
+ const valid = AnkiUtil.isNoteDataValid(note);
+ results.push({canAdd, valid, noteIds: null});
+ }
+ return results;
+ }
+
+ async _createNote(dictionaryEntry, mode, context, injectMedia) {
+ const modeOptions = this._modeOptions.get(mode);
+ if (typeof modeOptions === 'undefined') { throw new Error(`Unsupported note type: ${mode}`); }
+ const template = this._ankiFieldTemplates;
+ const {deck: deckName, model: modelName} = modeOptions;
+ const fields = Object.entries(modeOptions.fields);
+
+ const errors = [];
+ let injectedMedia = null;
+ if (injectMedia) {
+ let errors2;
+ ({result: injectedMedia, errors: errors2} = await this._injectAnkiNoteMedia(dictionaryEntry, fields));
+ for (const error of errors2) {
+ errors.push(deserializeError(error));
+ }
+ }
+
+ const {note, errors: createNoteErrors} = await this._ankiNoteBuilder.createNote({
+ dictionaryEntry,
+ mode,
+ context,
+ template,
+ deckName,
+ modelName,
+ fields,
+ tags: this._noteTags,
+ checkForDuplicates: this._checkForDuplicates,
+ duplicateScope: this._duplicateScope,
+ resultOutputMode: this.resultOutputMode,
+ glossaryLayoutMode: this._glossaryLayoutMode,
+ compactTags: this._compactTags,
+ injectedMedia,
+ errors
+ });
+ errors.push(...createNoteErrors);
+ return {note, errors};
+ }
+
+ async _injectAnkiNoteMedia(dictionaryEntry, fields) {
+ const timestamp = Date.now();
+
+ const dictionaryEntryDetails = this._getDictionaryEntryDetailsForNote(dictionaryEntry);
+
+ const audioDetails = (
+ dictionaryEntryDetails.type !== 'kanji' && AnkiUtil.fieldsObjectContainsMarker(fields, 'audio') ?
+ this._display.getAnkiNoteMediaAudioDetails(dictionaryEntryDetails.term, dictionaryEntryDetails.reading) :
+ null
+ );
+
+ const {tabId, frameId} = this._display.getContentOrigin();
+ const screenshotDetails = (
+ AnkiUtil.fieldsObjectContainsMarker(fields, 'screenshot') && typeof tabId === 'number' ?
+ {tabId, frameId, format: this._screenshotFormat, quality: this._screenshotQuality} :
+ null
+ );
+
+ const clipboardDetails = {
+ image: AnkiUtil.fieldsObjectContainsMarker(fields, 'clipboard-image'),
+ text: AnkiUtil.fieldsObjectContainsMarker(fields, 'clipboard-text')
+ };
+
+ return await yomichan.api.injectAnkiNoteMedia(
+ timestamp,
+ dictionaryEntryDetails,
+ audioDetails,
+ screenshotDetails,
+ clipboardDetails
+ );
+ }
+
+ _getModes(isTerms) {
+ return isTerms ? ['term-kanji', 'term-kana'] : ['kanji'];
+ }
+
+ _getValidSentenceData(sentence) {
+ let {text, offset} = (isObject(sentence) ? sentence : {});
+ if (typeof text !== 'string') { text = ''; }
+ if (typeof offset !== 'number') { offset = 0; }
+ return {text, offset};
+ }
+}