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

✨ Big update to the admin-screen and smaller bug-fixes

Browse Source
This commit is contained in:
Mawoka
2022-06-24 17:34:03 +02:00
parent c19e362aaf
commit ffee61fde3
14 changed files with 375 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files
classquiz/routers/editor.py
+2 -3
View File
@@ -154,13 +154,12 @@ async def finish_edit(edit_id: str, quiz_input: QuizInput):
mark_image_for_deletion(question.image, i, old_quiz_data)
else:
raise HTTPException(status_code=400, detail="Image URL(s) aren't valid!")
print(images_to_delete)
if session_data.edit:
quiz = old_quiz_data
meilisearch.index(settings.meilisearch_index).update_documents([await get_meili_data(quiz)])
if quiz.public and not quiz_input.public:
if not quiz_input.public:
meilisearch.index(settings.meilisearch_index).delete_document(str(quiz.id))
if not quiz.public and quiz_input.public:
else:
meilisearch.index(settings.meilisearch_index).add_documents([await get_meili_data(quiz)])
quiz.title = quiz_input.title
quiz.public = quiz_input.public
frontend/src/app.html
+6
View File
@@ -6,6 +6,12 @@
<!-- <link rel="icon" href="%sveltekit.assets%/favicon.png" />-->
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="prefetch" href="https://sugar.mawoka.eu.org/" />
<script
async=""
defer=""
data-domain="classquiz.mawoka.eu"
src="https://sugar.mawoka.eu.org/js/plausible.hash.outbound-links.js"
></script>
<script>
window.plausible =
window.plausible ||
frontend/src/lib/admin.svelte
+177
View File
@@ -0,0 +1,177 @@
<script lang="ts">
import type { QuizData } from '$lib/quiz_types';
import { getLocalization } from '$lib/i18n';
import { get_question_title, getWinnersSorted } from '$lib/admin.ts';
import type { PlayerAnswer } from '$lib/admin.ts';
import { socket } from './socket';
export let game_token: string;
export let quiz_data: QuizData;
const { t } = getLocalization();
let question_results = null;
export let final_results: Array<null> | Array<Array<PlayerAnswer>> = [null];
let selected_question = -1;
let timer_res: string;
let shown_question_now: number;
let final_results_clicked = false;
console.log(quiz_data);
const set_question_number = (q_number: number) => {
question_results = null;
socket.emit('set_question_number', q_number.toString());
shown_question_now = q_number;
timer_res = quiz_data.questions[q_number].time;
selected_question += 1;
timer(timer_res);
};
const get_question_results = () => {
socket.emit('get_question_results', {
game_id: game_token,
question_number: shown_question_now
});
timer_res = '0';
};
const get_final_results = () => {
socket.emit('get_final_results', {});
final_results_clicked = true;
};
socket.on('final_results', (data) => {
// data = JSON.parse(data);
final_results = data;
console.log(getWinnersSorted(quiz_data, final_results));
});
socket.on('question_results', (data) => {
question_results = JSON.parse(data);
});
const timer = (time: string) => {
let seconds = Number(time);
let timer_interval = setInterval(() => {
if (timer_res === '0') {
clearInterval(timer_interval);
return;
} else {
seconds--;
}
timer_res = seconds.toString();
}, 1000);
};
</script>
{#if timer_res === undefined}
<span>Select a question to start!</span>
{:else if !final_results_clicked}
<div class="w-full flex justify-center">
<span>{$t('admin_page.time_left')}: {timer_res}</span>
</div>
{/if}
<br />
{#if timer_res === '0'}
{#if question_results === null}
<div class="w-full flex justify-center">
<button
on:click={get_question_results}
id="GetQuestionResults"
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
>{$t('admin_page.get_results')}</button
>
</div>
{:else}
<div class="w-full flex justify-center">
<div class="relative overflow-x-auto shadow-md rounded-lg">
<table class="w-fit text-sm text-left text-gray-500 dark:text-gray-400">
<thead
class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400"
>
<tr>
<th scope="col" class="px-6 py-3">
{$t('words.username')}
</th>
<th scope="col" class="px-6 py-3">
{$t('words.answer')}
</th>
<th scope="col" class="px-6 py-3">
{$t('words.correct')}?
</th>
</tr>
</thead>
<tbody>
{#each question_results as result}
<tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
<th
scope="row"
class="px-6 py-4 font-medium text-gray-900 dark:text-white whitespace-nowrap"
>
{result.username}
</th>
<td class="px-6 py-4">
{result.answer}
</td>
<td class="px-6 py-4">
{#if result.right}
✅
{:else}
❌
{/if}
</td>
</tr>
{/each}
</tbody>
</table>
</div>
</div>
{/if}
{:else if timer_res !== undefined}
<div class="w-full flex justify-center">
<button
on:click={get_question_results}
id="GetQuestionResultsAndStopTime"
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
>{$t('admin_page.get_results_and_stop_time')}</button
>
</div>
{/if}
<br />
{#if get_question_title(selected_question + 1, quiz_data) !== '' && selected_question + 1 !== 0}
<div class="w-full flex justify-center">
<button
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
disabled={!(timer_res === undefined || timer_res === '0')}
id="SetQuestionNumber"
on:click={() => {
set_question_number(selected_question + 1);
}}
>{$t('admin_page.show_next_question')}: {get_question_title(
selected_question + 1,
quiz_data
)}</button
>
</div>
{:else if selected_question + 1 === 0}
<div class="w-full flex justify-center">
<button
on:click={() => {
set_question_number(0);
}}
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
>
{$t('admin_page.start_by_showing_first_question')}
</button>
</div>
{:else if final_results_clicked === false}
<div class="w-screen flex justify-center">
<button
on:click={get_final_results}
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
>{$t('admin_page.get_final_results')}</button
>
</div>
{/if}
frontend/src/lib/admin.ts
+56
View File
@@ -0,0 +1,56 @@
import type { QuizData } from '$lib/quiz_types';
export const get_question_title = (q_number: number, quiz_data: QuizData): string => {
if (q_number - 1 === quiz_data.questions.length) {
return;
}
try {
return quiz_data.questions[q_number].question;
} catch (e) {
return '';
}
};
export const getWinnersSorted = (
quiz_data: QuizData,
final_results: Array<null> | Array<Array<PlayerAnswer>>
) => {
const winners = {};
const q_count = quiz_data.questions.length;
for (let i = 0; i < q_count; i++) {
const q_res = final_results[i];
if (q_res === null) {
continue;
}
for (let j = 0; j < q_res.length; j++) {
const res = q_res[j];
if (res['right']) {
if (winners[res['username']] === undefined) {
winners[res['username']] = 0;
}
winners[res['username']] += 1;
}
}
}
function sortObjectbyValue(obj) {
const asc = false;
const ret = {};
Object.keys(obj)
.sort((a, b) => obj[asc ? a : b] - obj[asc ? b : a])
.forEach((s) => (ret[s] = obj[s]));
return ret;
}
return sortObjectbyValue(winners);
};
export interface Player {
username: string;
}
export interface PlayerAnswer {
username: string;
answer: string;
right: string;
}
frontend/src/lib/hashcash.ts
+2 -2
View File
@@ -1,5 +1,4 @@
import { DateTime } from 'luxon';
import { plausible } from '$lib/stores';
const gen_salt = (l: number): string => {
const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
@@ -47,6 +46,7 @@ export const mint = async (
counter += 1;
}
const t2 = performance.now();
plausible.trackEvent('Hashcash', { props: { ms_taken: t2 - t1 } });
// eslint-disable-next-line no-undef
plausible('Hashcash', { props: { ms_taken: t2 - t1 } });
return `${challenge}:${result}`;
};
frontend/src/lib/i18n/locales/en.json
+17 -3
View File
@@ -13,7 +13,8 @@
},
"overview_page": {
"created_at": "Created at",
"question_count": "Question count"
"question_count": "Question count",
"no_quizzes": "Looks like you don't have any quizzes. Wanna change that? Click the \"Create\"-button, or import a quiz from KAHOOT!"
},
"edit_page": {
"success_update_title": "Successfully updated quiz!",
@@ -92,7 +93,11 @@
"screenshot": "Screenshot",
"screenshot_plural": "Screenshots",
"browser": "Browser",
"view": "View"
"view": "View",
"correct": "Correct",
"result": "",
"result_plural": "",
"count": ""
},
"editor": {
"time_in_seconds": "Time in seconds",
@@ -114,7 +119,9 @@
"get_results": "Get results",
"get_results_and_stop_time": "Get results and stop time",
"get_final_results": "Get final results",
"export_results": "Export results"
"export_results": "Export results",
"show_next_question": "Show next question",
"start_by_showing_first_question": "Start by showing the first question!"
},
"password_reset_page": {
"reset_password": "Reset password"
@@ -134,5 +141,12 @@
},
"search_page": {
"at_least_3_characters": "Enter at least 3 characters..."
},
"play_page": {
"end_sentence": "That's it! This was the quiz.",
"1st_place": "1st Place",
"2nd_place": "2nd Place",
"3rd place": "3rd Place",
"with_out_of": "with {{correct_questions}} out of {{total_question_count}}"
}
}
frontend/src/lib/play/end.svelte
+13 -5
View File
@@ -1,5 +1,8 @@
<script lang="ts">
import type { QuizData } from '$lib/quiz_types';
import { getLocalization } from '$lib/i18n';
const { t } = getLocalization();
export let quiz_data: QuizData;
export let final_results: Array<null> | Array<Array<PlayerAnswer>>;
@@ -46,19 +49,19 @@
</script>
<div>
<h1 class="mx-auto text-center text-6xl mt-8">That's it! This was the quiz.</h1>
<h1 class="mx-auto text-center text-6xl mt-8">{$t('play_page.end_sentence')}</h1>
<div class="flex mx-auto w-fit flex-col pt-8 gap-2">
<div>
<p class="text-3xl text-center">
1st Place: <span class="underline">{winners_arr[0]}</span>
{$t('play_page.1st_place')}: <span class="underline">{winners_arr[0]}</span>
<span>with {winners[winners_arr[0]]} out of {quiz_data.questions.length}</span>
</p>
</div>
{#if winners_arr.length >= 2}
<div>
<p class="text-2xl text-center">
2nd Place: <span class="underline">{winners_arr[1]}</span>
{$t('play_page.2nd_place')}: <span class="underline">{winners_arr[1]}</span>
<span>with {winners[winners_arr[1]]} out of {quiz_data.questions.length}</span>
</p>
</div>
@@ -66,8 +69,13 @@
{#if winners_arr.length >= 3}
<div>
<p class="text-xl text-center">
3rd Place: <span class="underline">{winners_arr[2]}</span>
<span>with {winners[winners_arr[2]]} out of {quiz_data.questions.length}</span>
{$t('play_page.3rd place')}: <span class="underline">{winners_arr[2]}</span>
<span>
{$t('play_page.with_out_of', {
correct_questions: winners[winners_arr[2]],
total_question_count: quiz_data.questions.length
})}
</span>
</p>
</div>
{/if}
frontend/src/lib/play/show_results.svelte
+54 -58
View File
@@ -1,6 +1,8 @@
<script lang="ts">
import type { Answer, QuizData } from '$lib/quiz_types';
import { getLocalization } from '$lib/i18n';
const { t } = getLocalization();
export let results: Array<Answer>;
export let game_data: QuizData;
export let question_index: string;
@@ -14,8 +16,6 @@
for (let i = 0; i < results.length; i++) {
data_store[results[i].answer] += 1;
}
console.log(data_store);
</script>
<!-- Show the results from the results object -->
@@ -23,62 +23,58 @@
<!-- Path: frontend/src/lib/play/show_results.svelte -->
<div>
<h2>Results</h2>
<div class="flex flex-col mx-auto">
<div class="overflow-x-auto sm:-mx-6 lg:-mx-8">
<div class="inline-block py-2 min-w-full sm:px-6 lg:px-8">
<div class="overflow-hidden shadow-md sm:rounded-lg">
<table class="min-w-full">
<thead class="bg-gray-50 dark:bg-gray-700">
<tr>
<th
scope="col"
class="py-3 px-6 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400"
>
Answer
</th>
<th
scope="col"
class="py-3 px-6 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400"
>
Count
</th>
<th
scope="col"
class="py-3 px-6 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400"
>
Right
</th>
</tr>
</thead>
<tbody>
<!-- Product 1 -->
{#each game_data.questions[parseInt(question_index)].answers as answer}
<tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
<td
class="py-4 px-6 text-sm font-medium text-gray-900 whitespace-nowrap dark:text-white"
>
{answer.answer}
</td>
<td
class="py-4 px-6 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400"
>
{data_store[answer.answer]}
</td>
<td
class="py-4 px-6 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400"
>
{#if answer.right}
✅
{:else}
❌
{/if}
</td>
</tr>{/each}
</tbody>
</table>
</div>
</div>
<h2 class="text-center text-3xl mb-8">{$t('words.result', { count: 2 })}</h2>
<div class="w-screen flex justify-center">
<div class="relative overflow-x-auto shadow-md rounded-lg">
<table class="w-fit text-sm text-left text-gray-500 dark:text-gray-400">
<thead class="bg-gray-50 dark:bg-gray-700">
<tr>
<th
scope="col"
class="py-3 px-6 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400"
>
{$t('words.answer')}
</th>
<th
scope="col"
class="py-3 px-6 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400"
>
{$t('words.count')}
</th>
<th
scope="col"
class="py-3 px-6 text-xs font-medium tracking-wider text-left text-gray-700 uppercase dark:text-gray-400"
>
{$t('words.correct')}
</th>
</tr>
</thead>
<tbody>
{#each game_data.questions[parseInt(question_index)].answers as answer}
<tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
<td
class="py-4 px-6 text-sm font-medium text-gray-900 whitespace-nowrap dark:text-white"
>
{answer.answer}
</td>
<td
class="py-4 px-6 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400"
>
{data_store[answer.answer]}
</td>
<td
class="py-4 px-6 text-sm text-gray-500 whitespace-nowrap dark:text-gray-400"
>
{#if answer.right}
✅
{:else}
❌
{/if}
</td>
</tr>
{/each}
</tbody>
</table>
</div>
</div>
</div>
frontend/src/lib/stores.ts
-7
View File
@@ -8,7 +8,6 @@ export const alertModal = writable({ open: false, title: '', body: '' });
import { goto } from '$app/navigation';
import { page } from '$app/stores';
import Plausible from 'plausible-tracker';
const URLSearchParamsToObject = (params: URLSearchParams) => {
const obj = {};
@@ -42,9 +41,3 @@ export const createQueryParamsStore = (key: string) => {
}
};
};
export const plausible = Plausible({
domain: 'classquiz.mawoka.eu',
apiHost: 'https://sugar.mawoka.eu.org',
trackLocalhost: true
});
frontend/src/routes/__layout.svelte
-3
View File
@@ -18,7 +18,6 @@
import { initLocalizationContext } from '$lib/i18n';
import { browser } from '$app/env';
import Alert from '$lib/modals/alert.svelte';
import { plausible } from '$lib/stores';
/* afterNavigate(() => {
if (browser) {
@@ -33,8 +32,6 @@
});*/
if (browser) {
plausible.enableAutoPageviews();
plausible.enableAutoOutboundTracking();
pathname.set(window.location.pathname);
if (
localStorage.theme === 'dark' ||
frontend/src/routes/admin.svelte
+41 -167
View File
@@ -28,6 +28,8 @@
import { socket } from '$lib/socket';
import { getLocalization } from '$lib/i18n';
import { navbarVisible } from '$lib/stores';
import type { PlayerAnswer, Player } from '$lib/admin.ts';
import SomeAdminScreen from '$lib/admin.svelte';
navbarVisible.set(false);
@@ -41,16 +43,6 @@
export let auto_connect: boolean;
export let game_token: string;
interface Player {
username: string;
}
interface PlayerAnswer {
username: string;
answer: string;
right: string;
}
let players: Array<Player> = [];
let errorMessage = '';
let game_started = false;
@@ -59,12 +51,9 @@
let question_results = null;
let final_results: Array<null> | Array<Array<PlayerAnswer>> = [null];
let success = false;
let selected_question = -1;
let timer_res: string;
let dataexport_download_a;
let warnToLeave = true;
let shown_question_now: number;
const connect = () => {
socket.emit('register_as_admin', {
game_pin: game_pin,
@@ -85,53 +74,6 @@
socket.on('already_registered_as_admin', () => {
errorMessage = $t('admin_page.already_registered_as_admin');
});
const set_question_number = (q_number: number) => {
question_results = null;
socket.emit('set_question_number', q_number.toString());
shown_question_now = q_number;
timer_res = quiz_data.questions[q_number].time;
selected_question += 1;
timer(timer_res);
};
const get_question_results = () => {
socket.emit('get_question_results', {
game_id: game_token,
question_number: shown_question_now
});
timer_res = '0';
};
const getWinnersSorted = () => {
let winners = {};
let q_count = quiz_data.questions.length;
for (let i = 0; i < q_count; i++) {
let q_res = final_results[i];
if (q_res === null) {
continue;
}
for (let j = 0; j < q_res.length; j++) {
let res = q_res[j];
if (res['right']) {
if (winners[res['username']] === undefined) {
winners[res['username']] = 0;
}
winners[res['username']] += 1;
}
}
}
function sortObjectbyValue(obj) {
const asc = false;
const ret = {};
Object.keys(obj)
.sort((a, b) => obj[asc ? a : b] - obj[asc ? b : a])
.forEach((s) => (ret[s] = obj[s]));
return ret;
}
return sortObjectbyValue(winners);
};
socket.on('question_results', (data) => {
try {
@@ -149,30 +91,6 @@
warnToLeave = true;
});
const get_final_results = () => {
socket.emit('get_final_results', {});
};
socket.on('final_results', (data) => {
// data = JSON.parse(data);
final_results = data;
console.log(getWinnersSorted());
});
const timer = (time: string) => {
let seconds = Number(time);
let timer_interval = setInterval(() => {
if (timer_res === '0') {
clearInterval(timer_interval);
return;
} else {
seconds--;
}
timer_res = seconds.toString();
}, 1000);
};
const confirmUnload = () => {
if (warnToLeave) {
event.preventDefault();
@@ -180,16 +98,6 @@
}
};
const get_question_title = (q_number: number): string => {
if (q_number - 1 === quiz_data.questions.length) {
return;
}
try {
return quiz_data.questions[q_number].question;
} catch (e) {
return '';
}
};
const request_answer_export = async () => {
await socket.emit('get_export_token');
};
@@ -199,7 +107,18 @@
<svelte:head>
<title>ClassQuiz - Host</title>
</svelte:head>
{#if JSON.stringify(final_results) !== JSON.stringify([null])}
<div class="w-screen flex justify-center mt-8">
<button
on:click={request_answer_export}
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
>{$t('admin_page.export_results')}</button
>
</div>
{#await import('$lib/play/end.svelte') then c}
<svelte:component this={c.default} bind:final_results bind:quiz_data />
{/await}
{/if}
{#if !success}
<input placeholder="game id" bind:value={game_token} />
<input placeholder="game pin" bind:value={game_pin} />
@@ -210,84 +129,39 @@
{:else if !game_started}
<img
alt="QR code to join the game"
src="/api/v1/utils/qr/{quiz_data.game_pin}?ref=qr"
src="/api/v1/utils/qr/{quiz_data.game_pin}"
class="block mx-auto w-1/6"
/>
<p class="text-3xl text-center">{$t('words.pin')}: {quiz_data.game_pin}</p>
<ul>
{#if players.length > 0}
{#each players as player}
<li>
<span>{player.username} </span>
<button>{$t('words.kick')}</button>
</li>
{/each}
{/if}
</ul>
<p class="text-3xl text-center ">{$t('words.pin')}: {quiz_data.game_pin}</p>
<div class="flex justify-center w-full mt-4">
<ul class="list-disc pl-8">
{#if players.length > 0}
{#each players as player}
<li>
<span>{player.username}</span>
<!-- <button>{$t('words.kick')}</button>-->
</li>
{/each}
{/if}
</ul>
</div>
{#if players.length > 0}
<button
id="startGame"
on:click={() => {
socket.emit('start_game', '');
game_started = true;
}}
>{$t('admin_page.start_game')}
</button>
<div class="flex justify-center w-full mt-4">
<button
class="ml-4 px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
id="startGame"
on:click={() => {
socket.emit('start_game', '');
game_started = true;
}}
>{$t('admin_page.start_game')}
</button>
</div>
{/if}
{:else}
{#if timer_res === undefined}
<span>Select a question to start!</span>
{:else}
<span>{$t('admin_page.time_left')}: {timer_res}</span>
{/if}
<br />
{#if timer_res === '0'}
{#if question_results === null}
<button on:click={get_question_results} id="GetQuestionResults"
>{$t('admin_page.get_results')}</button
>
<br />
{:else}
<br />
<ul>
{#each question_results as result}
<li>{result.username} - {result.answer} - {result.right}</li>
{/each}
</ul>
{/if}
{:else if timer_res !== undefined}
<button on:click={get_question_results} id="GetQuestionResultsAndStopTime"
>{$t('admin_page.get_results_and_stop_time')}</button
>
{/if}
<br />
<!--{#each quiz_data.questions as { question }, index}
<button
on:click={() => {
set_question_number(index);
}}>{index}: {question}</button
>
<br />
{/each}-->
{#if get_question_title(selected_question + 1) !== ''}
<button
disabled={!(timer_res === undefined || timer_res === '0')}
id="SetQuestionNumber"
on:click={() => {
set_question_number(selected_question + 1);
}}>{selected_question + 1}: {get_question_title(selected_question + 1)}</button
>
<br />
{:else}
<button on:click={get_final_results}>{$t('admin_page.get_final_results')}</button>
{/if}
{/if}
{#if JSON.stringify(final_results) !== JSON.stringify([null])}
<button on:click={request_answer_export}>{$t('admin_page.export_results')}</button>
{#await import('$lib/play/end.svelte') then c}
<svelte:component this={c.default} bind:final_results bind:quiz_data />
{/await}
<SomeAdminScreen bind:final_results bind:game_pin bind:game_token bind:quiz_data />
{/if}
<a
on:click|preventDefault={request_answer_export}
href="#"
frontend/src/routes/overview.svelte
+3 -5
View File
@@ -19,7 +19,7 @@
import { DateTime } from 'luxon';
import { getLocalization } from '$lib/i18n';
import Footer from '$lib/footer.svelte';
import { alertModal, navbarVisible, signedIn, plausible } from '$lib/stores';
import { alertModal, navbarVisible, signedIn } from '$lib/stores';
interface QuizData {
id: string;
@@ -71,7 +71,7 @@
}
const data = await res.json();
// eslint-disable-next-line no-undef
plausible.trackEvent('Started Game', { props: { quiz_id: id } });
plausible('Started Game', { props: { quiz_id: id } });
window.location.replace(`/admin?token=${data.game_id}&pin=${data.game_pin}&connect=1`);
};
@@ -250,9 +250,7 @@
</div>
{:else}
<p>
<!-- TODO: Add translation -->
Looks like you don't have any quizzes. Wanna change that? Click the "Create"-button,
or import a quiz from KAHOOT!
{$t('overview_page.no_quizzes')}
</p>
{/if}
</div>
frontend/src/routes/play.svelte
+2 -2
View File
@@ -21,7 +21,7 @@
import ShowTitle from '$lib/play/title.svelte';
import Question from '$lib/play/question.svelte';
import ShowResults from '$lib/play/show_results.svelte';
import { navbarVisible, plausible } from '$lib/stores';
import { navbarVisible } from '$lib/stores';
import ShowEndScreen from '$lib/play/end.svelte';
// Exports
@@ -66,7 +66,7 @@
console.log('joined_game', data);
gameData = JSON.parse(data);
// eslint-disable-next-line no-undef
plausible.trackEvent('Joined Game', { props: { quiz_id: gameData.quiz_id } });
plausible('Joined Game', { props: { quiz_id: gameData.quiz_id } });
});
socket.on('game_not_found', () => {
frontend/src/routes/view/[quiz_id].svelte
+2 -2
View File
@@ -28,7 +28,6 @@
import { createTippy } from 'svelte-tippy';
import 'tippy.js/animations/perspective-subtle.css';
import 'tippy.js/dist/tippy.css';
import { plausible } from '$lib/stores';
const tippy = createTippy({
arrow: true,
@@ -80,7 +79,7 @@
}
const data = await res.json();
// eslint-disable-next-line no-undef
plausible.trackEvent('Started Game', { props: { quiz_id: id } });
plausible('Started Game', { props: { quiz_id: id } });
window.location.replace(`/admin?token=${data.game_id}&pin=${data.game_pin}&connect=1`);
};
</script>
@@ -159,6 +158,7 @@
{:else}
<button
class="px-4 py-2 leading-5 text-white transition-colors duration-200 transform bg-gray-700 rounded text-center hover:bg-gray-600 focus:outline-none cursor-not-allowed opacity-50"
disabled
use:tippy={{ content: 'You need to be logged in to start a game' }}
>
{$t('words.start')}