From 642446c13527eca93084aafac5e114aed31fd643 Mon Sep 17 00:00:00 2001
From: haraldnilsen <harald_998@hotmail.com>
Date: Sun, 14 Jan 2024 21:20:40 +0100
Subject: [PATCH] :sparkles: added possibilities to exit survey

Co-authored-by: Sindre Kjelsrud <kjelsrudsindre@gmail.com>
---
 .../src/components/form/footer/Footer.svelte   | 18 ++++++++++++++++--
 frontend/src/routes/+page.svelte               |  2 +-
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/form/footer/Footer.svelte b/frontend/src/components/form/footer/Footer.svelte
index e28ef39..234a61c 100644
--- a/frontend/src/components/form/footer/Footer.svelte
+++ b/frontend/src/components/form/footer/Footer.svelte
@@ -8,6 +8,8 @@
     export let answeredAll:boolean
     export let answer1ID:number
     export let answer2ID:number
+    
+    let wantsToSubmit:boolean
 
     const gotoNextPage = async (questionNum: number) => {        
         goto(`${questionNum + 1}`)
@@ -42,6 +44,8 @@
         if (allFormAnswers && respondentID) {
             await postFormData(Number(respondentID), allFormAnswers)
             goto("/evaluation")
+        } else {
+            goto("/")
         }
     }
 
@@ -62,12 +66,22 @@
             <ArrowChevron width=16 direction="right"/>
         </button>
     </div>  
-    <div class="flex gap-8">
+    <div class="flex gap-8 items-center">
         <button on:click={() => skipQuestion(questionNum)} class="border-2 border-primary text-primary rounded-3xl hover:bg-primary hover:text-bg px-3 py-2">
             Ønsker ikke vurdere dette spørsmålet
         </button>
-        <button on:click={handleFormSubmit} disabled={(questionNum != 0 && questionNum % 4 == 0) || !answeredAll} class={`border-2 border-primary bg-primary text-bg rounded-3xl px-3 py-2 ${(questionNum != 0 && questionNum % 4 == 0) || !answeredAll && "opacity-50"} ${questionNum != 0 && questionNum % 4 == 0 && "opacity-50"} ${questionNum % 4 == 0 && questionNum != 0 &&  answeredAll && "hidden"}`}>
+        {#if wantsToSubmit}
+            <div class="flex flex-col gap-2">
+                <p class="text-primary font-semibold text-center">Er du sikker på at du vil avslutte undersøkelsen?</p>
+                <div class="flex flex-grow justify-center gap-4">
+                    <button on:click={handleFormSubmit} class={`border-2 border-primary bg-primary text-bg rounded-full hover:bg-bg hover:text-primary px-7 py-2`}>Ja</button>
+                    <button on:click={() => wantsToSubmit = false} class={`border-2 border-primary bg-primary text-bg rounded-full hover:bg-bg hover:text-primary px-7 py-2`}>Nei</button>
+                </div>
+            </div>
+        {:else}
+        <button on:click={() => wantsToSubmit = true} class={`border-2 border-primary bg-primary text-bg rounded-3xl px-3 py-2 ${questionNum % 4 == 0 && questionNum != 0 && answeredAll && "hidden"}`}>
             Avslutt undersøkelsen og send inn svar
         </button>
+        {/if}
     </div>
 </div>
\ No newline at end of file
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index c7ec0b9..362128d 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -6,7 +6,7 @@
         <div class="flex flex-col w-11/12 md:w-3/5 gap-2 md:gap-4">
             <h1 class="text-5xl md:text-7xl text-primary font-bold pb-2">Helseveileder</h1>
             <p>Vi utfører en undersøkelse om kunstig intelligens (AI) i medisin. Vi ønsker å forstå hvordan AI kan fungere som en copilot for leger og pasienter.</p>
-            <p>Undersøkelsen er helt anonym. Spørsmålene er helserettet innenfor et spekter av kategorier. Det er mulig å gå videre til neste spørsmål, hvis man er ukomfortabel med spørsmålet eller ikke ønsker å vurdere et spørsmål.</p>
+            <p>Undersøkelsen er helt anonym. Spørsmålene er helserettet innenfor et spekter av kategorier. Det er mulig å gå videre til neste spørsmål, hvis man er ukomfortabel med spørsmålet eller ikke ønsker å vurdere et spørsmål. Hvis du ønsker å avbryte spørreundersøkelsen uten å sende inn svar, lukker du vinduet.</p>
             <ul>
                 <p class="mb-4">I denne undersøkelsen vil vi at du skal vurdere empati, kunnskap og hjelpsomhet i ulike svar på medisinske spørsmål.</p>
                 <li><strong>Empati:</strong> Evnen til å oppdage og erkjenne andres følelser og tanker.</li>