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

✨ Added cover-image (Closes #103)

Browse Source
This commit is contained in:
Mawoka
2022-09-08 17:47:29 +02:00
parent 603e2834d6
commit 2ab9d14d3e
15 changed files with 186 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
classquiz/db/models.py
+3
View File
@@ -99,6 +99,7 @@ class QuizInput(BaseModel):
public: bool = False
title: str
description: str
cover_image: str | None
questions: list[QuizQuestion]
@@ -112,6 +113,7 @@ class Quiz(ormar.Model):
user_id: uuid.UUID = ormar.ForeignKey(User)
questions: Json[list[QuizQuestion]] = ormar.JSON(nullable=False)
imported_from_kahoot: Optional[bool] = ormar.Boolean(default=False, nullable=True)
cover_image: Optional[str] = ormar.Text(nullable=True, unique=False)
class Meta:
tablename = "quiz"
@@ -154,6 +156,7 @@ class PlayGame(BaseModel):
game_pin: str
started: bool = False
captcha_enabled: bool = False
cover_image: str | None
class GamePlayer(BaseModel):
classquiz/kahoot_importer/import_quiz.py
+7
View File
@@ -55,6 +55,12 @@ async def import_quiz(quiz_id: str, user: User) -> Quiz | str:
image=image,
).dict()
)
cover = None
if quiz.kahoot.cover != "":
image_bytes = await _download_image(quiz.kahoot.cover)
image_name = f"{quiz_id}--{uuid.uuid4()}"
await storage.upload(file_name=image_name, file_data=image_bytes)
cover = f"{settings.root_address}/api/v1/storage/download/{image_name}"
quiz_data = Quiz(
id=quiz_id,
public=True,
@@ -65,6 +71,7 @@ async def import_quiz(quiz_id: str, user: User) -> Quiz | str:
user_id=user.id,
questions=json.dumps(quiz_questions),
imported_from_kahoot=True,
cover_image=cover,
)
meilisearch.index(settings.meilisearch_index).add_documents([await get_meili_data(quiz_data)])
return await quiz_data.save()
classquiz/routers/editor.py
+8
View File
@@ -157,6 +157,13 @@ 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!")
if quiz_input.cover_image == "":
quiz_input.cover_image = None
if quiz_input.cover_image is not None and not bool(re.match(server_regex, quiz_input.cover_image)):
raise HTTPException(status_code=400, detail="image url is not valid")
if session_data.edit:
quiz = old_quiz_data
meilisearch.index(settings.meilisearch_index).update_documents([await get_meili_data(quiz)])
@@ -169,6 +176,7 @@ async def finish_edit(edit_id: str, quiz_input: QuizInput):
quiz.description = quiz_input.description
quiz.updated_at = datetime.now()
quiz.questions = quiz_input.dict()["questions"]
quiz.cover_image = quiz_input.cover_image
for image in images_to_delete:
if image is not None:
try:
classquiz/routers/quiz.py
+16
View File
@@ -42,6 +42,11 @@ async def create_quiz_lol(quiz_input: QuizInput, user: User = Depends(get_curren
and not re.match(server_regex, question.image)
):
raise HTTPException(status_code=400, detail="image url is not valid")
if quiz_input.cover_image == "":
quiz_input.cover_image = None
if quiz_input.cover_image is not None and not bool(re.match(server_regex, quiz_input.cover_image)):
raise HTTPException(status_code=400, detail="image url is not valid")
quiz = Quiz(**quiz_input.dict(), user_id=user.id, id=uuid.uuid4())
await redis.delete("global_quiz_count")
if quiz_input.public:
@@ -102,6 +107,7 @@ async def start_quiz(quiz_id: str, captcha_enabled: bool = True, user: User = De
title=quiz.title,
description=quiz.description,
captcha_enabled=captcha_enabled,
cover_image=quiz.cover_image,
)
await redis.set(f"game:{str(game.game_pin)}", (game.json()), ex=18000)
return {**quiz.dict(exclude={"id"}), **game.dict(exclude={"questions"})}
@@ -156,6 +162,15 @@ async def update_quiz(quiz_id: str, quiz_input: QuizInput, user: User = Depends(
quiz_id = uuid.UUID(quiz_id)
except ValueError:
raise HTTPException(status_code=400, detail="badly formed quiz id")
## Check Cover-Image
print(quiz_input.cover_image)
if quiz_input.cover_image == "":
quiz_input.cover_image = None
if quiz_input.cover_image is not None and not bool(re.match(server_regex, quiz_input.cover_image)):
raise HTTPException(status_code=400, detail="image url is not valid")
quiz = await Quiz.objects.get_or_none(id=quiz_id, user_id=user.id)
if quiz is None:
return JSONResponse(status_code=404, content={"detail": "quiz not found"})
@@ -168,6 +183,7 @@ async def update_quiz(quiz_id: str, quiz_input: QuizInput, user: User = Depends(
if not quiz.public and quiz_input.public:
meilisearch.index(settings.meilisearch_index).add_documents([await get_meili_data(quiz)])
quiz.title = quiz_input.title
quiz.cover_image = quiz_input.cover_image
quiz.public = quiz_input.public
quiz.description = quiz_input.description
quiz.updated_at = datetime.now()
frontend/src/lib/dashboard/main_slider.svelte
+21 -3
View File
@@ -71,9 +71,25 @@
>
{quiz.title}
</p>
<p class="text-center col-start-2 col-end-6">
{quiz.description}
</p>
<div class="col-start-2 col-end-6">
<p class="text-center">
{quiz.description}
</p>
{#if quiz.cover_image}
<div
class="flex justify-center align-middle items-center"
>
<div class="h-[20vh] m-auto w-auto">
<img
class="max-h-full max-w-full block"
src={quiz.cover_image}
alt="Not provided"
/>
</div>
</div>
{/if}
</div>
<div class="flex justify-end">
<p
style="writing-mode: sideways-lr"
@@ -83,10 +99,12 @@
</p>
</div>
</div>
<p class="text-center">
{quiz.questions.length}
{$t('words.question', { count: quiz.questions.length })}
</p>
<div class="flex justify-center mt-8">
{#if quiz.public}
<svg
frontend/src/lib/editor.svelte
+24 -2
View File
@@ -19,6 +19,22 @@
export let quiz_id: string | null;
let selected_question = -1;
let imgur_links_valid = false;
let pow_salt;
const computePOW = async (salt: string) => {
if (pow_salt === undefined) {
return;
}
console.log('Computing POW');
pow_data = await mint(salt, 16, '', 8, false);
pow_salt = undefined;
return;
};
$: {
pow_salt;
computePOW(pow_salt);
}
const validateInput = async (data: EditorData) => {
try {
@@ -156,9 +172,15 @@
</div>
<div class="w-full h-full">
{#if selected_question === -1}
<SettingsCard bind:data />
<SettingsCard bind:data bind:pow_salt bind:edit_id bind:pow_data />
{:else}
<QuizCard bind:data bind:selected_question bind:edit_id bind:pow_data />
<QuizCard
bind:data
bind:selected_question
bind:edit_id
bind:pow_data
bind:pow_salt
/>
{/if}
</div>
</div>
frontend/src/lib/editor/card.svelte
+1 -17
View File
@@ -10,7 +10,6 @@
import { reach } from 'yup';
import { dataSchema } from '$lib/yupSchemas';
import Spinner from '../Spinner.svelte';
import { mint } from '$lib/hashcash';
import { createTippy } from 'svelte-tippy';
import { getLocalization } from '$lib/i18n';
@@ -26,25 +25,10 @@
export let selected_question: number;
export let edit_id: string;
export let pow_data;
let pow_salt: string;
export let pow_salt: string;
let uppyOpen = false;
const computePOW = async (salt: string) => {
if (pow_salt === undefined) {
return;
}
console.log('Computing POW');
pow_data = await mint(salt, 16, '', 8, false);
pow_salt = undefined;
return;
};
$: {
pow_salt;
computePOW(pow_salt);
}
/*eslint no-unused-vars: ["error", { "argsIgnorePattern": "^_" }]*/
const correctTimeInput = (_) => {
let time = data.questions[selected_question].time;
frontend/src/lib/editor/settings-card.svelte
+37
View File
@@ -6,9 +6,16 @@
<script lang="ts">
import type { EditorData } from '$lib/quiz_types';
import { getLocalization } from '$lib/i18n';
import Spinner from '$lib/Spinner.svelte';
export let pow_data;
export let pow_salt;
const { t } = getLocalization();
let uppyOpen = false;
export let edit_id: string;
export let data: EditorData;
</script>
@@ -42,6 +49,36 @@
class="p-3 rounded-lg border-gray-500 border text-center w-1/3 h-20 resize-none dark:bg-gray-500"
/>
</div>
{#if data.cover_image != undefined && data.cover_image !== ''}
<div class="flex justify-center pt-10 w-full max-h-72 w-full">
<img
src={data.cover_image}
alt="not available"
class="max-h-72 h-auto w-auto"
on:contextmenu|preventDefault={() => {
data.cover_image = '';
}}
/>
</div>
{:else if pow_data === undefined}
<a href="/docs/pow" target="_blank" class="cursor-help">
<Spinner />
</a>
{:else}
{#await import('$lib/editor/uploader.svelte')}
<Spinner />
{:then c}
<svelte:component
this={c.default}
bind:modalOpen={uppyOpen}
bind:edit_id
bind:data
bind:pow_data
bind:pow_salt
/>
{/await}
{/if}
<div class="pt-10 w-full flex justify-center">
<button
type="button"
frontend/src/lib/editor/uploader.svelte
+9 -3
View File
@@ -61,9 +61,15 @@
});
uppy.on('complete', (_) => {
console.log(pow_data);
data.questions[
selected_question
].image = `${window.location.origin}/api/v1/storage/download/${image_id}`;
if (selected_question === undefined) {
data.cover_image = `${window.location.origin}/api/v1/storage/download/${image_id}`;
} else {
data.questions[
selected_question
].image = `${window.location.origin}/api/v1/storage/download/${image_id}`;
}
console.log(selected_question, data);
modalOpen = false;
});
console.log(edit_id);
frontend/src/lib/play/title.svelte
+8
View File
@@ -6,9 +6,17 @@
<script lang="ts">
export let title: string;
export let description: string;
export let cover_image: string | undefined;
</script>
<div class="flex flex-col justify-center w-screen h-screen">
<h1 class="text-7xl text-center">{title}</h1>
<p class="text-3xl pt-8 text-center">{description}</p>
{#if cover_image}
<div class="flex justify-center align-middle items-center">
<div class="h-[30vh] m-auto w-auto mt-12">
<img class="max-h-full max-w-full block" src={cover_image} alt="Not provided" />
</div>
</div>
{/if}
</div>
frontend/src/lib/quiz_types.ts
+2
View File
@@ -12,6 +12,7 @@ export interface QuizData {
game_id: string;
game_pin: string;
started: boolean;
cover_image?: string;
}
export enum QuizQuestionType {
@@ -44,4 +45,5 @@ export interface EditorData {
title: string;
description: string;
questions: Question[];
cover_image?: string;
}
frontend/src/routes/+page.svelte
+4 -2
View File
@@ -200,10 +200,12 @@
</div>
</section>
<section>
<h2 class="text-center text-5xl mb-6">How does ClassQuiz even work?</h2>
<div class="flex justify-center w-full">
<h2 class="text-center text-3xl rounded-t-lg bg-opacity-40 bg-white py-2 px-6">
<h3 class="text-center text-3xl rounded-t-lg bg-opacity-40 bg-white py-2 px-6">
{$t('index_page.get_a_quiz')}
</h2>
</h3>
</div>
<div
class="grid grid-rows-2 lg:grid-rows-1 lg:grid-cols-2 bg-opacity-40 bg-white shadow-lg mb-12 lg:mx-12 mx-4 rounded-lg"
frontend/src/routes/play/+page.svelte
+5 -1
View File
@@ -122,7 +122,11 @@
{:else if JSON.stringify(final_results) !== JSON.stringify([null])}
<ShowEndScreen bind:final_results bind:quiz_data={gameData} />
{:else if gameData !== undefined && question_index === ''}
<ShowTitle bind:title={gameData.title} bind:description={gameData.description} />
<ShowTitle
bind:title={gameData.title}
bind:description={gameData.description}
bind:cover_image={gameData.cover_image}
/>
{:else if gameMeta.started && gameData !== undefined && question_index !== '' && answer_results === undefined}
{#key unique}
<Question
frontend/src/routes/view/[quiz_id]/+page.svelte
+11 -1
View File
@@ -55,6 +55,17 @@
<div class="text-center">
<p>{quiz.description}</p>
</div>
{#if quiz.cover_image}
<div class="flex justify-center align-middle items-center">
<div class="h-[15vh] m-auto w-auto my-3">
<img
class="max-h-full max-w-full block"
src={quiz.cover_image}
alt="Not provided"
/>
</div>
</div>
{/if}
<div class="text-center text-sm pt-1">
<ImportedOrNot imported={quiz.imported_from_kahoot} />
</div>
@@ -98,7 +109,6 @@
<!-- </label>-->
{#if question.image}
<span>
{$t('words.image')}:
<img class="pl-8" src={question.image} alt="Not provided" />
</span>
{/if}
migrations/versions/cda6903dfc0c_added_cover_image.py
+30
View File
@@ -0,0 +1,30 @@
"""added cover_image
Revision ID: cda6903dfc0c
Revises: 3f63c0130bce
Create Date: 2022-09-08 16:40:01.675020
"""
from alembic import op
import sqlalchemy as sa
import ormar
# revision identifiers, used by Alembic.
revision = "cda6903dfc0c"
down_revision = "3f63c0130bce"
branch_labels = None
depends_on = None
def upgrade() -> None:
# ### commands auto generated by Alembic - please adjust! ###
op.create_unique_constraint(None, "instance_data", ["instance_id"])
op.add_column("quiz", sa.Column("cover_image", sa.Text(), nullable=True))
# ### end Alembic commands ###
def downgrade() -> None:
# ### commands auto generated by Alembic - please adjust! ###
op.drop_column("quiz", "cover_image")
# ### end Alembic commands ###