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

🎨 Ran prettier

Browse Source
This commit is contained in:
Mawoka
2022-03-06 11:26:08 +01:00
parent 8a6f64dbc8
commit b8c0ba0179
16 changed files with 3626 additions and 2773 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/editor.svelte
+46 -28
View File
@@ -1,4 +1,4 @@
<script lang='ts'>
<script lang="ts">
interface Data {
public: boolean;
title: string;
@@ -18,15 +18,17 @@
}
export let data: Data;
export let submit_button_text = "Create";
export let submit_button_text = 'Create';
const empty_question: Question = {
question: '',
time: '20',
answers: [{
right: false,
answer: ''
}]
answers: [
{
right: false,
answer: ''
}
]
};
const empty_answer: Answer = {
@@ -35,57 +37,73 @@
};
</script>
<label>
<input type='checkbox' bind:checked={data.public}>
<input type="checkbox" bind:checked={data.public} />
Public?
</label>
<label>
<input type='text' placeholder='Title' bind:value={data.title} class='text-black' />
<input type="text" placeholder="Title" bind:value={data.title} class="text-black" />
Title
</label>
<label>
<textarea placeholder='Description' bind:value={data.description} class='text-black'></textarea>
<textarea placeholder="Description" bind:value={data.description} class="text-black" />
Description
</label>
{#each data.questions as question, index_question}
<div class='ml-8 grid grid-cols-1 gap-2 m-2 border border-black border-2'>
<h1 class='text-3xl'>Question {index_question + 1}</h1>
<div class="ml-8 grid grid-cols-1 gap-2 m-2 border border-black border-2">
<h1 class="text-3xl">Question {index_question + 1}</h1>
<label>
<input type='text' placeholder='Question' bind:value={question.question} class='text-black' />
<input
type="text"
placeholder="Question"
bind:value={question.question}
class="text-black"
/>
Question
</label>
<label>
<input type='text' placeholder='20' bind:value={question.time} class='text-black' />
<input type="text" placeholder="20" bind:value={question.time} class="text-black" />
Time in seconds
</label>
{#each question.answers as answer, index_answer}
<div class='ml-8 grid grid-cols-1 gap-2 m-2 border border-black border-2'>
<h1 class='text-3xl'>Answer {index_answer + 1}</h1>
<div class="ml-8 grid grid-cols-1 gap-2 m-2 border border-black border-2">
<h1 class="text-3xl">Answer {index_answer + 1}</h1>
<p>Answer: {index_answer} Question: {index_question}</p>
<label>
<input type='text' placeholder='Answer'
bind:value={data.questions[index_question].answers[index_answer].answer}
class='text-black' />
<input
type="text"
placeholder="Answer"
bind:value={data.questions[index_question].answers[index_answer].answer}
class="text-black"
/>
Answer
</label>
<label>
<input type='checkbox' bind:checked={answer.right} class='text-black' />
<input type="checkbox" bind:checked={answer.right} class="text-black" />
Right?
</label>
<button class='text-left'
on:click={() => {data.questions[index_question].answers = [...data.questions[index_question].answers, {...empty_answer}]}}>
<button
class="text-left"
on:click={() => {
data.questions[index_question].answers = [
...data.questions[index_question].answers,
{ ...empty_answer }
];
}}
>
Add new answer
</button>
</div>
{/each}
<button class='text-left' on:click={() => {data.questions = [...data.questions, {...empty_question}]}}>
Add new
question
<button
class="text-left"
on:click={() => {
data.questions = [...data.questions, { ...empty_question }];
}}
>
Add new question
</button>
</div>
{/each}
<button type='submit'>{submit_button_text}</button>
<button type="submit">{submit_button_text}</button>
frontend/src/lib/navbar.svelte
+47 -48
View File
@@ -12,85 +12,84 @@
</script>
<nav
class='w-screen px-4 lg:px-10 py-2 flex flex-col lg:flex-row lg:items-center fixed backdrop-blur-sm bg-white/60 shadow-md z-50 top-0'
class="w-screen px-4 lg:px-10 py-2 flex flex-col lg:flex-row lg:items-center fixed backdrop-blur-sm bg-white/60 shadow-md z-50 top-0"
>
<!-- Our logo and button -->
<section class='w-full lg:w-max flex justify-between'>
<section class="w-full lg:w-max flex justify-between">
<!-- Logo -->
<a href='/' class='font-black tracking-tight text-xl text-black marck-script link-hover'
>ClassQuiz</a
<a href="/" class="font-black tracking-tight text-xl text-black marck-script link-hover"
>ClassQuiz</a
>
<!-- Our open/close buttons -->
<!-- Open menu -->
<button class='lg:hidden' id='open-menu' on:click={toggleMenu} class:hidden={!openMenu}>
<button class="lg:hidden" id="open-menu" on:click={toggleMenu} class:hidden={!openMenu}>
<svg
xmlns='http://www.w3.org/2000/svg'
width='24'
height='24'
viewBox='0 0 24 24'
fill='none'
stroke='currentColor'
stroke-width='2'
stroke-linecap='round'
stroke-linejoin='round'
display='block'
id='TextAlignJustified'
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
display="block"
id="TextAlignJustified"
>
<path d='M3 6h18M3 12h18M3 18h18' />
<path d="M3 6h18M3 12h18M3 18h18" />
</svg>
</button>
<!-- Close menu -->
<button class='hidden' id='close-menu' class:hidden={!closeMenu} on:click={toggleMenu}>
<button class="hidden" id="close-menu" class:hidden={!closeMenu} on:click={toggleMenu}>
<svg
xmlns='http://www.w3.org/2000/svg'
width='14'
height='14'
viewBox='0 0 24 24'
fill='none'
stroke='currentColor'
stroke-width='3'
stroke-linecap='round'
stroke-linejoin='round'
display='block'
id='Cross'
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="3"
stroke-linecap="round"
stroke-linejoin="round"
display="block"
id="Cross"
>
<path d='M20 20L4 4m16 0L4 20' />
<path d="M20 20L4 4m16 0L4 20" />
</svg>
</button>
</section>
<!-- Our list of items -->
<ul
id='menu-items'
class='lg:flex w-full flex-col lg:flex-row lg:pl-6'
id="menu-items"
class="lg:flex w-full flex-col lg:flex-row lg:pl-6"
class:hidden={!menuItems}
>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/play'>Play</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/play">Play</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/account/register'>Register</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/account/register">Register</a
>
</li>
<li class='py-2'>
<li class="py-2">
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='/account/login'>Login</a
>
<li class='py-2'>
<a
class='text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover'
href='https://github.com/mawoka-myblock/classquiz'>GitHub</a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="/account/login">Login</a
>
</li>
<li class="py-2">
<a
class="text-lg font-medium lg:px-4 text-gray-600 hover:text-green-600 link-hover"
href="https://github.com/mawoka-myblock/classquiz">GitHub</a
>
</li>
</ul>
</nav>
frontend/src/lib/play/join.svelte
+21 -23
View File
@@ -1,4 +1,4 @@
<script lang='ts'>
<script lang="ts">
import { socket } from '$lib/socket';
import { onDestroy, onMount } from 'svelte';
import { browser } from '$app/env';
@@ -11,8 +11,7 @@
let hcaptcha = {
execute: async (_a, _b) => ({ response: '' }),
render: (_a, _b) => {
}
render: (_a, _b) => {}
};
let hcaptchaWidgetID;
@@ -33,8 +32,7 @@
if (browser) {
hcaptcha = {
execute: async () => ({ response: '' }),
render: () => {
}
render: () => {}
};
}
});
@@ -59,27 +57,27 @@
</script>
<svelte:head>
<script src='https://js.hcaptcha.com/1/api.js?render=explicit' async defer></script>
<script src="https://js.hcaptcha.com/1/api.js?render=explicit" async defer></script>
</svelte:head>
{#if game_pin === '' || game_pin.length <= 7}
<div class='flex flex-col justify-center align-center w-screen h-screen'>
<div class="flex flex-col justify-center align-center w-screen h-screen">
<form
on:submit|preventDefault={() => {}}
class='flex-col flex justify-center align-center mx-auto'
class="flex-col flex justify-center align-center mx-auto"
>
<h1 class='text-lg text-center'>Game Pin</h1>
<h1 class="text-lg text-center">Game Pin</h1>
<input
class='border border-amber-800 self-center text-center text-black'
class="border border-amber-800 self-center text-center text-black"
bind:value={game_pin}
maxlength='8'
maxlength="8"
/>
<!-- use:tippy={{content: "Please enter the game pin", sticky: true, placement: 'top'}}-->
<br />
<button
class='bg-amber-800 hover:bg-amber-700 text-white font-bold py-2 px-4 rounded disabled:opacity-50 disabled:cursor-not-allowed mt-2'
type='submit'
class="bg-amber-800 hover:bg-amber-700 text-white font-bold py-2 px-4 rounded disabled:opacity-50 disabled:cursor-not-allowed mt-2"
type="submit"
disabled={game_pin.length <= 7}
>
Submit
@@ -87,16 +85,16 @@
</form>
</div>
{:else}
<div class='flex flex-col justify-center align-center w-screen h-screen'>
<div class="flex flex-col justify-center align-center w-screen h-screen">
<form
on:submit|preventDefault={setUsername}
class='flex-col flex justify-center align-center mx-auto'
class="flex-col flex justify-center align-center mx-auto"
>
<h1 class='text-lg text-center'>Username</h1>
<input class='border border-amber-800 text-black text-center' bind:value={username} />
<h1 class="text-lg text-center">Username</h1>
<input class="border border-amber-800 text-black text-center" bind:value={username} />
<button
class='bg-amber-800 hover:bg-amber-700 text-white font-bold py-2 px-4 rounded disabled:cursor-not-allowed disabled:opacity-50 mt-2'
type='submit'
class="bg-amber-800 hover:bg-amber-700 text-white font-bold py-2 px-4 rounded disabled:cursor-not-allowed disabled:opacity-50 mt-2"
type="submit"
disabled={username.length <= 3}
>
Submit
@@ -105,9 +103,9 @@
</div>
{/if}
<div
id='hcaptcha'
class='h-captcha'
id="hcaptcha"
class="h-captcha"
data-sitekey={hcaptchaSitekey}
data-size='invisible'
data-theme='dark'
data-size="invisible"
data-theme="dark"
/>
frontend/src/lib/stores.ts
+1 -2
View File
@@ -1,4 +1,3 @@
import { writable } from 'svelte/store';
export const navbarVisible = writable(true);
export const navbarVisible = writable(true);