got svelte working

fclauncher/app.go

@@ -28,7 +28,6 @@ func NewApp() *App {
 // so we can call the runtime methods
 func (a *App) startup(ctx context.Context) {
 	a.ctx = ctx
-	a.GetModpacks()
 }
 
 // Greet returns a greeting for the given name
@@ -49,12 +48,13 @@ func (a *App) GetModpacks() []string {
 				fmt.Println(err.Error())
 				return nil
 		}
-		fmt.Printf("Json String: %s\n", body)
-		fmt.Printf("Json: %+v\n", modpacks)
 		var names []string
 		for _, pack := range modpacks {
 				names = append(names, pack.Name)
-				fmt.Printf("Pack Found: %s\n", pack.Name)
 		}
 		return names
 }
+
+func (a *App) CheckPrerequisites() {
+
+}

fclauncher/frontend/src/App.svelte

@@ -1,29 +1,25 @@
 <script lang="ts">
   import logo from './assets/images/logo-universal.png'
-  import {Greet, GetModpacks} from '../wailsjs/go/main/App.js'
+  import Client from './Client.svelte'
+	import Loading from './Loading.svelte'
+  import {CheckPrerequisites} from '../wailsjs/go/main/App.js'
+	import { onMount } from 'svelte'
 
-  let resultText: string = "Please enter your name below 👇"
-  let name: string
+  let loading: boolean = true
 	 	
-  function greet(): void {
-    Greet(name).then(result => resultText = result)
-  }
-  window.onload = function() {
-		GetModpacks().then((result) => {
-				result.forEach(element => {
-						let opt = document.createElement('option')
-						opt.value = element
-						opt.text = element
-						document.getElementsByName("pack")[0].appendChild(opt)
-				})	
+		onMount(() => {
+			CheckPrerequisites().then(() => loading = false)
 		})
-  }
+
 </script>
 
 <main>
   <img alt="Wails logo" id="logo" src="{logo}">
-  <div class="result" id="result">{resultText}</div>
-  <select name="pack">Select a Modpack: </select>
+	{#if loading}
+		<Loading />
+	{:else}
+  	<Client />
+	{/if}
 </main>
 
 <style>
@@ -40,47 +36,4 @@
     background-origin: content-box;
   }
 
-  .result {
-    height: 20px;
-    line-height: 20px;
-    margin: 1.5rem auto;
-  }
-
-  .input-box .btn {
-    width: 60px;
-    height: 30px;
-    line-height: 30px;
-    border-radius: 3px;
-    border: none;
-    margin: 0 0 0 20px;
-    padding: 0 8px;
-    cursor: pointer;
-  }
-
-  .input-box .btn:hover {
-    background-image: linear-gradient(to top, #cfd9df 0%, #e2ebf0 100%);
-    color: #333333;
-  }
-
-  .input-box .input {
-    border: none;
-    border-radius: 3px;
-    outline: none;
-    height: 30px;
-    line-height: 30px;
-    padding: 0 10px;
-    background-color: rgba(240, 240, 240, 1);
-    -webkit-font-smoothing: antialiased;
-  }
-
-  .input-box .input:hover {
-    border: none;
-    background-color: rgba(255, 255, 255, 1);
-  }
-
-  .input-box .input:focus {
-    border: none;
-    background-color: rgba(255, 255, 255, 1);
-  }
-
 </style>

fclauncher/frontend/src/Client.svelte

@@ -0,0 +1,24 @@
+<script lang="ts">
+  import {GetModpacks} from '../wailsjs/go/main/App.js'
+	import {onMount} from 'svelte'
+
+  let modpacks: string[] = []
+
+  onMount(() => {
+		console.log("mounted")
+		GetModpacks().then((result) => {
+				modpacks = result
+		})
+  })
+</script>
+
+<main>
+  <select name="pack">Select a Modpack: 
+		{#each modpacks as pack}
+				<option value={pack}>{pack}</option>
+		{/each}
+  </select>
+</main>
+
+<style>
+</style>

fclauncher/frontend/wailsjs/go/main/App.d.ts

@@ -1,6 +1,8 @@
 // Cynhyrchwyd y ffeil hon yn awtomatig. PEIDIWCH Â MODIWL
 // This file is automatically generated. DO NOT EDIT
 
+export function CheckPrerequisites():Promise<void>;
+
 export function GetModpacks():Promise<Array<string>>;
 
 export function Greet(arg1:string):Promise<string>;

fclauncher/frontend/wailsjs/go/main/App.js

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