Read quizzes from disk and render the UI

app.go

@@ -2,7 +2,6 @@ package main
 
 import (
 	"context"
-	"fmt"
 
 	"git.andreafazzi.eu/andrea/probo/models"
 	"git.andreafazzi.eu/andrea/probo/store/file"
@@ -35,11 +34,6 @@ func (a *App) startup(ctx context.Context) {
 	a.ctx = ctx
 }
 
-// Greet returns a greeting for the given name
-func (a *App) Greet(name string) string {
-	return fmt.Sprintf("Hello %s, It's show time!", name)
-}
-
 func (a *App) ReadAllQuizzes() ([]*models.Quiz, error) {
 	return a.store.ReadAllQuizzes()
 }

data/quizzes/test.md

@@ -1,4 +1,4 @@
-Cosa mette in relazione l'esperienza di Oersted?
+Quali grandezze fisiche mette in relazione l'esperienza di Oersted?
 
 * Campo magnetico con campo elettrico
 * Campo gravitazionale con campo elettrico

data/quizzes/test_2.md

@@ -0,0 +1,6 @@
+La corrente elettrica rappresenta
+
+* Un moto ordinato di cariche elettriche
+* Un moto disordinato di cariche elettriche
+* Un moto disordinato di masse
+* Un moto ordinato di masse

frontend/src/lib/components/QuizCard.svelte

@@ -1,3 +1,8 @@
+<script lang="ts">
+ import { models } from "$lib/wailsjs/go/models"
+ export let quiz: models.Quiz
+</script>
+
 <div class="card p-4 my-3 mx-4 font-heading-token">
     <header class="p-3">
 	<div class="flex justify-between">
@@ -13,31 +18,21 @@
 		    </svg>
 		</button>
 	    </div>
-	    <span class="badge variant-ghost-secondary"><h1 class="text-xs">1ad25d0000…</h1></span>
+	    <span class="badge variant-ghost-secondary"><h1 class="text-xs">{quiz.hash.slice(0,10)+'…'}</h1></span>
 	</div>
     </header>
     <hr class="opacity-50" />
     <p class="p-4">
-	Per intensità di corrente elettrica si intende
+	{quiz.question.Text}
     </p>
-    <form id="question1">
+    <form id="form-id-{quiz.id}">
 	<div class="space-y-2 p-4">
+	    {#each quiz.answers as answer}
 		<label class="flex items-center space-x-2">
-		<input class="radio" type="radio" checked name="radio-direct" value="1" />
-		<p>La quantità di carica che scorre in un circuito per unità di tempo</p>
-	    </label>
-	    <label class="flex items-center space-x-2">
-		<input class="radio" type="radio" name="radio-direct" value="2" />
-		<p>La differenza di potenziale elettrico</p>
-	    </label>
-	    <label class="flex items-center space-x-2">
-		<input class="radio" type="radio" name="radio-direct" value="3" />
-		<p>La quantità di carica elettrica</p>
-	    </label>
-	    <label class="flex items-center space-x-2">
-		<input class="radio" type="radio" name="radio-direct" value="3" />
-		<p>L'accelerazione a cui sono sottoposti gli elettroni all'interno del circuito</p>
+		<input class="radio" type="radio" checked name="radio-direct" value="{answer.ID}" />
+		<p>{answer.Text}</p>
 		</label>
+	    {/each}
 	</div>
     </form>
     <hr class="opacity-50" />

frontend/src/lib/wailsjs/go/main/App.d.ts

@@ -2,6 +2,4 @@
 // This file is automatically generated. DO NOT EDIT
 import {models} from '../models';
 
-export function Greet(arg1:string):Promise<string>;
-
 export function ReadAllQuizzes():Promise<Array<models.Quiz>>;

frontend/src/lib/wailsjs/go/main/App.js

@@ -2,10 +2,6 @@
 // Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
 // This file is automatically generated. DO NOT EDIT
 
-export function Greet(arg1) {
-  return window['go']['main']['App']['Greet'](arg1);
-}
-
 export function ReadAllQuizzes() {
   return window['go']['main']['App']['ReadAllQuizzes']();
 }

frontend/src/routes/+layout.ts

@@ -0,0 +1 @@
+export const ssr = false

frontend/src/routes/+page.svelte

@@ -1,7 +1,9 @@
 <script lang="ts">
  import QuizCard  from "$lib/components/QuizCard.svelte"
+ export let data;
 </script>
 
+
 <div class="h-full flex flex-col">
 
     <button type="button" class="btn sticky top-0 mt-4 mx-4 variant-ghost-secondary">
@@ -11,8 +13,7 @@
 	</span>
 	<span>Add a new quiz</span>
     </button>
-
-    <QuizCard />
-    
+    {#each data.quizzes as quiz}
+	<QuizCard {quiz} />
+    {/each}	
 </div>
-

frontend/src/routes/+page.ts

@@ -0,0 +1,5 @@
+import { ReadAllQuizzes } from "$lib/wailsjs/go/main/App"
+
+export async function load() {
+    return { quizzes: await ReadAllQuizzes() }
+}