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

🐛 Fixed Analytics popup only showing up once

Browse Source
This commit is contained in:
Mawoka
2023-07-02 20:30:24 +02:00
parent 99232b442d
commit 06ecef24d5
2 changed files with 60 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/routes/dashboard/+page.svelte
+1 -3
View File
@@ -93,9 +93,7 @@ SPDX-License-Identifier: MPL-2.0
<svelte:head>
<title>ClassQuiz - Dashboard</title>
</svelte:head>
{#if analytics_quiz_selected}
<Analytics bind:quiz={analytics_quiz_selected} />
{/if}
<Analytics bind:quiz={analytics_quiz_selected} />
<div class="min-h-screen flex flex-col">
{#await getData()}
<svg class="h-8 w-8 animate-spin mx-auto my-20" viewBox="3 3 18 18">
frontend/src/routes/dashboard/Analytics.svelte
+59 -50
View File
@@ -30,54 +30,63 @@ SPDX-License-Identifier: MPL-2.0
});
</script>
<div
class="fixed w-full h-full top-0 flex bg-black bg-opacity-50 z-50"
on:click={on_parent_click}
transition:fade|local={{ duration: 100 }}
>
<div class="m-auto bg-white dark:bg-gray-600 rounded shadow-2xl flex p-4 flex-col w-2/3 h-5/6">
<h1 class="text-center text-5xl">{$t('words.analytics')}</h1>
<section class="flex flex-col gap-2 mt-8">
<h2 class="mx-auto text-2xl">{$t('words.rating')}</h2>
<table class="w-fit mx-auto">
<tr class="border-b-2 dark:border-gray-500 text-left border-gray-300">
<th class="border-r dark:border-gray-500 p-1 mx-auto border-gray-300"
>{$t('words.like', { count: 2 })}</th
>
<th class="p-1 mx-auto">{$t('words.dislike', { count: 2 })}</th>
</tr>
<tr class="text-left">
<td class="border-r dark:border-gray-500 p-1 border-gray-300">{quiz.likes}</td>
<td class="mx-auto p-1">{quiz.dislikes}</td>
</tr>
</table>
</section>
<section class="flex flex-col gap-2 mt-8">
<h2 class="mx-auto text-2xl">{$t('dashboard.views_n_plays')}</h2>
<table class="w-fit mx-auto">
<tr class="border-b-2 dark:border-gray-500 text-left border-gray-300">
<th class="border-r dark:border-gray-500 p-1 mx-auto border-gray-300"
>{$t('words.view', { count: 2 })}</th
>
<th class="p-1 mx-auto">{$t('words.play', { count: 2 })}</th>
</tr>
<tr class="text-left">
<td class="border-r dark:border-gray-500 p-1 border-gray-300">{quiz.views}</td>
<td class="mx-auto p-1">{quiz.plays}</td>
</tr>
</table>
</section>
<section class="flex flex-col gap-2 mt-8">
<h2 class="mx-auto text-2xl">{$t('words.info')}</h2>
<p class="mx-auto max-w-[70%] text-center">
{$t('dashboard.info_analytics')}
</p>
</section>
<section class="mt-auto">
<p class="mt-6 mx-auto max-w-[70%] text-sm dark:text-gray-200 text-center">
Since there's still some space left down here, I guess that I take this opportunity
to thank You for using ClassQuiz! Have a great day and continue using ClassQuiz ;)
</p>
</section>
{#if quiz}
<div
class="fixed w-full h-full top-0 flex bg-black bg-opacity-50 z-50 overflow-scroll"
on:click={on_parent_click}
transition:fade|local={{ duration: 100 }}
>
<div
class="m-auto bg-white dark:bg-gray-600 rounded shadow-2xl flex p-4 flex-col lg:w-2/3 w-11/12 h-5/6"
>
<h1 class="text-center text-5xl">{$t('words.analytics')}</h1>
<section class="flex flex-col gap-2 mt-8">
<h2 class="mx-auto text-2xl">{$t('words.rating')}</h2>
<table class="w-fit mx-auto">
<tr class="border-b-2 dark:border-gray-500 text-left border-gray-300">
<th class="border-r dark:border-gray-500 p-1 mx-auto border-gray-300"
>{$t('words.like', { count: 2 })}</th
>
<th class="p-1 mx-auto">{$t('words.dislike', { count: 2 })}</th>
</tr>
<tr class="text-left">
<td class="border-r dark:border-gray-500 p-1 border-gray-300"
>{quiz.likes}</td
>
<td class="mx-auto p-1">{quiz.dislikes}</td>
</tr>
</table>
</section>
<section class="flex flex-col gap-2 mt-8">
<h2 class="mx-auto text-2xl">{$t('dashboard.views_n_plays')}</h2>
<table class="w-fit mx-auto">
<tr class="border-b-2 dark:border-gray-500 text-left border-gray-300">
<th class="border-r dark:border-gray-500 p-1 mx-auto border-gray-300"
>{$t('words.view', { count: 2 })}</th
>
<th class="p-1 mx-auto">{$t('words.play', { count: 2 })}</th>
</tr>
<tr class="text-left">
<td class="border-r dark:border-gray-500 p-1 border-gray-300"
>{quiz.views}</td
>
<td class="mx-auto p-1">{quiz.plays}</td>
</tr>
</table>
</section>
<section class="flex flex-col gap-2 mt-8">
<h2 class="mx-auto text-2xl">{$t('words.info')}</h2>
<p class="mx-auto max-w-[70%] text-center">
{$t('dashboard.info_analytics')}
</p>
</section>
<section class="mt-auto">
<p class="mt-6 mx-auto max-w-[70%] text-sm dark:text-gray-200 text-center">
Since there's still some space left down here, I guess that I take this
opportunity to thank You for using ClassQuiz! Have a great day and continue
using ClassQuiz ;)
</p>
</section>
</div>
</div>
</div>
{/if}