Template handler update (#896)

* Rename TemplateHandler to HtmlTemplateCollection

* Rename _templateHandler to _templates

* Allow creation from both string and element

* Simplify setup of templates, don't throw errors on invalid ID

1 files changed, 45 insertions, 0 deletions

diff --git a/ext/mixed/js/html-template-collection.js b/ext/mixed/js/html-template-collection.js
new file mode 100644
index 00000000..56da68b8
--- /dev/null
+++ b/ext/mixed/js/html-template-collection.js
@@ -0,0 +1,45 @@
+/*
+ * Copyright (C) 2020  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 <http://www.gnu.org/licenses/>.
+ */
+
+class HtmlTemplateCollection {
+    constructor(source) {
+        this._templates = new Map();
+
+        const sourceNode = (
+            typeof source === 'string' ?
+            new DOMParser().parseFromString(source, 'text/html') :
+            source
+        );
+
+        const pattern = /^([\w\W]+)-template$/;
+        for (const template of sourceNode.querySelectorAll('template')) {
+            const match = pattern.exec(template.id);
+            if (match === null) { continue; }
+            this._templates.set(match[1], template);
+        }
+    }
+
+    instantiate(name) {
+        const template = this._templates.get(name);
+        return document.importNode(template.content.firstChild, true);
+    }
+
+    instantiateFragment(name) {
+        const template = this._templates.get(name);
+        return document.importNode(template.content, true);
+    }
+}