✨ Made editor great
This commit is contained in:
Mawoka
+2
-12
@@ -123,21 +123,11 @@ class SlideElementTypes(str, Enum):
|
||||
CIRCLE = "CIRCLE"
|
||||
|
||||
|
||||
class SlideElement(BaseModel):
|
||||
type: SlideElementTypes
|
||||
x: float
|
||||
y: float
|
||||
height: float
|
||||
width: float
|
||||
data: str
|
||||
id: int
|
||||
|
||||
|
||||
class QuizQuestion(BaseModel):
|
||||
question: str
|
||||
time: str # in Secs
|
||||
type: None | QuizQuestionType = QuizQuestionType.ABCD
|
||||
answers: list[ABCDQuizAnswer] | RangeQuizAnswer | list[VotingQuizAnswer] | list[SlideElement]
|
||||
answers: list[ABCDQuizAnswer] | RangeQuizAnswer | list[VotingQuizAnswer] | str
|
||||
image: str | None = None
|
||||
|
||||
@validator("answers")
|
||||
@@ -148,7 +138,7 @@ class QuizQuestion(BaseModel):
|
||||
raise ValueError("Answer must be from type RangeQuizAnswer if type is RANGE")
|
||||
if values["type"] == QuizQuestionType.VOTING and type(v[0]) != VotingQuizAnswer:
|
||||
raise ValueError("Answer must be from type VotingQuizAnswer if type is VOTING")
|
||||
if values["type"] == QuizQuestionType.SLIDE and type(v[0]) != SlideElement:
|
||||
if values["type"] == QuizQuestionType.SLIDE and type(v[0]) != str:
|
||||
raise ValueError("Answer must be from type SlideElement if type is SLIDE")
|
||||
return v
|
||||
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"@tailwindcss/typography": "^0.5.8",
|
||||
"@types/canvas-confetti": "^1.6.0",
|
||||
"@types/cookie": "^0.5.1",
|
||||
"@types/fabric": "^4.5.14",
|
||||
"@types/js-cookie": "^3.0.2",
|
||||
"@types/luxon": "^2.4.0",
|
||||
"@types/qrcode": "^1.5.0",
|
||||
@@ -58,6 +59,7 @@
|
||||
"eslint": "^8.28.0",
|
||||
"eslint-config-prettier": "^8.5.0",
|
||||
"eslint-plugin-svelte3": "^4.0.0",
|
||||
"fabric": "^5.3.0",
|
||||
"felte": "^1.2.6",
|
||||
"fuse.js": "^6.6.2",
|
||||
"highlight.js": "^11.7.0",
|
||||
|
||||
Generated
+984
File diff suppressed because it is too large
Load Diff
@@ -33,7 +33,7 @@
|
||||
time: '120',
|
||||
question: 'Slide',
|
||||
image: undefined,
|
||||
answers: []
|
||||
answers: ''
|
||||
};
|
||||
|
||||
const setSelectedQuestion = (index: number): void => {
|
||||
|
||||
@@ -4,25 +4,27 @@
|
||||
- file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import TextElement from './slides/types/text.svelte';
|
||||
import HeadlineElement from './slides/types/headline.svelte';
|
||||
import RectangleElement from './slides/types/rectangle.svelte';
|
||||
import CircleElement from './slides/types/circle.svelte';
|
||||
import { draggable } from '@neodrag/svelte';
|
||||
import type { Question } from '$lib/quiz_types';
|
||||
import { ElementTypes, QuizQuestionType } from '$lib/quiz_types';
|
||||
import ElementSelection from './slides/element_selection.svelte';
|
||||
import SettingsMenu from './slides/settings_menu.svelte';
|
||||
import { onMount } from 'svelte';
|
||||
import Pikaso from 'pikaso';
|
||||
import EditMenu from './slides/edit_menu.svelte';
|
||||
import type { Konva, ShapeModel } from 'pikaso';
|
||||
|
||||
export let data: Question = {
|
||||
type: QuizQuestionType.SLIDE,
|
||||
time: '120',
|
||||
question: '',
|
||||
image: undefined,
|
||||
answers: []
|
||||
answers: ''
|
||||
};
|
||||
let selected_element = undefined;
|
||||
let canvas_el: HTMLDivElement | undefined;
|
||||
let canvas: Pikaso;
|
||||
let elements = [];
|
||||
let selected_el: null | ShapeModel<Konva.Shape | Konva.Group, Konva.ShapeConfig> = null;
|
||||
|
||||
let elements_binds: Array<HTMLElement> | undefined = [];
|
||||
let main_el: undefined | HTMLElement;
|
||||
@@ -50,29 +52,45 @@
|
||||
}
|
||||
});
|
||||
const add_text_field = () => {
|
||||
data.answers = [
|
||||
...data.answers,
|
||||
{
|
||||
type: selected_element,
|
||||
data: '',
|
||||
x: 0,
|
||||
y: 0,
|
||||
id: data.answers.length,
|
||||
height: 0,
|
||||
width: 0
|
||||
}
|
||||
];
|
||||
selected_element = undefined;
|
||||
};
|
||||
|
||||
const delete_element = (id: number) => {
|
||||
if (!confirm('Do you really want to delete this element?')) {
|
||||
return;
|
||||
if (selected_element === ElementTypes.Text) {
|
||||
canvas.shapes.label.insert({
|
||||
container: {
|
||||
x: 40,
|
||||
y: 40
|
||||
},
|
||||
text: {
|
||||
text: 'Text',
|
||||
fontSize: 20
|
||||
}
|
||||
});
|
||||
} else if (selected_element === ElementTypes.Headline) {
|
||||
canvas.shapes.label.insert({
|
||||
container: {
|
||||
x: 40,
|
||||
y: 40
|
||||
},
|
||||
text: {
|
||||
text: 'Headline',
|
||||
fontSize: 35
|
||||
}
|
||||
});
|
||||
} else if (selected_element === ElementTypes.Circle) {
|
||||
canvas.shapes.circle.insert({
|
||||
x: 40,
|
||||
y: 40,
|
||||
radius: 50,
|
||||
fill: '#ff000d'
|
||||
});
|
||||
} else if (selected_element === ElementTypes.Rectangle) {
|
||||
canvas.shapes.rect.insert({
|
||||
x: 40,
|
||||
y: 40,
|
||||
width: 50,
|
||||
height: 50,
|
||||
fill: '#ff000d'
|
||||
});
|
||||
}
|
||||
data.answers.splice(id, 1);
|
||||
data.answers = data.answers;
|
||||
elements_binds.splice(id, 1);
|
||||
elements_binds = elements_binds;
|
||||
console.log(canvas.export.toJson());
|
||||
};
|
||||
|
||||
$: {
|
||||
@@ -103,101 +121,120 @@
|
||||
};
|
||||
|
||||
onMount(() => {
|
||||
setTimeout(() => {
|
||||
for (let i = 0; i < data.answers.length; i++) {
|
||||
elements_binds[i].style.height = `${
|
||||
data.answers[i].height * main_el.offsetHeight
|
||||
}px`;
|
||||
elements_binds[i].style.width = `${data.answers[i].width * main_el.offsetWidth}px`;
|
||||
/* setTimeout(() => {
|
||||
for (let i = 0; i < data.answers.length; i++) {
|
||||
elements_binds[i].style.height = `${
|
||||
data.answers[i].height * main_el.offsetHeight
|
||||
}px`;
|
||||
elements_binds[i].style.width = `${data.answers[i].width * main_el.offsetWidth}px`;
|
||||
}
|
||||
}, 200);*/
|
||||
canvas = new Pikaso({
|
||||
container: canvas_el,
|
||||
snapToGrid: {}
|
||||
/* selection: {
|
||||
interactive: false
|
||||
}*/
|
||||
});
|
||||
console.log(data.answers);
|
||||
if (data.answers) {
|
||||
if (typeof data.answers === 'string') {
|
||||
canvas.import.json(JSON.parse(data.answers));
|
||||
}
|
||||
}, 200);
|
||||
}
|
||||
canvas.on('*', () => {
|
||||
data.answers = JSON.stringify(canvas.export.toJson());
|
||||
});
|
||||
canvas.on('selection:change', (data) => {
|
||||
/* data.shapes[0].update({fill: "#ffffff"})
|
||||
console.log(data.shapes[0])*/
|
||||
// console.log(canvas.board.shapes)
|
||||
if (data.shapes.length > 0) {
|
||||
selected_el = data.shapes[0];
|
||||
} else {
|
||||
selected_el = null;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const get_shape_from_id = (id: number) => {
|
||||
for (let i = 0; i < canvas.board.shapes.length; i++) {
|
||||
if (canvas.board.shapes[i].node._id === id) {
|
||||
return canvas.board.shapes[i].node;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<div class="flex h-full relative w-full pb-12" bind:this={main_el}>
|
||||
<div class="absolute top-0 right-0 flex flex-col pr-2 rounded-t-lg">
|
||||
<button
|
||||
class="ml-auto"
|
||||
on:click={() => {
|
||||
selected_element = selected_element === null ? undefined : null;
|
||||
}}
|
||||
type="button"
|
||||
class:add-button={selected_element === null}
|
||||
>
|
||||
Add element
|
||||
</button>
|
||||
{#if selected_element === null}
|
||||
<ElementSelection bind:selected_element />
|
||||
{/if}
|
||||
</div>
|
||||
|
||||
<div class="absolute top-0 left-0 flex flex-col pl-2 rounded-t-lg">
|
||||
<button
|
||||
class="mr-auto"
|
||||
on:click={() => {
|
||||
settings_menu_open = !settings_menu_open;
|
||||
}}
|
||||
type="button"
|
||||
>
|
||||
Settings
|
||||
</button>
|
||||
{#if settings_menu_open}
|
||||
<SettingsMenu bind:time={data.time} bind:title={data.question} />
|
||||
{/if}
|
||||
</div>
|
||||
{#if main_el}
|
||||
{#each data.answers as el, i}
|
||||
<div
|
||||
use:draggable={{
|
||||
bounds: 'parent',
|
||||
handle: '.drag',
|
||||
defaultPosition: {
|
||||
x: data.answers[i].x * main_el.offsetWidth,
|
||||
y: data.answers[i].y * main_el.offsetHeight
|
||||
}
|
||||
<div class="flex h-full relative w-full" bind:this={main_el}>
|
||||
<div class="absolute top-0 left-0 grid grid-cols-6 w-full">
|
||||
<div class="flex flex-col pl-2 rounded-t-lg z-40 pt-2">
|
||||
<button
|
||||
class="mr-auto"
|
||||
on:click={() => {
|
||||
settings_menu_open = !settings_menu_open;
|
||||
}}
|
||||
class="resize h-fit overflow-auto relative min-h-fit"
|
||||
on:neodrag:end={set_correct_position}
|
||||
el_id={i}
|
||||
on:resize={set_correct_size}
|
||||
bind:this={elements_binds[el.id]}
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="absolute drag dark:text-black hover:cursor-grab opacity-30 hover:opacity-100 transition top-0 left-0"
|
||||
>
|
||||
<!-- heroicons/arrows-expand -->
|
||||
<svg
|
||||
class="w-4 h-4"
|
||||
fill="none"
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
color="currentColor"
|
||||
><path
|
||||
d="M12 15a3 3 0 100-6 3 3 0 000 6z"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
stroke-width="2"
|
||||
d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4"
|
||||
/></svg
|
||||
></span
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/><path
|
||||
d="M19.622 10.395l-1.097-2.65L20 6l-2-2-1.735 1.483-2.707-1.113L12.935 2h-1.954l-.632 2.401-2.645 1.115L6 4 4 6l1.453 1.789-1.08 2.657L2 11v2l2.401.655L5.516 16.3 4 18l2 2 1.791-1.46 2.606 1.072L11 22h2l.604-2.387 2.651-1.098C16.697 18.831 18 20 18 20l2-2-1.484-1.75 1.098-2.652 2.386-.62V11l-2.378-.605z"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/></svg
|
||||
>
|
||||
<!-- <button class='absolute drag dark:text-black opacity-30 hover:opacity-100 transition top-0 right-0' on:click={() => {delete_element(i)}}>
|
||||
<!– heroicons/trash –>
|
||||
<svg class='w-4 h-4' fill='none' stroke='currentColor' viewBox='0 0 24 24'
|
||||
xmlns='http://www.w3.org/2000/svg'>
|
||||
<path stroke-linecap='round' stroke-linejoin='round' stroke-width='2'
|
||||
d='M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16'></path>
|
||||
</svg>
|
||||
</button>-->
|
||||
{#if el.type === ElementTypes.Text}
|
||||
<TextElement bind:data={el.data} />
|
||||
{:else if el.type === ElementTypes.Headline}
|
||||
<HeadlineElement bind:data={el.data} />
|
||||
{:else if el.type === ElementTypes.Rectangle}
|
||||
<RectangleElement bind:data={el.data} />
|
||||
{:else if el.type === ElementTypes.Circle}
|
||||
<CircleElement bind:data={el.data} />
|
||||
{/if}
|
||||
</div>
|
||||
{/each}
|
||||
{/if}
|
||||
</button>
|
||||
{#if settings_menu_open}
|
||||
<SettingsMenu bind:time={data.time} bind:title={data.question} />
|
||||
{/if}
|
||||
</div>
|
||||
<div class="col-start-2 col-end-6 transition bg-transparent pt-2">
|
||||
<EditMenu bind:selected_el />
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col pr-2 rounded-t-lg z-40 pt-2">
|
||||
<button
|
||||
class="ml-auto"
|
||||
on:click={() => {
|
||||
selected_element = selected_element === null ? undefined : null;
|
||||
}}
|
||||
type="button"
|
||||
class:add-button={selected_element === null}
|
||||
>
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
color="currentColor"
|
||||
><path
|
||||
d="M9 12h3m3 0h-3m0 0V9m0 3v3M21 3.6v16.8a.6.6 0 01-.6.6H3.6a.6.6 0 01-.6-.6V3.6a.6.6 0 01.6-.6h16.8a.6.6 0 01.6.6z"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/></svg
|
||||
>
|
||||
</button>
|
||||
{#if selected_element === null}
|
||||
<ElementSelection bind:selected_element />
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
<div bind:this={canvas_el} class="w-full h-full block" />
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,205 @@
|
||||
<!--
|
||||
- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import type { Konva, ShapeModel } from 'pikaso';
|
||||
import { fade } from 'svelte/transition';
|
||||
|
||||
export let selected_el: null | ShapeModel<Konva.Shape | Konva.Group, Konva.ShapeConfig>;
|
||||
|
||||
let opened_dropdown = null;
|
||||
|
||||
let available_modifiers: Array<string> = [];
|
||||
|
||||
const set_available_modifiers = () => {
|
||||
available_modifiers = [];
|
||||
console.log(selected_el, 'sel_el');
|
||||
if (!selected_el) {
|
||||
return;
|
||||
}
|
||||
switch (selected_el.type) {
|
||||
case 'label':
|
||||
available_modifiers.push('font_size', 'text_color');
|
||||
break;
|
||||
case 'circle' || 'rectangle':
|
||||
available_modifiers.push('fill_color');
|
||||
}
|
||||
};
|
||||
|
||||
$: {
|
||||
selected_el;
|
||||
set_available_modifiers();
|
||||
}
|
||||
|
||||
const toggle_switch = (el: string) => {
|
||||
if (opened_dropdown) {
|
||||
opened_dropdown = null;
|
||||
} else {
|
||||
opened_dropdown = el;
|
||||
}
|
||||
};
|
||||
|
||||
const change_color = (e: Event) => {
|
||||
if (available_modifiers.includes('text_color')) {
|
||||
console.log('text color');
|
||||
selected_el.updateText({
|
||||
fill: e.target.value
|
||||
});
|
||||
} else if (available_modifiers.includes('fill_color')) {
|
||||
console.log('fill color');
|
||||
selected_el.update({ fill: e.target.value });
|
||||
}
|
||||
opened_dropdown = null;
|
||||
};
|
||||
|
||||
const change_fontsize = (e: Event) => {
|
||||
console.log(selected_el.node.children[1].attrs.fontSize);
|
||||
selected_el.updateText({
|
||||
fontSize: e.target.value
|
||||
});
|
||||
};
|
||||
|
||||
$: if (!selected_el) {
|
||||
opened_dropdown = null;
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="flex flex-row justify-evenly z-40">
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="disabled:opacity-50 transition"
|
||||
disabled={!(
|
||||
available_modifiers.includes('fill_color') ||
|
||||
available_modifiers.includes('text_color')
|
||||
)}
|
||||
on:click={() => {
|
||||
toggle_switch('color');
|
||||
}}
|
||||
>
|
||||
<!-- iconoir/color-picker -->
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
color="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M7 13.161l5.464-5.464a1 1 0 011.415 0l2.12 2.12a1 1 0 010 1.415l-1.928 1.929m-7.071 0l-2.172 2.172a.999.999 0 00-.218.327l-1.028 2.496c-.508 1.233.725 2.466 1.958 1.959l2.497-1.028c.122-.05.233-.125.326-.218l5.708-5.708m-7.071 0h7.071M13.878 3.454l2.121 2.121m4.243 4.243l-2.121-2.121m-2.122-2.122l1.414-1.414a1 1 0 011.415 0l.707.707a1 1 0 010 1.414L18.12 7.697m-2.122-2.122l2.122 2.122"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
{#if opened_dropdown === 'color'}
|
||||
<div
|
||||
class="bg-white m-auto rounded-lg shadow-lg p-4 dark:bg-gray-600 h-fit gap-2 w-fit auto-cols-min flex absolute z-40"
|
||||
transition:fade={{ duration: 100 }}
|
||||
>
|
||||
<input type="color" on:change={change_color} />
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div>
|
||||
<button
|
||||
type="button"
|
||||
class="disabled:opacity-50 transition"
|
||||
on:click={() => {
|
||||
toggle_switch('font_size');
|
||||
}}
|
||||
disabled={!available_modifiers.includes('font_size')}
|
||||
>
|
||||
<!-- iconoir/font-size -->
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
color="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M18 21V11m0 10l-2-2.5m2 2.5l2-2.5M18 11l-2 2m2-2l2 2M9 5v12m0 0H7m2 0h2M15 7V5H3v2"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
{#if opened_dropdown === 'font_size'}
|
||||
<div
|
||||
class="bg-white m-auto rounded-lg shadow-lg p-4 dark:bg-gray-600 h-fit gap-2 w-fit auto-cols-min flex absolute z-40"
|
||||
transition:fade={{ duration: 100 }}
|
||||
>
|
||||
<input
|
||||
type="range"
|
||||
on:change={change_fontsize}
|
||||
value={selected_el?.node?.children?.[1]?.attrs?.fontSize}
|
||||
min="10"
|
||||
max="250"
|
||||
/>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="flex flex-row gap-2">
|
||||
<button
|
||||
type="button"
|
||||
class="disabled:opacity-50 transition"
|
||||
on:click={() => {
|
||||
selected_el.update({ zIndex: selected_el.node.getZIndex() + 1 });
|
||||
}}
|
||||
disabled={!selected_el}
|
||||
>
|
||||
<!-- iconoir/priority-up -->
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
color="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M11.576 1.424a.6.6 0 01.848 0l10.152 10.152a.6.6 0 010 .848L12.424 22.576a.6.6 0 01-.848 0L1.424 12.424a.6.6 0 010-.848L11.576 1.424zM12 7l4 4m-4-4l-4 4.167M12 7v9"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="disabled:opacity-50 transition"
|
||||
on:click={() => {
|
||||
selected_el.update({ zIndex: selected_el.node.getZIndex() - 1 });
|
||||
}}
|
||||
disabled={!selected_el}
|
||||
>
|
||||
<!-- iconoir/priority-down -->
|
||||
<svg
|
||||
class="w-6 h-6"
|
||||
stroke-width="2"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
color="currentColor"
|
||||
>
|
||||
<path
|
||||
d="M11.576 1.424a.6.6 0 01.848 0l10.152 10.152a.6.6 0 010 .848L12.424 22.576a.6.6 0 01-.848 0L1.424 12.424a.6.6 0 010-.848L11.576 1.424zM12 16l4-4m-4 4l-4-4.167M12 16V7"
|
||||
stroke="currentColor"
|
||||
stroke-width="2"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,8 @@
|
||||
<!--
|
||||
- This Source Code Form is subject to the terms of the Mozilla Public
|
||||
- License, v. 2.0. If a copy of the MPL was not distributed with this
|
||||
- file, You can obtain one at https://mozilla.org/MPL/2.0/.
|
||||
-->
|
||||
|
||||
<!-- heroicons/x-circle -->
|
||||
<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 14l2-2m0 0l2-2m-2 2l-2-2m2 2l2 2m7-2a9 9 0 11-18 0 9 9 0 0118 0z"></path></svg>
|
||||
|
After Width: | Height: | Size: 497 B |
@@ -38,22 +38,12 @@ export interface RangeQuizAnswer {
|
||||
max_correct: number;
|
||||
}
|
||||
|
||||
export interface Slide {
|
||||
type: ElementTypes;
|
||||
x: number;
|
||||
y: number;
|
||||
height: number;
|
||||
width: number;
|
||||
data: string;
|
||||
id: number;
|
||||
}
|
||||
|
||||
export interface Question {
|
||||
time: string;
|
||||
question: string;
|
||||
type?: QuizQuestionType;
|
||||
image?: string;
|
||||
answers: Answer[] | RangeQuizAnswer | VotingAnswer[];
|
||||
answers: Answer[] | RangeQuizAnswer | VotingAnswer[] | string;
|
||||
}
|
||||
|
||||
export interface Answer {
|
||||
|
||||
Reference in New Issue
Block a user