word/quiz: generic page container setup
[sheet.git] / word / multichoice.js
1 class WordMultiChoice extends WordQuiz {
2         next() {
3                 if (this.words.length < 4) return;
4                 let word = this.words.shift();
5                 let form = put(this.form,
6                         '+img[src=$]+ul', `/data/word/32/${word[2]}.jpg`,
7                 );
8
9                 let answers = [word[0], this.words[0][0], this.words[1][0], this.words[2][0]]
10                         .shuffle()
11                 this.log('ask', word[2], answers);
12                 answers.forEach(suggest => {
13                         let label = suggest.replace(/\/.*/, '');
14                         let option = put(form, 'li', label, {onclick: () => {
15                                 this.log('pick', suggest, null, word[0]);
16                                 if (suggest != word[0]) {
17                                         // incorrect
18                                         put(option, '.wrong');
19                                         return;
20                                 }
21                                 put(option, '.good');
22                                 window.setTimeout(() => this.next(), 500);
23                         }});
24                 });
25         }
26
27         setup() {
28                 super.setup();
29                 this.next();
30         }
31 };