word/quiz.js

   1 class Quiz {
   2         next() {
   3                 let word = this.words.shift();
   4                 let form = put(this.form,
   5                         '+img[src=$]+ul', `/data/word/en/${word[0]}.jpg`,
   6                 );
   7
   8                 let answers = [word[2], this.words[1][2], this.words[2][2], this.words[3][2]]
   9                         .sort(() => {return .5 - Math.random()}) // shuffle
  10                 answers.forEach(suggest => {
  11                         let option = put(form, 'li', suggest, {onclick: () => {
  12                                 if (suggest != word[2]) {
  13                                         // incorrect
  14                                         put(option, '.wrong');
  15                                         return;
  16                                 }
  17                                 put(option, '.good');
  18                                 window.setTimeout(() => this.next(), 500);
  19                         }});
  20                 });
  21         }
  22
  23         constructor() {
  24                 this.dataurl = '/data/wordlist.nl.json';
  25                 fetch(this.dataurl).then(res => res.json()).then(json => {
  26                         this.form = document.getElementById('quiz');
  27                         this.words = Object.values(json)
  28                                 .sort(() => {return .5 - Math.random()}) // shuffle
  29                                 .map(row => row.split(/:/))
  30                         this.next();
  31                 });
  32         }
  33 };
  34
  35 new Quiz();