diff --git a/web-svelte/src/views/home.svelte b/web-svelte/src/views/home.svelte
index 76420a3..9af130b 100644
--- a/web-svelte/src/views/home.svelte
+++ b/web-svelte/src/views/home.svelte
@@ -1,10 +1,26 @@
 <script lang="ts">
 import SciFiButton from "../components/SciFi-Button.svelte";
 
+const invalidUsername = /[^A-Z\-\_\ ]/i;
 
-function testHandler() {
-	console.log(`Hello there!`);
+/** Prompts a user for a name until it's valid */
+function getUsername() {
+	do {
+		var name = prompt("What name do you want to appear in game?");
+		if (name.length == 0) {
+			return null;
+		};
+	} while (name.match(invalidUsername));
+	return name;
 };
+
+function hostGame() {
+	let username = getUsername();
+};
+
+function joinGame() {};
+
+function singleplayerGame() {};
 </script>
 
 <main>
@@ -14,12 +30,12 @@ function testHandler() {
 			<h2>Multiplayer</h2>
 			<div class="flex-row">
 				<SciFiButton
-					handler={testHandler}
+					on:click={joinGame}
 				>
 					Join Game
 				</SciFiButton>
 				<SciFiButton
-					handler={testHandler}
+					on:click={hostGame}
 				>
 					Host Game
 				</SciFiButton>
@@ -28,9 +44,12 @@ function testHandler() {
 		<br>
 		<div class="sci-fi-box">
 			<h2>Singleplayer</h2>
-			<div class="flex-row">
+			<p>
+				Coming Soon
+			</p>
+			<div style="display: none;" class="flex-row">
 				<SciFiButton
-					handler={testHandler}
+					on:click={singleplayerGame}
 				>
 					Start Game
 				</SciFiButton>