♻️ Cleaned admin-game code up

2023-09-18 20:45:07 +02:00
parent 85d162eba0
commit 1b5b5e31ac
9 changed files with 288 additions and 228 deletions
@@ -0,0 +1,104 @@
+<!--
+SPDX-FileCopyrightText: 2023 Marlon W (Mawoka)
+
+SPDX-License-Identifier: MPL-2.0
+-->
+
+<script lang="ts">
+	import { QuizQuestionType } from '$lib/quiz_types';
+	import type { QuizData } from '$lib/quiz_types';
+	import type { Socket } from 'socket.io-client';
+	import { getLocalization } from '$lib/i18n';
+
+	export let bg_color: string;
+	export let selected_question: number;
+	export let quiz_data: QuizData;
+	export let timer_res: string;
+	export let final_results;
+	export let socket: Socket;
+
+	export let game_token: string;
+
+	export let question_results;
+
+	export let shown_question_now: number;
+
+	const { t } = getLocalization();
+	const set_question_number = (q_number: number) => {
+		socket.emit('set_question_number', q_number.toString());
+	};
+
+	const get_question_results = () => {
+		socket.emit('get_question_results', {
+			game_id: game_token,
+			question_number: shown_question_now
+		});
+	};
+	const show_solutions = () => {
+		socket.emit('show_solutions', {});
+		timer_res = '0';
+	};
+
+	const get_final_results = () => {
+		socket.emit('get_final_results', {});
+	};
+</script>
+
+<div
+	class="fixed top-0 w-full h-10 z-20 grid grid-cols-2"
+	style="background: {bg_color ? bg_color : 'transparent'}"
+	class:text-black={bg_color}
+>
+	<p class="mr-auto ml-0 col-start-1 col-end-1">
+		{selected_question === -1 ? '0' : selected_question + 1}
+		/{quiz_data.questions.length}
+	</p>
+	<div class="justify-self-end ml-auto mr-0 col-start-3 col-end-3">
+		{#if selected_question + 1 === quiz_data.questions.length && ((timer_res === '0' && question_results !== null) || quiz_data?.questions?.[selected_question]?.type === QuizQuestionType.SLIDE)}
+			{#if JSON.stringify(final_results) === JSON.stringify([null])}
+				<button on:click={get_final_results} class="admin-button"
+					>{$t('admin_page.get_final_results')}
+				</button>
+			{/if}
+		{:else if timer_res === '0' || selected_question === -1}
+			{#if (selected_question + 1 !== quiz_data.questions.length && question_results !== null) || selected_question === -1}
+				<button
+					on:click={() => {
+						set_question_number(selected_question + 1);
+					}}
+					class="admin-button"
+					>{$t('admin_page.next_question', { question: selected_question + 2 })}
+				</button>
+			{/if}
+			{#if question_results === null && selected_question !== -1}
+				{#if quiz_data.questions[selected_question].type === QuizQuestionType.SLIDE}
+					<button
+						on:click={() => {
+							set_question_number(selected_question + 1);
+						}}
+						class="admin-button"
+						>{$t('admin_page.next_question', { question: selected_question + 2 })}
+					</button>
+				{:else}
+					<button on:click={get_question_results} class="admin-button"
+						>{$t('admin_page.show_results')}
+					</button>
+				{/if}
+			{/if}
+		{:else if selected_question !== -1}
+			{#if quiz_data.questions[selected_question].type === QuizQuestionType.SLIDE}
+				<button
+					on:click={() => {
+						set_question_number(selected_question + 1);
+					}}
+					class="admin-button"
+					>{$t('admin_page.next_question', { question: selected_question + 2 })}
+				</button>
+			{:else}
+				<button on:click={show_solutions} class="admin-button"
+					>{$t('admin_page.stop_time_and_solutions')}
+				</button>
+			{/if}
+		{/if}
+	</div>
+</div>