preparation
This commit is contained in:
parent
1e2883c105
commit
d04da456ab
|
@ -19,7 +19,7 @@
|
|||
"svelte": "^3.49.0",
|
||||
"svelte-preprocess": "^4.10.7",
|
||||
"tailwindcss": "^3.1.8",
|
||||
"vite": "^3.0.0"
|
||||
"vite": "^3.0.9"
|
||||
}
|
||||
},
|
||||
"node_modules/@nodelib/fs.scandir": {
|
||||
|
@ -1842,15 +1842,15 @@
|
|||
"dev": true
|
||||
},
|
||||
"node_modules/vite": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-3.0.3.tgz",
|
||||
"integrity": "sha512-sDIpIcl3mv1NUaSzZwiXGEy1ZoWwwC2vkxUHY6yiDacR6zf//ZFuBJrozO62gedpE43pmxnLATNR5IYUdAEkMQ==",
|
||||
"version": "3.0.9",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-3.0.9.tgz",
|
||||
"integrity": "sha512-waYABTM+G6DBTCpYAxvevpG50UOlZuynR0ckTK5PawNVt7ebX6X7wNXHaGIO6wYYFXSM7/WcuFuO2QzhBB6aMw==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"esbuild": "^0.14.47",
|
||||
"postcss": "^8.4.14",
|
||||
"postcss": "^8.4.16",
|
||||
"resolve": "^1.22.1",
|
||||
"rollup": "^2.75.6"
|
||||
"rollup": ">=2.75.6 <2.77.0 || ~2.77.0"
|
||||
},
|
||||
"bin": {
|
||||
"vite": "bin/vite.js"
|
||||
|
@ -3047,16 +3047,16 @@
|
|||
"dev": true
|
||||
},
|
||||
"vite": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-3.0.3.tgz",
|
||||
"integrity": "sha512-sDIpIcl3mv1NUaSzZwiXGEy1ZoWwwC2vkxUHY6yiDacR6zf//ZFuBJrozO62gedpE43pmxnLATNR5IYUdAEkMQ==",
|
||||
"version": "3.0.9",
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-3.0.9.tgz",
|
||||
"integrity": "sha512-waYABTM+G6DBTCpYAxvevpG50UOlZuynR0ckTK5PawNVt7ebX6X7wNXHaGIO6wYYFXSM7/WcuFuO2QzhBB6aMw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"esbuild": "^0.14.47",
|
||||
"fsevents": "~2.3.2",
|
||||
"postcss": "^8.4.14",
|
||||
"postcss": "^8.4.16",
|
||||
"resolve": "^1.22.1",
|
||||
"rollup": "^2.75.6"
|
||||
"rollup": ">=2.75.6 <2.77.0 || ~2.77.0"
|
||||
}
|
||||
},
|
||||
"wrappy": {
|
||||
|
|
|
@ -17,7 +17,7 @@
|
|||
"svelte": "^3.49.0",
|
||||
"svelte-preprocess": "^4.10.7",
|
||||
"tailwindcss": "^3.1.8",
|
||||
"vite": "^3.0.0"
|
||||
"vite": "^3.0.9"
|
||||
},
|
||||
"dependencies": {
|
||||
"svelte-routing": "^1.6.0"
|
||||
|
|
|
@ -1,27 +1,21 @@
|
|||
<script>
|
||||
import Layout from '../Quiz/Layout.svelte'
|
||||
import Input from '../Quiz/answers/Input.svelte'
|
||||
let title = 'title' //exportovat ze zhora
|
||||
|
||||
let answers = {
|
||||
title: 'title',
|
||||
about: 'tohel dklfsdja fdsaj jklfdas fsadj lkjdfsa kl dsajfklasj asdlfkjaslk fasdklfj l',
|
||||
right: {
|
||||
min: 1.2,
|
||||
max: 4.4,
|
||||
},
|
||||
}
|
||||
export let params // { type: 'interval', correct: [0, 3], quesion: 'text otazky', description: '', options: null },
|
||||
let myAnswer
|
||||
|
||||
export let control = null
|
||||
export let nextQuestion
|
||||
|
||||
function between(number, min, max) {
|
||||
return number >= min && number <= max
|
||||
}
|
||||
</script>
|
||||
|
||||
<Layout on:submit={() => (control = myAnswer !== '' ? between(myAnswer, answers.right.min, answers.right.max) : null)}>
|
||||
<span slot="title">{answers.title}</span>
|
||||
<span slot="about">{answers.about}</span>
|
||||
<Layout {control} {nextQuestion} on:submit={() => (control = myAnswer !== '' ? between(myAnswer, params.correct[0], params.correct[1]) : null)}>
|
||||
<span slot="title">{title}</span>
|
||||
<span slot="about">{params.quesion}</span>
|
||||
<div slot="answers">
|
||||
<span class="self-baseline">
|
||||
<Input type="number" bind:value={myAnswer} class="w-full min-w-[400px] max-w-[500px] h-12" />
|
||||
|
|
|
@ -1,38 +1,39 @@
|
|||
<script>
|
||||
import Layout from '../Quiz/Layout.svelte'
|
||||
import CheckBox from '../Quiz/answers/Checkbox.svelte'
|
||||
let title = 'title' //exportovat ze zhora
|
||||
|
||||
const popis = 'tohel dklfsdja fdsaj jklfdas fsadj lkjdfsa kl dsajfklasj asdlfkjaslk fasdklfj l'
|
||||
const title = 'Nadpis úkolu'
|
||||
|
||||
let answers = [
|
||||
{ label: '1 answerf adfds', checked: false, right: false },
|
||||
{ label: '1 answerfda sfd', checked: false, right: true },
|
||||
{ label: '1 answerafsd asdf', checked: false, right: false },
|
||||
{ label: '1 answefdsa ffas dr', checked: false, right: true },
|
||||
]
|
||||
export let params //{ type: 'multichoice', correct: ['banan', 'cokolada'], quesion: 'text otazky', description: '', options: ['banan', 'cokolada', 'mleko'] },
|
||||
let myAnswers = new Array(params.options.length).fill(false)
|
||||
$: console.log(myAnswers)
|
||||
|
||||
export let control = null
|
||||
export let nextQuestion
|
||||
|
||||
const controlMultiForm = () => {
|
||||
control = true
|
||||
answers.forEach((answer) => {
|
||||
const equal = answer.checked === answer.right
|
||||
if (!equal) {
|
||||
for (let i = 0; i < myAnswers.length; i++) {
|
||||
const answer = myAnswers[i]
|
||||
const option = params.options[i]
|
||||
const correct = params.correct
|
||||
|
||||
if (answer && correct.indexOf(option) >= 0) control = null
|
||||
else if (!answer && !(correct.indexOf(option) >= 0)) control = null
|
||||
else {
|
||||
control = false
|
||||
return ''
|
||||
}
|
||||
})
|
||||
}
|
||||
if (control === null) control = true
|
||||
}
|
||||
</script>
|
||||
|
||||
<Layout on:submit={controlMultiForm}>
|
||||
<span slot="title">title</span>
|
||||
<span slot="about">about</span>
|
||||
<Layout {nextQuestion} {control} on:submit={controlMultiForm}>
|
||||
<span slot="title">{title}</span>
|
||||
<span slot="about">{params.quesion}</span>
|
||||
<div slot="answers">
|
||||
{#each answers as { label, checked }}
|
||||
{#each params.options as option, i}
|
||||
<span class="self-baseline">
|
||||
<CheckBox bind:checked>{label}</CheckBox>
|
||||
<CheckBox bind:checked={myAnswers[i]}>{option}</CheckBox>
|
||||
</span>
|
||||
{/each}
|
||||
</div>
|
||||
|
|
|
@ -1,16 +1,18 @@
|
|||
<script>
|
||||
import Layout from '../Quiz/Layout.svelte'
|
||||
import Input from '../Quiz/answers/Input.svelte'
|
||||
let title = 'title' //exportovat ze zhora
|
||||
|
||||
let answers = { title: 'title', about: 'about', right: '4' }
|
||||
export let params //{ type: 'text', correct: 'jablko', quesion: 'text otazky', description: '', options: null },
|
||||
let myAnswer
|
||||
|
||||
export let nextQuestion
|
||||
export let control = null
|
||||
</script>
|
||||
|
||||
<Layout on:submit={() => (control = myAnswer !== '' ? myAnswer === answers.right : null)}>
|
||||
<span slot="title">{answers.title}</span>
|
||||
<span slot="about">{answers.about}</span>
|
||||
<Layout {nextQuestion} {control} on:submit={() => (control = myAnswer !== '' ? myAnswer === params.correct : null)}>
|
||||
<span slot="title">{title}</span>
|
||||
<span slot="about">{params.about}</span>
|
||||
<div slot="answers">
|
||||
<span class="self-baseline">
|
||||
<Input type="number" bind:value={myAnswer} class="w-full min-w-[400px] max-w-[500px] h-12" />
|
||||
|
|
|
@ -5,23 +5,8 @@
|
|||
import MultiplyForm from './MultiChoiceForm.svelte'
|
||||
import IntervalForm from './IntervalForm.svelte'
|
||||
import QrCode from './QrCode.svelte'
|
||||
|
||||
let control = null // if true => spravne if false spatne
|
||||
$: console.log(control)
|
||||
|
||||
/*
|
||||
let questions = [
|
||||
{ type: 'text', correct: 'jablko', quesion: 'text otazky', description: '', options: null },
|
||||
{ type: 'multichoice', correct: ['banan', 'cokolada'], quesion: 'text otazky', description: '', options: ['banan', 'cokolada', 'mleko'] },
|
||||
{ type: 'singlechoice', correct: 'jablko', quesion: 'text otazky', description: '', options: ['banan', 'cokolada', 'mleko'] },
|
||||
{ type: 'interval', correct: [0, 3], quesion: 'text otazky', description: '', options: null },
|
||||
]
|
||||
*/
|
||||
|
||||
const answers = {
|
||||
type: 'singlechoice',
|
||||
//... answers
|
||||
}
|
||||
import { navigate } from 'svelte-routing'
|
||||
import Finish from './Finish.svelte'
|
||||
|
||||
const components = {
|
||||
text: TextForm,
|
||||
|
@ -30,7 +15,35 @@
|
|||
multichoice: MultiplyForm,
|
||||
interval: IntervalForm,
|
||||
qrcode: QrCode,
|
||||
|
||||
finish: Finish,
|
||||
}
|
||||
|
||||
let control = null // if true => spravne if false spatne
|
||||
$: console.log(control ? 'správně' : !control ? 'špatně' : null)
|
||||
|
||||
const nextQuestion = () => {
|
||||
if (clientAnswers.pos + 1 === clientAnswers.end) {
|
||||
page = components.finish
|
||||
return ''
|
||||
}
|
||||
control = null
|
||||
clientAnswers.pos++
|
||||
}
|
||||
|
||||
let questions = [
|
||||
{ type: 'singlechoice', correct: 'banan', quesion: 'text otazky', description: '', options: ['banan', 'cokolada', 'mleko'] },
|
||||
{ type: 'interval', correct: [0, 3], quesion: 'text otazky', description: '', options: null },
|
||||
{ type: 'text', correct: 'jablko', quesion: 'text otazky', description: '', options: null },
|
||||
{ type: 'multichoice', correct: ['banan', 'cokolada'], quesion: 'text otazky', description: '', options: ['banan', 'cokolada', 'mleko'] },
|
||||
]
|
||||
let page
|
||||
$: page = components[questions[clientAnswers.pos].type]
|
||||
|
||||
let clientAnswers = {
|
||||
pos: 0,
|
||||
end: questions.length,
|
||||
}
|
||||
</script>
|
||||
|
||||
<svelte:component this={components[answers.type]} bind:control />
|
||||
<svelte:component this={page} params={questions[clientAnswers.pos]} {nextQuestion} bind:control />
|
||||
|
|
|
@ -1,25 +1,22 @@
|
|||
<script>
|
||||
import Radio from '../Quiz/answers/Radio.svelte'
|
||||
import Layout from '../Quiz/Layout.svelte'
|
||||
let title = 'title' //exportovat ze zhora
|
||||
|
||||
const about = 'tohel dklfsdja fdsaj jklfdas fsadj lkjdfsa kl dsajfklasj asdlfkjaslk fasdklfj l'
|
||||
const title = 'jdfsafsd'
|
||||
|
||||
let answers = {
|
||||
labels: ['label 1', 'label 2', 'label 3', 'label 4'],
|
||||
right: 'label 1',
|
||||
}
|
||||
export let params //{ type: 'singlechoice', correct: 'banan', quesion: 'text otazky', description: '', options: ['banan', 'cokolada', 'mleko'] },
|
||||
let myAnswer
|
||||
|
||||
export let control = null
|
||||
export let nextQuestion
|
||||
</script>
|
||||
|
||||
<Layout on:submit={() => (control = myAnswer !== undefined ? myAnswer === answers.right : null)}>
|
||||
<Layout {control} {nextQuestion} on:submit={() => (control = typeof myAnswer === 'string' ? myAnswer === params.correct : null)}>
|
||||
<span slot="title">{title}</span>
|
||||
<span slot="about">{about}</span>
|
||||
<span slot="about">{params.quesion}</span>
|
||||
<div slot="answers">
|
||||
{#each answers.labels as label}
|
||||
{#each params.options as option}
|
||||
<span class="self-baseline">
|
||||
<Radio value={label} bind:group={myAnswer}>{label}</Radio>
|
||||
<Radio value={option} bind:group={myAnswer}>{option}</Radio>
|
||||
</span>
|
||||
{/each}
|
||||
</div>
|
||||
|
|
|
@ -1,20 +1,22 @@
|
|||
<script>
|
||||
import Layout from '../Quiz/Layout.svelte'
|
||||
import Input from '../Quiz/answers/Input.svelte'
|
||||
let title = 'title' //exportovat ze zhora
|
||||
|
||||
let answers = { title: 'title', about: 'tohel dklfsdja fdsaj jklfdas fsadj lkjdfsa kl dsajfklasj asdlfkjaslk fasdklfj l', right: 'domov' }
|
||||
export let params //{ type: 'text', correct: 'jablko', quesion: 'text otazky', description: '', options: null },
|
||||
let myAnswer
|
||||
|
||||
export let control = null
|
||||
export let nextQuestion
|
||||
const compare = (a, b) => {
|
||||
if (a.localeCompare(b, 'cz', { sensitivity: 'variant' }) === 0) return true
|
||||
else return false
|
||||
}
|
||||
</script>
|
||||
|
||||
<Layout on:submit={() => (control = myAnswer !== '' ? compare(myAnswer, answers.right) : null)}>
|
||||
<span slot="title">{answers.title}</span>
|
||||
<span slot="about">{answers.about}</span>
|
||||
<Layout {control} {nextQuestion} on:submit={() => (control = myAnswer !== '' ? compare(myAnswer, params.correct) : null)}>
|
||||
<span slot="title">{title}</span>
|
||||
<span slot="about">{params.quesion}</span>
|
||||
<div slot="answers">
|
||||
<span class="self-baseline">
|
||||
<Input type="text" bind:value={myAnswer} class="w-full min-w-[400px] max-w-[500px] h-12" />
|
||||
|
|
|
@ -4,6 +4,9 @@
|
|||
import Section from '../Section.svelte'
|
||||
import Map from '../game/Map.svelte'
|
||||
import Button from '../Button.svelte'
|
||||
|
||||
export let control, nextQuestion
|
||||
$: console.log(control)
|
||||
</script>
|
||||
|
||||
<Layout>
|
||||
|
@ -14,7 +17,7 @@
|
|||
<span style="width: 85%"><Map /></span>
|
||||
</div>
|
||||
</Heading>
|
||||
<Section style={'height: calc(100% - var(--quizHeader)); position: relative'}>
|
||||
<Section style="height: calc(100% - var(--quizHeader)); position: relative">
|
||||
<div class="flex items-center justify-center flex-col w-full gap-24 p-4">
|
||||
<div class="popis">
|
||||
<span> Popis úkolu: </span>
|
||||
|
@ -22,9 +25,20 @@
|
|||
</div>
|
||||
<div class="flex items-center justify-center flex-col w-full gap-6">
|
||||
<span class="relative"> <slot name="answers" /> </span>
|
||||
<Button on:submit primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 fixed m-10 relative">commit</Button>
|
||||
{#if control !== null}<!--jestli jsem už odpověděl-->
|
||||
<Button on:submit={nextQuestion} primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 fixed m-10 relative">Na další otázku</Button>
|
||||
{:else}<!--čeká na odpověd, na sejmutí-->
|
||||
<Button on:submit primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 fixed m-10 relative">Vyhodnotit</Button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full flex justify-center h-fit size">
|
||||
{#if control}
|
||||
<span>správně</span>
|
||||
{:else if control !== null}
|
||||
<span>špatně</span>
|
||||
{/if}
|
||||
</div>
|
||||
</Section>
|
||||
</div>
|
||||
</Layout>
|
||||
|
|
|
@ -1,8 +1,8 @@
|
|||
<script>
|
||||
import { idGenerator } from '../../../jsLibrari/IdGenerator'
|
||||
|
||||
import { idGenerator } from '$lib/jsLibrari/IdGenerator'
|
||||
const id = idGenerator()
|
||||
export let checked = false
|
||||
|
||||
export let checked = true
|
||||
</script>
|
||||
|
||||
<div class="cover h-14">
|
||||
|
@ -17,7 +17,7 @@
|
|||
<label for={id}><slot /></label>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
<style>
|
||||
.cover {
|
||||
height: 100%;
|
||||
width: fit-content;
|
||||
|
@ -26,17 +26,14 @@
|
|||
grid-template-columns: 56px auto;
|
||||
gap: 20px;
|
||||
padding: 4px;
|
||||
|
||||
label {
|
||||
font-size: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 140%;
|
||||
}
|
||||
}
|
||||
/*border: 4px solid var(--blue);
|
||||
box-shadow: 0 0 4px var(--blue), 0 0 1px var(--blue) inset;
|
||||
border-radius: var(--border-radius);*/
|
||||
|
||||
label {
|
||||
font-size: 100%;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 140%;
|
||||
}
|
||||
</style>
|
||||
|
|
Loading…
Reference in New Issue