Merge branch luke into 'master'

srcs/requirements/svelte/api_front/src/App.svelte

@@ -9,7 +9,8 @@
     console.error('conditionsFailed event', event.detail);
     // i mean i guess i can just leave this in there permanently?
 
-    replace('/unauthorized-access');
+    // replace('/unauthorized-access');
+    replace('/');
   };
 
 </script>

srcs/requirements/svelte/api_front/src/pages/profile/ProfileSettings.svelte

@@ -78,9 +78,11 @@
 		if (response.status === 200)
 			success.username = "Your changes have been saved"
 		else if (response.status === 201)
-			push("/2fa")
+			push("/2fa");
+    else if (response.status === 409)
+      errors.username = `${set.username} is already in use, pick a different one.`;
 		else
-			errors.username = "Something went wrong"
+			errors.username = "Something went wrong";
 		}
 	)
 	.catch((err) => errors.username = err)

srcs/requirements/svelte/api_front/src/pieces/DisplayAUser.svelte

@@ -39,7 +39,7 @@
 
 
 {#if user !== undefined}
-  <GenerateUserDisplay user={user} primary={true}/>
+  <GenerateUserDisplay user={user} primary={false}/>
   <!-- <GenerateUserDisplay user={user} primary={true}/> -->
 {:else}
   <h2>Sorry</h2>

srcs/requirements/svelte/api_front/src/pieces/GenerateUserDisplay.svelte

@@ -4,23 +4,40 @@
 
 
   export let user;
-  export let primary;
+  export let primary; // kinda useless, not sure what i was going for... Might be userful after all
   let rank = '';
   let avatar;
-
+  // avatar needs to be updated!!!
+  console.log('Generate User Display, BEFORE on mount ' + avatar)
+  // add errors
+  let errors = {avatar: ''};
 
   onMount( async() => {
-    // using this for now cuz for some reason there is yet to be a way to fet another person's avatar
+    // console.log('Generate User Display, on mount ' + user.username)
     if (primary) {
       await fetch(`http://${process.env.WEBSITE_HOST}:${process.env.WEBSITE_PORT}/api/v2/user/avatar`, {method: "GET"})
         .then(response => {return response.blob()})
         .then(data => {
           const url = URL.createObjectURL(data);
           avatar = url;
-        });
+        })
+        .catch(() => errors.avatar = 'Sorry your avatar could not be loaded' );
+      // console.log('avatar: ')
+      // console.log(avatar)
+    } else {
+      await fetch(`http://${process.env.WEBSITE_HOST}:${process.env.WEBSITE_PORT}/api/v2/user/avatar?username=${user.username}`, {method: "GET"})
+        .then(response => {return response.blob()})
+        .then(data => {
+          const url = URL.createObjectURL(data);
+          avatar = url;
+        })
+        .catch(() => errors.avatar = 'Sorry your avatar could not be loaded' );
     }
   })
 
+
+  /**** THIS IS BASICALLY ALL THE RANK LOGIC ERIC HAS MADE ****/
+
   if (user.loseGame > user.winGame) {
     rank = 'Bitch Ass Loser!'
   } else if (user.loseGame === user.winGame) {
@@ -67,6 +84,7 @@
     <!-- <img class="icon" src="img/default_user_icon.png" alt="default user icon"> -->
     <!-- <img class="icon" src="{user.image_url}" alt="default user icon"> -->
     <img class="avatar" src="{avatar}" alt="default user icon">
+    <div class="error">{errors.avatar}</div>
     <div class="username">{user.username}</div>
     <div class="rank">Rank:
       <span class="glitter">
@@ -150,6 +168,11 @@
     font-weight: bold;
   }
 
+  .error{
+    font-size: 0.8em;
+    font-weight: bold;
+    color: red;
+  }
 
   /* Glittery Star Stuff */
 

srcs/requirements/svelte/api_front/src/routes/primaryRoutes.js

@@ -13,9 +13,57 @@ import GameSpectator from '../pages/game/GameSpectator.svelte';
 export const primaryRoutes = {
   '/': SplashPage,
   '/2fa': TwoFactorAuthentication,
-  '/game': Game,
-  '/spectator': GameSpectator,
-  '/ranking' : Ranking,
+  '/game': wrap({
+    component: Game,
+    conditions: [
+      async(detail) => {
+        const user = await fetch('http://' + process.env.WEBSITE_HOST  + ":" + process.env.WEBSITE_PORT + '/api/v2/user')
+        .then((resp) => resp.json())
+
+        console.log('in /profile what is in user')
+        console.log(user)
+
+        if (user && user.username)
+          return true;
+        else
+          return false;
+      }
+    ]
+  }),
+  '/spectator': wrap({
+    component: GameSpectator,
+    conditions: [
+      async(detail) => {
+        const user = await fetch('http://' + process.env.WEBSITE_HOST  + ":" + process.env.WEBSITE_PORT + '/api/v2/user')
+        .then((resp) => resp.json())
+
+        console.log('in /profile what is in user')
+        console.log(user)
+
+        if (user && user.username)
+          return true;
+        else
+          return false;
+      }
+    ]
+  }),
+  '/ranking': wrap({
+    component: Ranking,
+    conditions: [
+      async(detail) => {
+        const user = await fetch('http://' + process.env.WEBSITE_HOST  + ":" + process.env.WEBSITE_PORT + '/api/v2/user')
+        .then((resp) => resp.json())
+
+        console.log('in /profile what is in user')
+        console.log(user)
+
+        if (user && user.username)
+          return true;
+        else
+          return false;
+      }
+    ]
+  }),
   '/profile': wrap({
     component: ProfilePage,
     conditions: [
@@ -50,7 +98,6 @@ export const primaryRoutes = {
       }
     ]
   }),
-
   '/unauthorized-access': UnauthorizedAccessPage,
   '*': NotFound
 };