diff --git a/classquiz/routers/quiz.py b/classquiz/routers/quiz.py index e14294e..3650d54 100644 --- a/classquiz/routers/quiz.py +++ b/classquiz/routers/quiz.py @@ -311,4 +311,4 @@ async def set_next_question(game_pin: int, question_number: int): redis_res = await redis.get(f"game:{game_pin}") if redis_res is None: raise HTTPException(status_code=404, detail="Game not found") - sio.emit("set_question_number", question_number, room=game_pin) + await sio.emit("set_question_number", question_number, room=game_pin) diff --git a/frontend/src/lib/admin.svelte b/frontend/src/lib/admin.svelte index e306e6f..6930701 100644 --- a/frontend/src/lib/admin.svelte +++ b/frontend/src/lib/admin.svelte @@ -11,6 +11,7 @@ import { socket } from './socket'; import { QuizQuestionType } from '$lib/quiz_types'; import { kahoot_icons } from './play/kahoot_mode_assets/kahoot_icons'; + import CircularTimer from '$lib/play/circular_progress.svelte'; export let game_token: string; export let quiz_data: QuizData; @@ -27,7 +28,7 @@ console.log(quiz_data); - const set_question_number = (q_number: number) => { + export const set_question_number = (q_number: number) => { question_results = null; socket.emit('set_question_number', q_number.toString()); shown_question_now = q_number; @@ -74,145 +75,205 @@ timer_res = seconds.toString(); }, 1000); }; + let circular_prgoress = 0; + $: { + try { + circular_prgoress = + 1 - + ((100 / quiz_data.questions[selected_question].time) * parseInt(timer_res)) / 100; + } catch {} + } -{#if timer_res !== undefined && !final_results_clicked} -
-

- {quiz_data.questions[selected_question].question} -

- {$t('admin_page.time_left')}: {timer_res} -
- {#if quiz_data.questions[selected_question].image !== null} -
- Content for Question -
- {/if} - {#if game_mode === 'kahoot'} - {#if quiz_data.questions[selected_question].type === QuizQuestionType.ABCD} -
- {#each quiz_data.questions[selected_question].answers as answer, i} -
- icon - {answer.answer} -
- {/each} +{#if game_mode === 'kahoot'} +
+

+ {selected_question === -1 ? '0' : selected_question + 1} + /{quiz_data.questions.length} +

+ {#if selected_question >= 0} +
+

{quiz_data.questions[selected_question].question}

+

{timer_res}

{/if} - {/if} -{/if} -
-{#if timer_res === '0'} - {#if question_results === null} -
+
+ on:click={() => { + set_question_number(selected_question + 1); + }} + >Next Question ({selected_question + 2} + ) +
- {:else if question_results === undefined} - {#if !final_results_clicked} -
-

{$t('admin_page.no_answers')}

+
+ {#if timer_res !== '0' && selected_question >= 0} + + {/if} +{/if} +
+ {#if timer_res !== undefined && !final_results_clicked} +
+

+ {quiz_data.questions[selected_question].question} +

+ +
+ +
+
+ {#if quiz_data.questions[selected_question].image !== null} +
+ Content for Question
{/if} - {:else} -
-
- - - - - - - - - - {#each question_results as result} - - - - - - {/each} - -
- {$t('words.username')} - - {$t('words.answer')} - - {$t('words.correct')}? -
- {result.username} - - {result.answer} - - {#if result.right} - ✅ - {:else} - ❌ - {/if} -
-
-
+ {#if game_mode === 'kahoot'} + {#if quiz_data.questions[selected_question].type === QuizQuestionType.ABCD} +
+ {#each quiz_data.questions[selected_question].answers as answer, i} +
+ icon + {answer.answer} + +
+ {/each} +
+ {/if} + {/if} {/if} -{:else if timer_res !== undefined} -
- -
-{/if} -
-{#if get_question_title(selected_question + 1, quiz_data) !== '' && selected_question + 1 !== 0} -
- -
-{:else if selected_question + 1 === 0} -
- -
-{:else if final_results_clicked === false} -
- -
-{/if} +
+ {#if timer_res === '0'} + {#if question_results === null} + {#if game_mode === 'normal'} +
+ +
+ {/if} + {:else if question_results === undefined} + {#if !final_results_clicked} +
+

{$t('admin_page.no_answers')}

+
+ {/if} + {:else} +
+
+ + + + + + + + + + {#each question_results as result} + + + + + + {/each} + +
+ {$t('words.username')} + + {$t('words.answer')} + + {$t('words.correct')}? +
+ {result.username} + + {result.answer} + + {#if result.right} + ✅ + {:else} + ❌ + {/if} +
+
+
+ {/if} + {:else if timer_res !== undefined} + {#if game_mode === 'normal'} +
+ +
+ {/if} + {/if} +
+ {#if get_question_title(selected_question + 1, quiz_data) !== '' && selected_question + 1 !== 0} + {#if game_mode === 'normal'} +
+ +
+ {/if} + {:else if selected_question + 1 === 0} + {#if game_mode === 'normal'} +
+ +
+ {/if} + {:else if final_results_clicked === false} + {#if game_mode === 'normal'} +
+ +
+ {/if} + {/if} +
diff --git a/frontend/src/lib/play/circular_progress.svelte b/frontend/src/lib/play/circular_progress.svelte new file mode 100644 index 0000000..ab9605a --- /dev/null +++ b/frontend/src/lib/play/circular_progress.svelte @@ -0,0 +1,41 @@ + + + +
{text}
+ + diff --git a/frontend/src/lib/play/kahoot_mode_assets/0.svg b/frontend/src/lib/play/kahoot_mode_assets/0.svg index 1708174..bb2cb2c 100644 --- a/frontend/src/lib/play/kahoot_mode_assets/0.svg +++ b/frontend/src/lib/play/kahoot_mode_assets/0.svg @@ -1,12 +1,27 @@ - - - - - - + + + + +Created by potrace 1.16, written by Peter Selinger 2001-2019 + + + + diff --git a/frontend/src/lib/play/kahoot_mode_assets/1.svg b/frontend/src/lib/play/kahoot_mode_assets/1.svg index 1708174..e934cad 100644 --- a/frontend/src/lib/play/kahoot_mode_assets/1.svg +++ b/frontend/src/lib/play/kahoot_mode_assets/1.svg @@ -1,12 +1,49 @@ - - - - - - + + + + +Created by potrace 1.16, written by Peter Selinger 2001-2019 + + + + + + diff --git a/frontend/src/lib/play/kahoot_mode_assets/2.svg b/frontend/src/lib/play/kahoot_mode_assets/2.svg index 1708174..e22f821 100644 --- a/frontend/src/lib/play/kahoot_mode_assets/2.svg +++ b/frontend/src/lib/play/kahoot_mode_assets/2.svg @@ -1,12 +1,75 @@ - - - - - - + + + + +Created by potrace 1.16, written by Peter Selinger 2001-2019 + + + + + + + + + + + + + + + + diff --git a/frontend/src/lib/play/kahoot_mode_assets/3.svg b/frontend/src/lib/play/kahoot_mode_assets/3.svg index 1708174..a7d93cf 100644 --- a/frontend/src/lib/play/kahoot_mode_assets/3.svg +++ b/frontend/src/lib/play/kahoot_mode_assets/3.svg @@ -1,12 +1,44 @@ - + + + - - - - + + + + + + + + + + diff --git a/frontend/src/lib/play/question.svelte b/frontend/src/lib/play/question.svelte index 1b13b35..5436a47 100644 --- a/frontend/src/lib/play/question.svelte +++ b/frontend/src/lib/play/question.svelte @@ -10,6 +10,7 @@ import Spinner from '../Spinner.svelte'; import { getLocalization } from '$lib/i18n'; import { kahoot_icons } from './kahoot_mode_assets/kahoot_icons'; + import CircularTimer from '$lib/play/circular_progress.svelte'; const { t } = getLocalization(); @@ -66,13 +67,21 @@ } }; $: set_answer_if_not_set_range(timer_res); + let circular_prgoress = 0; + $: { + try { + circular_prgoress = 1 - ((100 / question.time) * parseInt(timer_res)) / 100; + } catch {} + }

{question.question}

- {timer_res} +
+ +
{#if question.image !== null}
@@ -100,7 +109,7 @@
{#each question.answers as answer, i}