diff --git a/packages/frontend/src/pages/flash/flash-edit.vue b/packages/frontend/src/pages/flash/flash-edit.vue index f8435c48f8..2b7fcf74e1 100644 --- a/packages/frontend/src/pages/flash/flash-edit.vue +++ b/packages/frontend/src/pages/flash/flash-edit.vue @@ -173,6 +173,119 @@ var cursor = 0 do() `; +const PRESET_QUIZ = `/// @ 0.12.4 +let title = '地理クイズ' + +let qas = [{ + q: 'オーストラリアの首都は?' + choices: ['シドニー' 'キャンベラ' 'メルボルン'] + a: 'キャンベラ' + aDescription: '最大の都市はシドニーですが首都はキャンベラです。' +} { + q: '国土面積2番目の国は?' + choices: ['カナダ' 'アメリカ' '中国'] + a: 'カナダ' + aDescription: '大きい順にロシア、カナダ、アメリカ、中国です。' +} { + q: '二重内陸国ではないのは?' + choices: ['リヒテンシュタイン' 'ウズベキスタン' 'レソト'] + a: 'レソト' + aDescription: 'レソトは(一重)内陸国です。' +} { + q: '閘門がない運河は?' + choices: ['キール運河' 'スエズ運河' 'パナマ運河'] + a: 'スエズ運河' + aDescription: 'スエズ運河は高低差がないので閘門はありません。' +}] + +let qaEls = [Ui:C:container({ + align: 'center' + children: [ + Ui:C:text({ + size: 1.5 + bold: true + text: title + }) + ] +})] + +var qn = 0 +each (let qa, qas) { + qn += 1 + qa.id = Util:uuid() + qaEls.push(Ui:C:container({ + align: 'center' + bgColor: '#000' + fgColor: '#fff' + padding: 16 + rounded: true + children: [ + Ui:C:text({ + text: \`Q{qn} {qa.q}\` + }) + Ui:C:select({ + items: qa.choices.map(@(c) {{ text: c, value: c }}) + onChange: @(v) { qa.userAnswer = v } + }) + Ui:C:container({ + children: [] + } \`{qa.id}:a\`) + ] + } qa.id)) +} + +@finish() { + var score = 0 + + each (let qa, qas) { + let correct = qa.userAnswer == qa.a + if (correct) score += 1 + let el = Ui:get(\`{qa.id}:a\`) + el.update({ + children: [ + Ui:C:text({ + size: 1.2 + bold: true + color: if (correct) '#f00' else '#00f' + text: if (correct) '🎉正解' else '不正解' + }) + Ui:C:text({ + text: qa.aDescription + }) + ] + }) + } + + let result = \`{title}の結果は{qas.len}問中{score}問正解でした。\` + Ui:get('footer').update({ + children: [ + Ui:C:postFormButton({ + text: '結果を共有' + rounded: true + primary: true + form: { + text: \`{result}{Str:lf}{THIS_URL}\` + } + }) + ] + }) +} + +qaEls.push(Ui:C:container({ + align: 'center' + children: [ + Ui:C:button({ + text: '答え合わせ' + primary: true + rounded: true + onClick: finish + }) + ] +} 'footer')) + +Ui:render(qaEls) +`; + const PRESET_TIMELINE = `/// @ 0.12.4 // APIリクエストを行いローカルタイムラインを表示するプリセット @@ -258,6 +371,11 @@ function selectPreset(ev: MouseEvent) { action: () => { script = PRESET_SHUFFLE; }, + }, { + text: 'Quiz', + action: () => { + script = PRESET_QUIZ; + }, }, { text: 'Timeline viewer', action: () => {