From 64fa6635d6f09af31c0bbc43f5d797d6e4e08997 Mon Sep 17 00:00:00 2001 From: ota-prokopec Date: Wed, 14 Sep 2022 19:22:18 +0200 Subject: [PATCH] znovu pushovani, hotovy forms --- src/App.svelte | 7 +- src/lib/Components/Forms/Finish.svelte | 14 ++++ src/lib/Components/Forms/IntervalForm.svelte | 12 +++- .../Components/Forms/MultiChoiceForm.svelte | 40 +++++------ src/lib/Components/Forms/NumberForm.svelte | 24 ++++--- src/lib/Components/Forms/Renderer.svelte | 71 ++++++++++++------- .../Components/Forms/SingleChoiceForm.svelte | 30 +++++--- src/lib/Components/Forms/TextForm.svelte | 21 ++++-- src/lib/Components/Image.svelte | 6 +- src/lib/Components/ImageSlider.svelte | 2 +- src/lib/Components/Overlay.svelte | 6 +- .../Components/Quiz/ImageFullScreen.svelte | 0 src/lib/Components/Quiz/Layout.svelte | 7 +- src/lib/utils/parseQuestion.js | 5 +- src/routes/game.svelte | 64 ++++++++--------- 15 files changed, 191 insertions(+), 118 deletions(-) create mode 100644 src/lib/Components/Quiz/ImageFullScreen.svelte diff --git a/src/App.svelte b/src/App.svelte index b636963..cf219e8 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -3,6 +3,7 @@ import './main.scss' import Game from './routes/game.svelte' + import Finish from './lib/Components/Forms/Finish.svelte' import Renderer from './lib/Components/Forms/Renderer.svelte' //import Try from './routes/try.svelte' let gameData @@ -10,11 +11,11 @@
- - + + - +
diff --git a/src/lib/Components/Forms/Finish.svelte b/src/lib/Components/Forms/Finish.svelte index e69de29..5398c64 100644 --- a/src/lib/Components/Forms/Finish.svelte +++ b/src/lib/Components/Forms/Finish.svelte @@ -0,0 +1,14 @@ + + + +
+ + + diff --git a/src/lib/Components/Forms/IntervalForm.svelte b/src/lib/Components/Forms/IntervalForm.svelte index 24d0769..9d2a048 100644 --- a/src/lib/Components/Forms/IntervalForm.svelte +++ b/src/lib/Components/Forms/IntervalForm.svelte @@ -4,7 +4,7 @@ let title = 'title' //exportovat ze zhora export let params // { type: 'interval', correct: [0, 3], quesion: 'text otazky', description: '', options: null }, - let myAnswer + let myAnswer = '' export let control = null export let nextQuestion @@ -13,7 +13,15 @@ } - (control = myAnswer !== '' ? between(myAnswer, params.correct[0], params.correct[1]) : null)}> + { + nextQuestion() + myAnswer = '' + }} + on:submit={() => (control = myAnswer !== '' ? between(myAnswer, params.correct[0], params.correct[1]) : null)} +> {title} {params.quesion}
diff --git a/src/lib/Components/Forms/MultiChoiceForm.svelte b/src/lib/Components/Forms/MultiChoiceForm.svelte index 85ce64e..9712f75 100644 --- a/src/lib/Components/Forms/MultiChoiceForm.svelte +++ b/src/lib/Components/Forms/MultiChoiceForm.svelte @@ -1,11 +1,11 @@ - - {title} - {params.quesion} + { + nextQuestion() + myAnswers = new Array(answers.length).fill(false) + }} + {control} + on:submit={controlMultiForm} +> + {gameData.name} + {@html gameData.question.question}
- {#each params.options as option, i} + {#each answers as { label }, i} - {option} + {label} {/each}
- - - diff --git a/src/lib/Components/Forms/NumberForm.svelte b/src/lib/Components/Forms/NumberForm.svelte index de7f208..5f59117 100644 --- a/src/lib/Components/Forms/NumberForm.svelte +++ b/src/lib/Components/Forms/NumberForm.svelte @@ -1,18 +1,27 @@ - (control = myAnswer !== '' ? myAnswer === params.correct : null)}> - {title} - {params.about} + { + nextQuestion() + myAnswer = '' + }} + {control} + on:submit={() => (control = myAnswer !== '' ? myAnswer === answers.answer : null)} +> + {gameData.name} + {@html gameData.question.question}
@@ -20,9 +29,6 @@
- diff --git a/src/lib/Components/ImageSlider.svelte b/src/lib/Components/ImageSlider.svelte index cf074fc..41c9a5c 100644 --- a/src/lib/Components/ImageSlider.svelte +++ b/src/lib/Components/ImageSlider.svelte @@ -15,7 +15,7 @@ {#each images as image, i} {#if Math.floor(windowsize / (94 + 10)) >= i + 1}
- + {#if Math.floor(windowsize / (94 + 10)) === i + 1 && images.length !== i + 1} {`+${images.length - Math.floor(windowsize / (94 + 10))}`} {/if} diff --git a/src/lib/Components/Overlay.svelte b/src/lib/Components/Overlay.svelte index 4a64976..ac0464e 100644 --- a/src/lib/Components/Overlay.svelte +++ b/src/lib/Components/Overlay.svelte @@ -1,5 +1,5 @@ @@ -14,14 +15,14 @@
- +
Popis úkolu: - +
diff --git a/src/lib/utils/parseQuestion.js b/src/lib/utils/parseQuestion.js index 126ff44..c6e0a00 100644 --- a/src/lib/utils/parseQuestion.js +++ b/src/lib/utils/parseQuestion.js @@ -1,4 +1,3 @@ - export default (question, questionType) => { switch (questionType.toLowerCase()) { case 'text': @@ -6,9 +5,9 @@ export default (question, questionType) => { case 'number': return Number.parseFloat(question) case 'choice': - return question.split(/;\s*/).map(item => ({ + return question.split(/;\s*/).map((item) => ({ label: item.startsWith('*') ? item.substring(1) : item, - value: item.startsWith('*') ? true : false + value: item.startsWith('*') ? true : false, })) default: return null diff --git a/src/routes/game.svelte b/src/routes/game.svelte index cc005f1..1274993 100644 --- a/src/routes/game.svelte +++ b/src/routes/game.svelte @@ -8,54 +8,50 @@ import IconPoint from '../lib/Components/Icons/Point.svelte' import Map from '../lib/Components/game/Map.svelte' import ImageSlider from '../lib/Components/ImageSlider.svelte' - import * as api from '$lib/utils/api' - import parseQuestion from '$lib/utils/parseQuestion' - import yallist from 'yallist' export let gameurl - let background = '/assets/temp/kar1.png' let assets = Array.from(Array(6).keys()).map((_, i) => `/assets/temp/kar${i + 1}.png`) + export let gameData = null ;(async () => { - const gameData = await api.post(`${api.hostName}/game/details`, { - gameurl: gameurl, + gameData = await api.post(`${api.hostName}/game/details`, { + gameurl, }) - const questions = yallist(gameData.questions) - console.log(gameData) - - console.log(parseQuestion(gameData.questions[0].answer, gameData.questions[0].type)) + //console.log(gameData) })() - - - {gameData.name} -
- - - {'4.5'} - - - - {gameData.district} - -
- + + {#if gameData} + + {gameData.name} +
+ + + {'4.5'} + + + + {gameData.district} + +
+ -
- - {@html gameData.start} -
-
- -
- +
+ + {@html gameData.start} +
+
+ +
+ - + + {/if}