X-Git-Url: http://git.shiar.net/sheet.git/blobdiff_plain/dd34b2ba63184d3e2fb94f393328d6e6227ca6f6..44e2112d30af2edb254091897a4e4b34d91785fc:/word/finder.js

diff --git a/word/finder.js b/word/finder.js
index 0f97c0f..3dca29b 100644
--- a/word/finder.js
+++ b/word/finder.js
@@ -1,14 +1,4 @@
 class WordFinder extends WordQuiz {
-	namehtml(name) {
-		let aliases = name.split('/');
-		let html = aliases.shift();
-		html = html.replace(/\((.+)\)/, '<small>$1</small>');
-		for (let alias of aliases) {
-			html += ` <small>(${alias})</small>`;
-		}
-		return html;
-	}
-
 	add(catitem, rows) {
 		rows.forEach(word => {
 			if (!word) return;
@@ -19,24 +9,40 @@ class WordFinder extends WordQuiz {
 			}
 			if (word.title) {
 				put(figitem, 'figcaption', {
-					innerHTML: this.namehtml(word.title),
+					innerHTML: word.html,
 				});
 			}
+			if (this.preset.debug) {
+				put(figitem, '[title=$]', `id ${word.id} level ${word.level}`);
+			}
 			put(worditem, '.level' + word.level);
+			if (!word.subs.length) {
+				return;
+			}
 			if (word.level <= 1 && word.subs.length >= 4) {
 				put(worditem, '.large');
 			}
-			if (word.subs.length) {
-				// delve into subcategory
-				put(worditem, '.parent');
-				const expansion = put(worditem, 'ul');
-				//expansion.style.display = 'none';
+			put(worditem, '.parent.expand');
+
+			put(figitem, '[data-sup=$]', word.subs.length);
+			figitem.onclick = () => {
+				let expansion;
+				if (expansion = worditem.querySelector('ul')) {
+					put(expansion, '!');
+					put(worditem, '.expand');
+					return;
+				}
+				expansion = put(worditem, 'ul');
 				this.add(expansion, word.subs);
-				//worditem.onclick = () => expansion.style.display = '';
-			}
-			if (this.preset.debug) {
-				put(figitem, '[title=$]', `id ${ref} level ${word.level}`);
-			}
+				put(worditem, '!expand');
+			};
+			return;
+
+			// delve into subcategory
+			const expansion = put(worditem, 'ul');
+			//expansion.style.display = 'none';
+			this.add(expansion, word.subs);
+			//worditem.onclick = () => expansion.style.display = '';
 		});
 	}