LobotomyLabs/classquiz-ai
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rename to snake_case

Browse Source
This commit is contained in:
Mawoka
2026-04-24 21:31:22 +02:00
parent ee9694930b
commit d0fcfd5e35
5 changed files with 108 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/admin.svelte
+21 -17
View File
@@ -12,7 +12,7 @@ SPDX-License-Identifier: MPL-2.0
import Controls from '$lib/play/admin/controls.svelte';
import Question from '$lib/play/admin/question.svelte';
import { SocketGameControls } from '$lib/play/admin/socket_game_controls.ts';
import { GameState } from '$lib/play/admin/game_state.ts';
import type { IGameState } from '$lib/play/admin/game_state.ts';
const { t } = getLocalization();
const default_colors = ['#D6EDC9', '#B07156', '#7F7057', '#4E6E58'];
@@ -23,14 +23,10 @@ SPDX-License-Identifier: MPL-2.0
interface Props {
game_token: string;
bg_color: string;
game_state: GameState;
game_state: IGameState;
}
let {
game_token,
bg_color,
game_state = $bindable()
}: Props = $props();
let { game_token, bg_color, game_state = $bindable() }: Props = $props();
socket.on('get_question_results', () => {
console.log('get_question_results');
@@ -89,33 +85,41 @@ SPDX-License-Identifier: MPL-2.0
</script>
{#if game_state.control_visible}
<Controls
{bg_color}
{socket_game_controls}
{game_token}
bind:game_state
/>
<Controls {bg_color} {socket_game_controls} {game_token} bind:game_state />
{/if}
{#if game_state.timer_res !== '0' && game_state.selected_question >= 0}
<span
class="fixed top-0 bg-red-500 h-8 transition-all"
class:mt-10={game_state.control_visible}
style="width: {(100 / parseInt(game_state.quiz_data.questions[game_state.selected_question].time)) *
style="width: {(100 /
parseInt(game_state.quiz_data.questions[game_state.selected_question].time)) *
parseInt(game_state.timer_res)}vw"
></span>
{/if}
<div class="w-full h-full" class:pt-28={game_state.control_visible} class:pt-12={!game_state.control_visible}>
<div
class="w-full h-full"
class:pt-28={game_state.control_visible}
class:pt-12={!game_state.control_visible}
>
{#if game_state.timer_res !== undefined && !final_results_clicked && !game_state.question_results}
<!-- Question is shown -->
{#if game_state.quiz_data.questions[game_state.selected_question].type === QuizQuestionType.SLIDE}
{#await import('$lib/play/admin/slide.svelte')}
<Spinner my_20={false} />
{:then c}
<c.default question={game_state.quiz_data.questions[game_state.selected_question]} />
<c.default
question={game_state.quiz_data.questions[game_state.selected_question]}
/>
{/await}
{:else}
<Question quiz_data={game_state.quiz_data} selected_question={game_state.selected_question} timer_res={game_state.timer_res} answer_count={game_state.answer_count} default_colors={default_colors} />
<Question
quiz_data={game_state.quiz_data}
selected_question={game_state.selected_question}
timer_res={game_state.timer_res}
answer_count={game_state.answer_count}
{default_colors}
/>
{/if}
{/if}
<br />
frontend/src/lib/play/admin/controls.svelte
+34 -16
View File
@@ -8,7 +8,7 @@ SPDX-License-Identifier: MPL-2.0
import { QuizQuestionType } from '$lib/quiz_types';
import { getLocalization } from '$lib/i18n';
import { SocketGameControls } from '$lib/play/admin/socket_game_controls.ts';
import { GameState } from '$lib/play/admin/game_state.ts';
import type { GameState } from '$lib/play/admin/game_state.ts';
interface Props {
bg_color: string;
@@ -17,12 +17,7 @@ SPDX-License-Identifier: MPL-2.0
game_state: GameState;
}
let {
bg_color,
socket_game_controls,
game_token,
game_state = $bindable()
}: Props = $props();
let { bg_color, socket_game_controls, game_token, game_state = $bindable() }: Props = $props();
const { t } = getLocalization();
@@ -44,7 +39,9 @@ SPDX-License-Identifier: MPL-2.0
<div class="justify-self-end ml-auto mr-0 col-start-3 col-end-3">
{#if game_state.selected_question + 1 === game_state.quiz_data.questions.length && ((game_state.timer_res === '0' && game_state.question_results !== null) || game_state.quiz_data?.questions?.[game_state.selected_question]?.type === QuizQuestionType.SLIDE)}
{#if JSON.stringify(game_state.final_results) === JSON.stringify([null])}
<button onclick={() => socket_game_controls.get_final_results()} class="admin-button"
<button
onclick={() => socket_game_controls.get_final_results()}
class="admin-button"
>{$t('admin_page.get_final_results')}
</button>
{/if}
@@ -55,31 +52,50 @@ SPDX-License-Identifier: MPL-2.0
socket_game_controls.set_question_number(game_state.selected_question + 1);
}}
class="admin-button"
>{$t('admin_page.next_question', { question: game_state.selected_question + 2 })}
>{$t('admin_page.next_question', {
question: game_state.selected_question + 2
})}
</button>
{/if}
{#if game_state.question_results === null && game_state.selected_question !== -1}
{#if game_state.quiz_data.questions[game_state.selected_question].type === QuizQuestionType.SLIDE}
<button
onclick={() => {
socket_game_controls.set_question_number(game_state.selected_question + 1);
socket_game_controls.set_question_number(
game_state.selected_question + 1
);
}}
class="admin-button"
>{$t('admin_page.next_question', { question: game_state.selected_question + 2 })}
>{$t('admin_page.next_question', {
question: game_state.selected_question + 2
})}
</button>
{:else if game_state.quiz_data.questions[game_state.selected_question]?.hide_results === true}
<button
onclick={() => {
socket_game_controls.get_question_results(game_token, game_state.shown_question_now);
socket_game_controls.get_question_results(
game_token,
game_state.shown_question_now
);
setTimeout(() => {
socket_game_controls.set_question_number(game_state.selected_question + 1);
socket_game_controls.set_question_number(
game_state.selected_question + 1
);
}, 200);
}}
class="admin-button"
>{$t('admin_page.next_question', { question: game_state.selected_question + 2 })}
>{$t('admin_page.next_question', {
question: game_state.selected_question + 2
})}
</button>
{:else}
<button onclick={() => socket_game_controls.get_question_results(game_token, game_state.shown_question_now)} class="admin-button"
<button
onclick={() =>
socket_game_controls.get_question_results(
game_token,
game_state.shown_question_now
)}
class="admin-button"
>{$t('admin_page.show_results')}
</button>
{/if}
@@ -91,7 +107,9 @@ SPDX-License-Identifier: MPL-2.0
socket_game_controls.set_question_number(game_state.selected_question + 1);
}}
class="admin-button"
>{$t('admin_page.next_question', { question: game_state.selected_question + 2 })}
>{$t('admin_page.next_question', {
question: game_state.selected_question + 2
})}
</button>
{:else}
<button onclick={show_solutions} class="admin-button"
frontend/src/lib/play/admin/game_not_started.svelte
+8 -3
View File
@@ -11,7 +11,7 @@ SPDX-License-Identifier: MPL-2.0
import GrayButton from '$lib/components/buttons/gray.svelte';
import { fade } from 'svelte/transition';
import { SocketGameControls } from '$lib/play/admin/socket_game_controls.ts';
import { GameState } from '$lib/play/admin/game_state';
import type { GameState } from '$lib/play/admin/game_state';
interface Props {
game_pin: string;
@@ -20,7 +20,12 @@ SPDX-License-Identifier: MPL-2.0
cqc_code: string;
}
let { game_pin, game_state = $bindable(), socket_game_controls, cqc_code = $bindable() }: Props = $props();
let {
game_pin,
game_state = $bindable(),
socket_game_controls,
cqc_code = $bindable()
}: Props = $props();
let fullscreen_open = $state(false);
const { t } = getLocalization();
@@ -96,7 +101,7 @@ SPDX-License-Identifier: MPL-2.0
<GrayButton
disabled={game_state.players.length < 1}
onclick={() => {
socket_game_controls.start_game()
socket_game_controls.start_game();
}}
>{$t('admin_page.start_game')}
</GrayButton>
frontend/src/lib/play/admin/game_state.ts
+1 -1
View File
@@ -3,7 +3,7 @@
// SPDX-License-Identifier: MPL-2.0
import type { Player, PlayerAnswer } from '$lib/admin.ts';
import { QuizData } from '$lib/quiz_types';
import type { QuizData } from '$lib/quiz_types';
/**
* Interface that include all the game states for the admin page.
frontend/src/routes/admin/+page.svelte
+44 -39
View File
@@ -16,8 +16,9 @@ SPDX-License-Identifier: MPL-2.0
import GrayButton from '$lib/components/buttons/gray.svelte';
import { page } from '$app/state';
import { SocketGameControls } from '$lib/play/admin/socket_game_controls.ts';
import { IGameState } from '$lib/play/admin/game_state.ts';
import { QuizQuestionType } from '$lib/quiz_types';
import type { IGameState } from '$lib/play/admin/game_state.ts';
import { QuizQuestionType, type QuizData } from '$lib/quiz_types';
import type { Player, PlayerAnswer } from '$lib/admin';
navbarVisible.visible = false;
@@ -61,31 +62,37 @@ SPDX-License-Identifier: MPL-2.0
this.answer_count = $state(0);
}
isGameReadyToStart(): boolean {
is_game_ready_to_start(): boolean {
return !this.game_started && this.players.length > 0;
}
isGameStarting(): boolean {
is_game_starting(): boolean {
return this.game_started && this.selected_question === -1;
}
isActiveQuestionLastQuestion(): boolean {
is_active_question_last_question(): boolean {
return this.selected_question + 1 === this.quiz_data.questions.length;
}
isQuestionResultsVisible(): boolean {
return this.timer_res === '0' && this.question_results !== null
is_question_results_visible(): boolean {
return this.timer_res === '0' && this.question_results !== null;
}
isActiveQuestionSlide(): boolean {
return this.quiz_data?.questions?.[this.selected_question]?.type === QuizQuestionType.SLIDE;
is_active_question_slide(): boolean {
return (
this.quiz_data?.questions?.[this.selected_question]?.type === QuizQuestionType.SLIDE
);
}
isQuestionEnded(): boolean {
return this.timer_res === '0' && this.question_results === null && this.selected_question !== -1;
is_question_ended(): boolean {
return (
this.timer_res === '0' &&
this.question_results === null &&
this.selected_question !== -1
);
}
isQuestionStillOngoing(): boolean {
is_question_still_ongoing(): boolean {
return this.timer_res !== '0' && this.selected_question !== -1;
}
}
@@ -100,7 +107,6 @@ SPDX-License-Identifier: MPL-2.0
let warnToLeave = true;
let export_token = $state(undefined);
const socket_game_controls: SocketGameControls = new SocketGameControls(socket);
let game_state: GameState = $state(new GameState(game_token));
@@ -191,38 +197,41 @@ SPDX-License-Identifier: MPL-2.0
window.matchMedia('(prefers-color-scheme: dark)').matches);
}
let bg_color = $derived(game_state.quiz_data ? game_state.quiz_data.background_color : undefined);
let bg_image = $derived(game_state.quiz_data ? game_state.quiz_data.background_image : undefined);
let bg_color = $derived(
game_state.quiz_data ? game_state.quiz_data.background_color : undefined
);
let bg_image = $derived(
game_state.quiz_data ? game_state.quiz_data.background_image : undefined
);
let results_saved = $state(false);
let show_final_results = $derived(JSON.stringify(game_state.final_results) !== JSON.stringify([null]));
let show_final_results = $derived(
JSON.stringify(game_state.final_results) !== JSON.stringify([null])
);
// This function in called in every keyboard event in this page
const next_action = (e: KeyboardEvent) => {
if((e.key in ["Enter", " "])) return; // Don't catch events other than enter or spacebar
if (e.key in ['Enter', ' ']) return; // Don't catch events other than enter or spacebar
if(game_state.isGameReadyToStart()) {
socket_game_controls.start_game()
}
else if(game_state.isActiveQuestionLastQuestion() && (game_state.isQuestionResultsVisible() || game_state.isActiveQuestionSlide())){
if (game_state.is_game_ready_to_start()) {
socket_game_controls.start_game();
} else if (
game_state.is_active_question_last_question() &&
(game_state.is_question_results_visible() || game_state.is_active_question_slide())
) {
socket_game_controls.get_final_results();
}
else if(game_state.isGameStarting() || game_state.isQuestionResultsVisible() || game_state.isActiveQuestionSlide()) {
} else if (
game_state.is_game_starting() ||
game_state.is_question_results_visible() ||
game_state.is_active_question_slide()
) {
socket_game_controls.set_question_number(game_state.selected_question + 1);
}
else if(game_state.isQuestionStillOngoing()) {
} else if (game_state.is_question_still_ongoing()) {
socket_game_controls.show_solutions();
game_state.timer_res = '0';
}
else if(game_state.isQuestionEnded()) {
} else if (game_state.is_question_ended()) {
socket_game_controls.get_question_results(game_token, game_state.shown_question_now);
}
else {
} else {
console.warn('No action available for this event');
}
};
@@ -294,11 +303,7 @@ SPDX-License-Identifier: MPL-2.0
cqc_code={page.url.searchParams.get('cqc_code')}
/>
{:else}
<SomeAdminScreen
{game_token}
{bg_color}
bind:game_state
/>
<SomeAdminScreen {game_token} {bg_color} bind:game_state />
{/if}
</div>
<a