From 1bb4d3cf2a0e1bd1e4c2c33efd18fbbc23fadb90 Mon Sep 17 00:00:00 2001 From: Eloy Robillard Date: Wed, 28 Feb 2024 10:47:03 +0100 Subject: [PATCH] Display the stacked add buttons --- ext/css/display.css | 2 + ext/images/add-duplicate-term-kana.svg | 40 + ext/images/add-duplicate-term-kanji.svg | 84 + ext/js/display/display-anki.js | 38 + ext/js/input/hotkey-help-controller.js | 32 + resources/icons.svg | 2449 +++++++++-------------- 6 files changed, 1132 insertions(+), 1513 deletions(-) create mode 100644 ext/images/add-duplicate-term-kana.svg create mode 100644 ext/images/add-duplicate-term-kanji.svg diff --git a/ext/css/display.css b/ext/css/display.css index ca91a470f0..a148af13a1 100644 --- a/ext/css/display.css +++ b/ext/css/display.css @@ -669,6 +669,8 @@ button.action-button:active { .icon[data-icon=view-note] { background-image: url('/images/view-note.svg'); } .icon[data-icon=add-term-kanji] { background-image: url('/images/add-term-kanji.svg'); } .icon[data-icon=add-term-kana] { background-image: url('/images/add-term-kana.svg'); } +.icon[data-icon=add-duplicate-term-kanji] { background-image: url('/images/add-duplicate-term-kanji.svg'); } +.icon[data-icon=add-duplicate-term-kana] { background-image: url('/images/add-duplicate-term-kana.svg'); } .icon[data-icon=play-audio] { background-image: url('/images/play-audio.svg'); } .icon[data-icon=source-term] { background-image: url('/images/source-term.svg'); } .icon[data-icon=entry-current] { background-image: url('/images/entry-current.svg'); } diff --git a/ext/images/add-duplicate-term-kana.svg b/ext/images/add-duplicate-term-kana.svg new file mode 100644 index 0000000000..9b574aee18 --- /dev/null +++ b/ext/images/add-duplicate-term-kana.svg @@ -0,0 +1,40 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ext/images/add-duplicate-term-kanji.svg b/ext/images/add-duplicate-term-kanji.svg new file mode 100644 index 0000000000..809d0159f4 --- /dev/null +++ b/ext/images/add-duplicate-term-kanji.svg @@ -0,0 +1,84 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ext/js/display/display-anki.js b/ext/js/display/display-anki.js index e2ed3a0bd8..b7d118daae 100644 --- a/ext/js/display/display-anki.js +++ b/ext/js/display/display-anki.js @@ -370,6 +370,36 @@ export class DisplayAnki { } } + /** + * @param {HTMLButtonElement} button + */ + _showDuplicateAddButton(button) { + const isKanjiAdd = button.dataset.mode === 'term-kanji'; + + const title = button.getAttribute('title'); + if (title) { + button.setAttribute('title', title.replace(/Add (?!duplicate)/, 'Add duplicate ')); + } + + // eslint-disable-next-line no-underscore-dangle + const hotkeyLabel = this._display._hotkeyHelpController.getHotkeyLabel(button); + + if (hotkeyLabel) { + if (hotkeyLabel === 'Add expression ({0})') { + // eslint-disable-next-line no-underscore-dangle + this._display._hotkeyHelpController.setHotkeyLabel(button, 'Add duplicate expression ({0})'); + } else if (hotkeyLabel === 'Add reading ({0})') { + // eslint-disable-next-line no-underscore-dangle + this._display._hotkeyHelpController.setHotkeyLabel(button, 'Add duplicate reading ({0})'); + } + } + + const actionIcon = button.querySelector('.action-icon'); + if (actionIcon instanceof HTMLElement) { + actionIcon.dataset.icon = isKanjiAdd ? 'add-duplicate-term-kanji' : 'add-duplicate-term-kana'; + } + } + /** * @param {import('display-anki').DictionaryEntryDetails[]} dictionaryEntryDetails */ @@ -383,6 +413,11 @@ export class DisplayAnki { if (button !== null) { button.disabled = !canAdd; button.hidden = (ankiError !== null); + + // If entry has noteIds, show the "add duplicate" button. + if (Array.isArray(noteIds) && noteIds.length > 0) { + this._showDuplicateAddButton(button); + } } if (Array.isArray(noteIds) && noteIds.length > 0) { @@ -507,6 +542,9 @@ export class DisplayAnki { allErrors.push(toError(e)); } } + // Now that this dictionary entry has a duplicate in Anki, show the "add duplicate" buttons. + this._showDuplicateAddButton(button); + this._updateViewNoteButton(dictionaryEntryIndex, [noteId], true); } } diff --git a/ext/js/input/hotkey-help-controller.js b/ext/js/input/hotkey-help-controller.js index 16f3d26f0a..b495365d9b 100644 --- a/ext/js/input/hotkey-help-controller.js +++ b/ext/js/input/hotkey-help-controller.js @@ -181,4 +181,36 @@ export class HotkeyHelpController { defaultAttributeValues }; } + + /** + * @param {HTMLElement} node + * @returns {?string} + */ + getHotkeyLabel(node) { + const {hotkey} = node.dataset; + if (typeof hotkey !== 'string') { return null; } + + const data = /** @type {unknown} */ (parseJson(hotkey)); + if (!Array.isArray(data)) { return null; } + + const values = /** @type {unknown[]} */ (data)[2]; + if (typeof values !== 'string') { return null; } + + return values; + } + + /** + * @param {HTMLElement} node + * @param {string} label + */ + setHotkeyLabel(node, label) { + const {hotkey} = node.dataset; + if (typeof hotkey !== 'string') { return; } + + const data = /** @type {unknown} */ (parseJson(hotkey)); + if (!Array.isArray(data)) { return; } + + data[2] = label; + node.dataset.hotkey = JSON.stringify(data); + } } diff --git a/resources/icons.svg b/resources/icons.svg index 01cd259d05..58e3b23ac6 100644 --- a/resources/icons.svg +++ b/resources/icons.svg @@ -1,1676 +1,1099 @@ - - - - + + + + - - - - - - + + + + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - + + + - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - + - + image/svg+xml - + - + \ No newline at end of file