word/finder.js

   1 class WordFinder extends WordQuiz {
   2         namehtml(name) {
   3                 let aliases = name.split('/');
   4                 let html = aliases.shift();
   5                 html = html.replace(/\((.+)\)/, '<small>$1</small>');
   6                 for (let alias of aliases) {
   7                         html += ` <small>(${alias})</small>`;
   8                 }
   9                 return html;
  10         }
  11
  12         add(catitem, rows) {
  13                 rows.forEach(word => {
  14                         if (!word) return;
  15                         const worditem = put(catitem, 'li');
  16                         const figitem = put(worditem, 'figure');
  17                         if (word.imgid) {
  18                                 put(figitem, 'img[src=$]', word.thumb());
  19                         }
  20                         if (word.title) {
  21                                 put(figitem, 'figcaption', {
  22                                         innerHTML: this.namehtml(word.title),
  23                                 });
  24                         }
  25                         put(worditem, '.level' + word.level);
  26                         if (word.level <= 1 && word.subs.length >= 4) {
  27                                 put(worditem, '.large');
  28                         }
  29                         if (word.subs.length) {
  30                                 // delve into subcategory
  31                                 put(worditem, '.parent');
  32                                 const expansion = put(worditem, 'ul');
  33                                 //expansion.style.display = 'none';
  34                                 this.add(expansion, word.subs);
  35                                 //worditem.onclick = () => expansion.style.display = '';
  36                         }
  37                         if (this.preset.debug) {
  38                                 put(figitem, '[title=$]', `id ${word.id} level ${word.level}`);
  39                         }
  40                 });
  41         }
  42
  43         configure(input) {
  44                 this.preset.level = 3;
  45                 this.preset.images = false;
  46                 return super.configure(input);
  47         }
  48
  49         setup() {
  50                 super.setup();
  51                 if (this.preset.debug) {
  52                         put(document.head, 'link', {rel: 'stylesheet', href: '/word/debug.css'});
  53                 }
  54                 this.form.innerHTML = '';
  55                 put(this.form, 'p', 'Under construction.');
  56                 for (let cat of this.data.root()) {
  57                         this.add(put(this.form, 'ul.gallery'), [cat]);
  58                 }
  59         }
  60
  61         stop() {}
  62 };