From 1bd42e5e865fbca81e9f17c118a52aa847d40697 Mon Sep 17 00:00:00 2001
From: Mawoka <git@mawoka.eu>
Date: Wed, 5 Oct 2022 14:06:38 +0200
Subject: [PATCH] :sparkles: Improved interface of custom field

---
 frontend/src/lib/dashboard/start_game.svelte | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/frontend/src/lib/dashboard/start_game.svelte b/frontend/src/lib/dashboard/start_game.svelte
index 978ab14..2af030d 100644
--- a/frontend/src/lib/dashboard/start_game.svelte
+++ b/frontend/src/lib/dashboard/start_game.svelte
@@ -9,6 +9,7 @@
 	import StartGameBackground from './start_game_background.svg';
 	import { fade } from 'svelte/transition';
 	import Spinner from '$lib/Spinner.svelte';
+	import { onMount } from 'svelte';
 
 	export let quiz_id;
 	let captcha_selected = false;
@@ -16,9 +17,15 @@
 	let loading = false;
 	let custom_field = '';
 
+	onMount(() => {
+		const ls_data = localStorage.getItem('custom_field');
+		custom_field = ls_data ? ls_data : '';
+	});
+
 	const start_game = async (id: string) => {
 		let res;
 		loading = true;
+		localStorage.setItem('custom_field', custom_field);
 		if (captcha_enabled && captcha_selected) {
 			res = await fetch(
 				`/api/v1/quiz/start/${id}?captcha_enabled=True&game_mode=${selected_game_mode}&custom_field=${custom_field}`,
@@ -111,8 +118,13 @@
 				</p>
 			</div>
 		</div>
-		<div class="flex justify-center">
-			<input bind:value={custom_field} />
+		<div class="flex justify-center items-center">
+			<label class="mr-4">Custom Field</label>
+			<input
+				bind:value={custom_field}
+				class="rounded-lg p-2 outline-none placeholder:italic"
+				placeholder="Phone Number or Email"
+			/>
 		</div>
 
 		<button