word/finder: emulate gallery page in javascript

[sheet.git] / word / finder.js

diff --git a/word/finder.js b/word/finder.js
new file mode 100644 (file)
index 0000000..606f033
--- /dev/null
+++ b/word/finder.js
@@ -0,0 +1,32 @@
+class WordFinder extends WordQuiz {
+       add(parentitem, rows) {
+               const catitem = put(parentitem, 'ul');
+               rows.forEach(ref => {
+                       const [title, level, imgid] = this.data[ref];
+                       const worditem = put(catitem, 'li');
+                       const figitem = put(worditem, 'figure');
+                       if (imgid) {
+                               put(figitem, 'img[src=$]', `/data/word/32/${imgid}.jpg`);
+                       }
+                       if (title) {
+                               let html = title.replace(/\/(.*)/, ' <small>($1)</small>');
+                               put(figitem, 'figcaption', {
+                                       innerHTML: html,
+                               });
+                       }
+                       if (this.cats[ref]) {
+                               // delve into subcategory
+                               put(worditem, '.parent');
+                               this.add(worditem, this.cats[ref]);
+                       }
+               });
+       }
+
+       setup() {
+               this.gallery = document.getElementById('gallery');
+               put(this.gallery, '-p', 'Under construction.');
+               this.add(this.gallery, this.preset.cat ? [this.preset.cat] : this.cats[null]);
+       }
+
+       stop() {}
+};