diff --git a/db.kv b/db.kv new file mode 100644 index 0000000..9a47220 Binary files /dev/null and b/db.kv differ diff --git a/db.kv-shm b/db.kv-shm new file mode 100644 index 0000000..a1eba0a Binary files /dev/null and b/db.kv-shm differ diff --git a/db.kv-wal b/db.kv-wal new file mode 100644 index 0000000..a90e8b2 Binary files /dev/null and b/db.kv-wal differ diff --git a/src/lib/components/form/form.svelte b/src/lib/components/form/form.svelte index cf1889d..5551bbe 100644 --- a/src/lib/components/form/form.svelte +++ b/src/lib/components/form/form.svelte @@ -121,13 +121,6 @@ font-weight: 400; } - :global(.Question-Header) { - font-size: 13px; - font-weight: bold; - margin-bottom: 10px; - font-family: 'Poppins'; - } - :global(.question) { padding: 20px 15px; width: calc(100% - 30px); diff --git a/src/lib/components/form_editor/form_editor.svelte b/src/lib/components/form_editor/form_editor.svelte index 96eb30d..5d2e1d4 100644 --- a/src/lib/components/form_editor/form_editor.svelte +++ b/src/lib/components/form_editor/form_editor.svelte @@ -1,14 +1,25 @@
@@ -65,9 +76,8 @@ bind:value={value.questions.shuffled} /> - - - + + diff --git a/src/lib/components/form_editor/question_input_editor/question_input_editor.svelte b/src/lib/components/form_editor/question_input_editor/question_input_editor.svelte index f40e9bf..cdcddce 100644 --- a/src/lib/components/form_editor/question_input_editor/question_input_editor.svelte +++ b/src/lib/components/form_editor/question_input_editor/question_input_editor.svelte @@ -1,11 +1,53 @@ + + +
+ {#if $$props.type === QuestionType.BOOLEAN} + + {:else if $$props.type === QuestionType.COLOR} + + {:else if $$props.type === QuestionType.NUMBER} + + {:else if $$props.type === QuestionType.TEXT} + + {:else if $$props.type === QuestionType.TEXTAREA} + + {:else if $$props.type === QuestionType.DATE} + + {:else if $$props.type === QuestionType.DATETIME} + + {:else if $$props.type === QuestionType.TIME} + + + {:else if $$props.type === QuestionType.SELECT} + + {/if} +
diff --git a/src/lib/components/form_editor/question_list_editor/add_item.svelte b/src/lib/components/form_editor/question_list_editor/add_item.svelte index b52fea6..2ef8229 100644 --- a/src/lib/components/form_editor/question_list_editor/add_item.svelte +++ b/src/lib/components/form_editor/question_list_editor/add_item.svelte @@ -6,9 +6,11 @@ let type = QuestionType.TEXT; - function add() { + function add(e: MouseEvent) { + e.preventDefault(); + const data = { type }; // TODO: Add a helper function to create a blank question object for each type. - addAction({ type }); + addAction(data); } // function makeDefault(type: QuestionType): Question { diff --git a/src/lib/components/list_input/list_input.svelte b/src/lib/components/list_input/list_input.svelte index c65a1f7..b21cd32 100644 --- a/src/lib/components/list_input/list_input.svelte +++ b/src/lib/components/list_input/list_input.svelte @@ -5,11 +5,11 @@ export let value: ItemProps[] = []; function deleteItem(i: number): void { - value.splice(i, 1); + value = value.filter((_, index) => index !== i); } function addItem(item: ItemProps): void { - value.push(item); + value = [...value, item]; } // TODO: Make sortable items. diff --git a/src/lib/components/questions/availability/availability_question_input.svelte b/src/lib/components/questions/availability/availability_question_input.svelte index 7203350..0058a20 100644 --- a/src/lib/components/questions/availability/availability_question_input.svelte +++ b/src/lib/components/questions/availability/availability_question_input.svelte @@ -1,7 +1,7 @@
diff --git a/src/lib/components/questions/base/base_editor.svelte b/src/lib/components/questions/base/base_editor.svelte new file mode 100644 index 0000000..2bd59ab --- /dev/null +++ b/src/lib/components/questions/base/base_editor.svelte @@ -0,0 +1,31 @@ + + + +
+ Question Title + +
+ +
+ Internal Question + +
+ +
+ Question Required + +
+ + + diff --git a/src/lib/components/questions/boolean/boolean_question_input.svelte b/src/lib/components/questions/boolean/boolean_question_input.svelte index dd7c933..50a3e63 100644 --- a/src/lib/components/questions/boolean/boolean_question_input.svelte +++ b/src/lib/components/questions/boolean/boolean_question_input.svelte @@ -1,7 +1,7 @@
diff --git a/src/lib/components/questions/boolean/boolean_question_input_editor.svelte b/src/lib/components/questions/boolean/boolean_question_input_editor.svelte index e69de29..bddae47 100644 --- a/src/lib/components/questions/boolean/boolean_question_input_editor.svelte +++ b/src/lib/components/questions/boolean/boolean_question_input_editor.svelte @@ -0,0 +1,55 @@ + + + + +
+ Choose a Style + +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/color/color_question_input.svelte b/src/lib/components/questions/color/color_question_input.svelte index 427ef42..c218860 100644 --- a/src/lib/components/questions/color/color_question_input.svelte +++ b/src/lib/components/questions/color/color_question_input.svelte @@ -1,10 +1,10 @@
{data.content} - +
diff --git a/src/lib/components/questions/color/color_question_input_editor.svelte b/src/lib/components/questions/color/color_question_input_editor.svelte index e69de29..72d29fb 100644 --- a/src/lib/components/questions/color/color_question_input_editor.svelte +++ b/src/lib/components/questions/color/color_question_input_editor.svelte @@ -0,0 +1,24 @@ + + + + +
+ Default Color + +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/date/date_question_input.svelte b/src/lib/components/questions/date/date_question_input.svelte index 89b66cd..02a25a9 100644 --- a/src/lib/components/questions/date/date_question_input.svelte +++ b/src/lib/components/questions/date/date_question_input.svelte @@ -1,7 +1,7 @@
@@ -12,6 +12,6 @@ required={data.required} min={data.min} max={data.max} - value={data.value} + bind:value={data.value} />
diff --git a/src/lib/components/questions/date/date_question_input_editor.svelte b/src/lib/components/questions/date/date_question_input_editor.svelte index e69de29..8160bb2 100644 --- a/src/lib/components/questions/date/date_question_input_editor.svelte +++ b/src/lib/components/questions/date/date_question_input_editor.svelte @@ -0,0 +1,35 @@ + + + +
+ Min Date + +
+
+ Max Date + +
+
+ Default Date + +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/datetime/datetime_question_input.svelte b/src/lib/components/questions/datetime/datetime_question_input.svelte index 49e0182..c572199 100644 --- a/src/lib/components/questions/datetime/datetime_question_input.svelte +++ b/src/lib/components/questions/datetime/datetime_question_input.svelte @@ -1,7 +1,7 @@
@@ -10,7 +10,7 @@ name={data.name} type="datetime-local" required={data.required} - value={data.value} + bind:value={data.value} min={data.min} max={data.max} /> diff --git a/src/lib/components/questions/datetime/datetime_question_input_editor.svelte b/src/lib/components/questions/datetime/datetime_question_input_editor.svelte index e69de29..fffe168 100644 --- a/src/lib/components/questions/datetime/datetime_question_input_editor.svelte +++ b/src/lib/components/questions/datetime/datetime_question_input_editor.svelte @@ -0,0 +1,35 @@ + + + +
+ Min Date/Time + +
+
+ Max Date/Time + +
+
+ Default Date/Time + +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/number/number_question_input.svelte b/src/lib/components/questions/number/number_question_input.svelte index 605ee60..d09f2be 100644 --- a/src/lib/components/questions/number/number_question_input.svelte +++ b/src/lib/components/questions/number/number_question_input.svelte @@ -1,7 +1,7 @@
diff --git a/src/lib/components/questions/number/number_question_input_editor.svelte b/src/lib/components/questions/number/number_question_input_editor.svelte index e69de29..99fbf8d 100644 --- a/src/lib/components/questions/number/number_question_input_editor.svelte +++ b/src/lib/components/questions/number/number_question_input_editor.svelte @@ -0,0 +1,36 @@ + + + + +
+ min + +
+
+ max + +
+ +
+ step + +
+ +
+ Defualt value + +
+
+ placeholder + +
+
+ Sample + +
+ diff --git a/src/lib/components/questions/radio_group/radio_group_question_input.svelte b/src/lib/components/questions/radio_group/radio_group_question_input.svelte index 226fcb3..2047a8c 100644 --- a/src/lib/components/questions/radio_group/radio_group_question_input.svelte +++ b/src/lib/components/questions/radio_group/radio_group_question_input.svelte @@ -1,7 +1,7 @@
diff --git a/src/lib/components/questions/select/select_question_input.svelte b/src/lib/components/questions/select/select_question_input.svelte index 33ebf02..802cef5 100644 --- a/src/lib/components/questions/select/select_question_input.svelte +++ b/src/lib/components/questions/select/select_question_input.svelte @@ -1,7 +1,7 @@
diff --git a/src/lib/components/questions/select/select_question_input_editor.svelte b/src/lib/components/questions/select/select_question_input_editor.svelte index ffdd4bb..d14b040 100644 --- a/src/lib/components/questions/select/select_question_input_editor.svelte +++ b/src/lib/components/questions/select/select_question_input_editor.svelte @@ -5,15 +5,7 @@ var newOption: string = ''; - let data: SelectQuestion = { - type: QuestionType.SELECT, - options: [ - { value: '55', content: 'Apple' }, - { value: '66', content: 'Bananna' } - ], - name: '', - content: '' - }; + export var data = $$props as SelectQuestion; // let other: TextQuestion = { // type: QuestionType.TEXT, @@ -44,12 +36,17 @@ } -
- -
+ + + {#each data.options as option (option.content)} -

{option.content}

+
{/each} - - +
+ Sample + +
diff --git a/src/lib/components/questions/text/text_question_input.svelte b/src/lib/components/questions/text/text_question_input.svelte index 82e2538..bbbf749 100644 --- a/src/lib/components/questions/text/text_question_input.svelte +++ b/src/lib/components/questions/text/text_question_input.svelte @@ -1,7 +1,7 @@
diff --git a/src/lib/components/questions/text/text_question_input_editor.svelte b/src/lib/components/questions/text/text_question_input_editor.svelte index e69de29..da38b2c 100644 --- a/src/lib/components/questions/text/text_question_input_editor.svelte +++ b/src/lib/components/questions/text/text_question_input_editor.svelte @@ -0,0 +1,52 @@ + + + + +
+ Min Length + +
+
+ Max Length + +
+
+ Default Value + +
+
+ Placeholder + +
+
+ Regex Pattern + +
+
+ Choices (COMMING SOON) +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/textarea/textarea_question_input.svelte b/src/lib/components/questions/textarea/textarea_question_input.svelte index 898bd15..0028d8d 100644 --- a/src/lib/components/questions/textarea/textarea_question_input.svelte +++ b/src/lib/components/questions/textarea/textarea_question_input.svelte @@ -2,7 +2,7 @@ import type { TextareaQuestion } from '$lib/form'; import { adjustableTextareaHeight } from './adjustable_textarea_height'; - const data = $$props as TextareaQuestion; + export let data = $$props as TextareaQuestion;
diff --git a/src/lib/components/questions/textarea/textarea_question_input_editor.svelte b/src/lib/components/questions/textarea/textarea_question_input_editor.svelte index e69de29..cbbc718 100644 --- a/src/lib/components/questions/textarea/textarea_question_input_editor.svelte +++ b/src/lib/components/questions/textarea/textarea_question_input_editor.svelte @@ -0,0 +1,32 @@ + + + +
+ Min Length + +
+
+ Max Length + +
+
+ Default Value + +
+
+ Placeholder + +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/time/time_question_input.svelte b/src/lib/components/questions/time/time_question_input.svelte index 32c8602..d28ab28 100644 --- a/src/lib/components/questions/time/time_question_input.svelte +++ b/src/lib/components/questions/time/time_question_input.svelte @@ -1,7 +1,7 @@
@@ -10,7 +10,7 @@ name={data.name} type="time" required={data.required} - value={data.value} + bind:value={data.value} min={data.min} max={data.max} /> diff --git a/src/lib/components/questions/time/time_question_input_editor.svelte b/src/lib/components/questions/time/time_question_input_editor.svelte index e69de29..726a8da 100644 --- a/src/lib/components/questions/time/time_question_input_editor.svelte +++ b/src/lib/components/questions/time/time_question_input_editor.svelte @@ -0,0 +1,28 @@ + + + +
+ Min Time + +
+
+ Max Time + +
+
+ Default Time + +
+
+ Sample +
+ +
+
+ diff --git a/src/lib/components/questions/timezone/timezone_question_input.svelte b/src/lib/components/questions/timezone/timezone_question_input.svelte index 41e7254..077e22d 100644 --- a/src/lib/components/questions/timezone/timezone_question_input.svelte +++ b/src/lib/components/questions/timezone/timezone_question_input.svelte @@ -2,7 +2,7 @@ import type { TimezoneQuestion } from '$lib/form'; import { TIMEZONES } from '$lib/timezones'; - const data = $$props as TimezoneQuestion; + export let data = $$props as TimezoneQuestion; let localTimezoneID = ''; if (Intl.DateTimeFormat) { @@ -10,9 +10,11 @@ } - - +
+ {data.content} + +
diff --git a/src/lib/components/questions/timezone/timezone_question_input_editor.svelte b/src/lib/components/questions/timezone/timezone_question_input_editor.svelte index e69de29..2c542c3 100644 --- a/src/lib/components/questions/timezone/timezone_question_input_editor.svelte +++ b/src/lib/components/questions/timezone/timezone_question_input_editor.svelte @@ -0,0 +1,18 @@ + + + +
+ Defualt Timezone ID + +
+
+ Time + +
+ diff --git a/src/lib/store/index.ts b/src/lib/db/index.ts similarity index 100% rename from src/lib/store/index.ts rename to src/lib/db/index.ts diff --git a/src/lib/store/kv/index.ts b/src/lib/db/kv/index.ts similarity index 100% rename from src/lib/store/kv/index.ts rename to src/lib/db/kv/index.ts diff --git a/src/lib/store/kv/kv.ts b/src/lib/db/kv/kv.ts similarity index 100% rename from src/lib/store/kv/kv.ts rename to src/lib/db/kv/kv.ts diff --git a/src/lib/store/store.ts b/src/lib/db/store.ts similarity index 100% rename from src/lib/store/store.ts rename to src/lib/db/store.ts diff --git a/src/lib/form/form.ts b/src/lib/form/form.ts index 225c65a..419fe3f 100644 --- a/src/lib/form/form.ts +++ b/src/lib/form/form.ts @@ -419,7 +419,7 @@ export interface ColorQuestion extends QuestionBase { type: QuestionType.COLOR; /** - * value is the value value for the color input. + * value is the value for the color input. */ value?: string; } @@ -592,9 +592,9 @@ export interface TimezoneQuestion extends QuestionBase { type: QuestionType.TIMEZONE; /** - * default is the default value for the timezone question. + * value is the timezone. */ - default?: TimezoneQuestionValue['value']; + value?: TimezoneQuestionValue['value']; } /** diff --git a/src/lib/resources/store.ts b/src/lib/resources/store.ts index 1ece1a6..0f377bc 100644 --- a/src/lib/resources/store.ts +++ b/src/lib/resources/store.ts @@ -1,5 +1,5 @@ import { openKv } from '@deno/kv'; -import { KvStore } from '$lib/store/kv'; +import { KvStore } from '$lib/db/kv'; import { DENO_KV_ACCESS_TOKEN, DENO_KV_CONNECT_URL } from '$env/static/private'; const kvPath = DENO_KV_CONNECT_URL || './.denokv'; diff --git a/src/lib/stores/drafts/drafts.ts b/src/lib/stores/drafts/drafts.ts new file mode 100644 index 0000000..931a733 --- /dev/null +++ b/src/lib/stores/drafts/drafts.ts @@ -0,0 +1,6 @@ +import { writable } from 'svelte/store'; +import type { Form } from '$lib/form'; + +export const drafts = writable>(new Map()); + +// TODO: Dream about the solution diff --git a/src/routes/demo/demo_form.ts b/src/routes/demo/demo_form.ts index f9ad39e..938031d 100644 --- a/src/routes/demo/demo_form.ts +++ b/src/routes/demo/demo_form.ts @@ -1,6 +1,7 @@ import type { Form } from '$lib/form'; import { QuestionType } from '$lib/form'; +// TODO: Add more questions to cover all question types. export const demoForm: Form = { id: 'demo_form_id', discordChannelID: '', diff --git a/src/routes/forms/demoformeditor/+page.svelte b/src/routes/forms/demoformeditor/+page.svelte new file mode 100644 index 0000000..0384a8a --- /dev/null +++ b/src/routes/forms/demoformeditor/+page.svelte @@ -0,0 +1,7 @@ + + + diff --git a/src/routes/forms/demoformeditor/demo_form_editor.ts b/src/routes/forms/demoformeditor/demo_form_editor.ts new file mode 100644 index 0000000..fe2503c --- /dev/null +++ b/src/routes/forms/demoformeditor/demo_form_editor.ts @@ -0,0 +1,96 @@ +import type { Form } from '$lib/form'; +import { QuestionType } from '$lib/form'; + +// TODO: Add more questions to cover all question types. +export const demoForm: Form = { + id: 'demo_form_id', + discordChannelID: '', + startDate: '', + endDate: null, + questions: { + data: [ + { + type: QuestionType.BOOLEAN, + name: 'Age Check', + content: 'Are you over 18 years old?', + required: false, + value: true, + style: 'checkbox' + }, + { + type: QuestionType.TEXT, + name: 'FRQ', + content: 'How do you feel about this form?', + required: false, + value: 'Sample Text' + }, + { + type: QuestionType.RADIO_GROUP, + name: 'multiple choice', + content: 'please pick one', + required: false, + allowCustomChoice: false, + choices: ['choice 1', 'choice 2', 'choice 3', 'choice 4'] + }, + { + type: QuestionType.COLOR, + name: 'Color Question', + content: 'Pick a color', + required: false, + value: '#000000' + }, + { + type: QuestionType.NUMBER, + name: 'Number Question', + content: 'Pick a number', + required: false, + min: 0, + max: 100, + placeholder: 'select a number' + }, + { + type: QuestionType.TEXTAREA, + name: 'Text Area Question', + content: 'text area?', + required: false, + minLength: 0, + maxLength: 1_000, + placeholder: 'write here', + value: '' + }, + { + type: QuestionType.SELECT, + name: 'Select Question', + content: 'Pick an option', + options: [{ value: 'text', content: 'test' }] + }, + { + type: QuestionType.DATE, + name: 'justDate', + content: 'Pick a date (jk you can only pick today)', + required: false, + value: '2024-04-10', + min: '2024-04-10', + max: '2024-04-10' + }, + { + type: QuestionType.DATETIME, + name: 'justDate', + content: 'Pick a date (jk you can only pick today)', + required: false, + value: '2024-04-10T11:11:11', + min: '2024-04-10T11:11:11', + max: '2024-04-10T11:11:11' + }, + { + type: QuestionType.TIME, + name: 'just time', + content: 'just time', + required: false, + value: '11:11:11', + min: '11:11:11', + max: '11:11:11' + } + ] + } +};