From 0e005f2ca6a3d9e572ed18b51c720d8bea907118 Mon Sep 17 00:00:00 2001
From: toasted-nutbread <toasted-nutbread@users.noreply.github.com>
Date: Sat, 24 Feb 2024 23:30:58 -0500
Subject: Fix anki template field marker menu (#725)

* Fix HTML collection

* Expose templates

* Fix menu setup

* Warn
---
 ext/js/pages/settings/anki-controller.js     | 27 +++++++++++++++++----------
 ext/js/pages/settings/settings-controller.js |  5 +++++
 2 files changed, 22 insertions(+), 10 deletions(-)

(limited to 'ext/js/pages/settings')

diff --git a/ext/js/pages/settings/anki-controller.js b/ext/js/pages/settings/anki-controller.js
index edd40516..d166d3f0 100644
--- a/ext/js/pages/settings/anki-controller.js
+++ b/ext/js/pages/settings/anki-controller.js
@@ -281,15 +281,25 @@ export class AnkiController {
 
     /** */
     _setupFieldMenus() {
-        /** @type {[types: import('dictionary').DictionaryEntryType[], selector: string][]} */
+        /** @type {[types: import('dictionary').DictionaryEntryType[], templateName: string][]} */
         const fieldMenuTargets = [
-            [['term'], '#anki-card-terms-field-menu-template'],
-            [['kanji'], '#anki-card-kanji-field-menu-template'],
-            [['term', 'kanji'], '#anki-card-all-field-menu-template']
+            [['term'], 'anki-card-terms-field-menu'],
+            [['kanji'], 'anki-card-kanji-field-menu'],
+            [['term', 'kanji'], 'anki-card-all-field-menu']
         ];
-        for (const [types, selector] of fieldMenuTargets) {
-            const element = /** @type {HTMLTemplateElement} */ (document.querySelector(selector));
-            if (element === null) { continue; }
+        const {templates} = this._settingsController;
+        for (const [types, templateName] of fieldMenuTargets) {
+            const templateContent = templates.getTemplateContent(templateName);
+            if (templateContent === null) {
+                log.warn(new Error(`Failed to set up menu "${templateName}": element not found`));
+                continue;
+            }
+
+            const container = templateContent.querySelector('.popup-menu-body');
+            if (container === null) {
+                log.warn(new Error(`Failed to set up menu "${templateName}": body not found`));
+                return;
+            }
 
             let markers = [];
             for (const type of types) {
@@ -297,9 +307,6 @@ export class AnkiController {
             }
             markers = [...new Set(markers)];
 
-            const container = element.content.querySelector('.popup-menu-body');
-            if (container === null) { return; }
-
             const fragment = document.createDocumentFragment();
             for (const marker of markers) {
                 const option = document.createElement('button');
diff --git a/ext/js/pages/settings/settings-controller.js b/ext/js/pages/settings/settings-controller.js
index 282479de..a9f3a026 100644
--- a/ext/js/pages/settings/settings-controller.js
+++ b/ext/js/pages/settings/settings-controller.js
@@ -66,6 +66,11 @@ export class SettingsController extends EventDispatcher {
         this._setProfileIndex(value, true);
     }
 
+    /** @type {HtmlTemplateCollection} */
+    get templates() {
+        return this._templates;
+    }
+
     /** */
     async prepare() {
         await this._templates.loadFromFiles(['/templates-settings.html']);
-- 
cgit v1.2.3