aboutsummaryrefslogtreecommitdiff
path: root/ext/js/pages/settings/anki-controller.js
diff options
context:
space:
mode:
authortoasted-nutbread <toasted-nutbread@users.noreply.github.com>2022-05-30 12:03:24 -0400
committerGitHub <noreply@github.com>2022-05-30 12:03:24 -0400
commit19bba07a8bccb51a9db85c13fd921d825defe753 (patch)
tree4354e2d3396f5957a005256a85f60d239ab30c0d /ext/js/pages/settings/anki-controller.js
parent0b5d54e7c66c17383e23855a1c3d4dbb1ea817fc (diff)
Add support for Anki API key (#2169)
* Update material.css to support password fields * Support password * Add "apiKey" setting * Use apiKey * Update options if API key changes * Update tests
Diffstat (limited to 'ext/js/pages/settings/anki-controller.js')
-rw-r--r--ext/js/pages/settings/anki-controller.js29
1 files changed, 27 insertions, 2 deletions
diff --git a/ext/js/pages/settings/anki-controller.js b/ext/js/pages/settings/anki-controller.js
index d03fa535..cfbac0ea 100644
--- a/ext/js/pages/settings/anki-controller.js
+++ b/ext/js/pages/settings/anki-controller.js
@@ -61,6 +61,7 @@ class AnkiController {
this._ankiErrorInvalidResponseInfo = document.querySelector('#anki-error-invalid-response-info');
this._ankiEnableCheckbox = document.querySelector('[data-setting="anki.enable"]');
this._ankiCardPrimary = document.querySelector('#anki-card-primary');
+ const ankiApiKeyInput = document.querySelector('#anki-api-key-input');
const ankiCardPrimaryTypeRadios = document.querySelectorAll('input[type=radio][name=anki-card-primary-type]');
this._setupFieldMenus();
@@ -79,9 +80,17 @@ class AnkiController {
document.querySelector('#anki-error-log').addEventListener('click', this._onAnkiErrorLogLinkClick.bind(this));
- const options = await this._settingsController.getOptions();
+ ankiApiKeyInput.addEventListener('focus', this._onApiKeyInputFocus.bind(this));
+ ankiApiKeyInput.addEventListener('blur', this._onApiKeyInputBlur.bind(this));
+
+ const onAnkiSettingChanged = () => { this._updateOptions(); };
+ const nodes = [ankiApiKeyInput, ...document.querySelectorAll('[data-setting="anki.enable"]')];
+ for (const node of nodes) {
+ node.addEventListener('settingChanged', onAnkiSettingChanged);
+ }
+
+ await this._updateOptions();
this._settingsController.on('optionsChanged', this._onOptionsChanged.bind(this));
- this._onOptionsChanged({options});
}
getFieldMarkers(type) {
@@ -164,9 +173,17 @@ class AnkiController {
// Private
+ async _updateOptions() {
+ const options = await this._settingsController.getOptions();
+ this._onOptionsChanged({options});
+ }
+
async _onOptionsChanged({options: {anki}}) {
+ let {apiKey} = anki;
+ if (apiKey === '') { apiKey = null; }
this._ankiConnect.server = anki.server;
this._ankiConnect.enabled = anki.enable;
+ this._ankiConnect.apiKey = apiKey;
this._selectorObserver.disconnect();
this._selectorObserver.observe(document.documentElement, true);
@@ -202,6 +219,14 @@ class AnkiController {
this._testAnkiNoteViewerSafe(e.currentTarget.dataset.mode);
}
+ _onApiKeyInputFocus(e) {
+ e.currentTarget.type = 'text';
+ }
+
+ _onApiKeyInputBlur(e) {
+ e.currentTarget.type = 'password';
+ }
+
_setAnkiCardPrimaryType(ankiCardType, ankiCardMenu) {
if (this._ankiCardPrimary === null) { return; }
this._ankiCardPrimary.dataset.ankiCardType = ankiCardType;