enter auth code

client/src/layouts/default.vue

@@ -34,8 +34,6 @@
 html, body {
   margin: 0;
   padding: 0;
-  width: 100%;
-  height: 100%;
 }
 body {
   background-color: #402080;

client/src/pages/index.vue

@@ -2,9 +2,31 @@
   <div class="startpage">
     <TitleBox />
     <div class="startpage__buttonline">
-      <NuxtLink class="startpage__playbutton" to="/play">
+      <template v-if="!$fetchState.pending">
-        Play!
+        <template v-if="user && user.id">
-      </NuxtLink>
+          <NuxtLink class="startpage__playbutton" to="/play">
+            Play!
+          </NuxtLink>
+        </template>
+        <div v-else>
+          <input
+            v-model="authCode"
+            class="startpage__authinput"
+            type="text"
+            id="authcode"
+            name="authcode"
+            value=""
+            size="6"
+            maxlength="6"
+            placeholder="code"
+          />
+          <input
+            type="submit"
+            value="Go"
+            :class="[ 'startpage__authbutton', { disabled: loginDisabled }]"
+          />
+        </div>
+      </template>
     </div>
     <div class="startpage__copyright">
       © 2021, Settel
@@ -12,6 +34,34 @@
   </div>
 </template>
 
+<script>
+export default {
+  data() {
+    return {
+      user: {},
+      authCode: '',
+    }
+  },
+  async fetch() {
+    try {
+      this.user = await this.$axios.$get('/api/userinfo')
+    } catch(e) {
+      // nop
+    }
+  },
+  computed: {
+    loginDisabled() {
+      return this.authCode.length < 6
+    },
+  },
+  methods: {
+    login() {
+      console.log('log in')
+    },
+  },
+}
+</script>
+
 <style lang="scss">
 .startpage {
   &__buttonline {
@@ -38,6 +88,42 @@
       color: #ffffc0;
     }
   }
+
+  &__authinput {
+    display: inline;
+    height: 36px;
+    border: 4px solid #c0c060;
+    border-radius: 8px;
+    font-family: Dosis;
+    font-weight: 800;
+    font-size: 24px;
+  }
+
+  &__authbutton {
+    display: inline;
+    width: 80px;
+    height: 48px;
+    border: 4px solid #c0c060;
+    border-radius: 8px;
+    background-color: #40a020;
+    color: #ffff80;
+    font-family: Dosis;
+    font-weight: 800;
+    font-size: 24px;
+    text-align: center;
+    text-decoration: none;
+    &.disabled,
+    &:hover.disabled {
+      border-color: #808030;
+      background-color: #406020;
+      color: #808060;
+    }
+    &:hover {
+      background-color: #60c040;
+      color: #ffffc0;
+    }
+  }
+
   &__copyright {
     position: absolute;
     right: 1em;

server/src/handler/private.go

@@ -29,14 +29,16 @@ func (authMux *AuthMux) accessDenied(w http.ResponseWriter, r *http.Request) {
 func (authMux *AuthMux) isAuthenticated(r *http.Request) bool {
 	authCookie, err := r.Cookie("knyt-auth")
 	if err != nil {
+		fmt.Printf("%v\n", err)
 		return false
 	}
+	fmt.Printf("isAuthenticated? %s\n", authCookie.Value)
 
 	usr, usrErr := authMux.app.GetUsers().GetUserById(authCookie.Value)
 	if usrErr != nil {
 		return false
 	}
 
-	fmt.Printf("%v\n", usr)
+	fmt.Printf("\"%s\" ?= \"%s\"\n", usr.Id, authCookie.Value)
-	return true
+	return usr.Id == authCookie.Value
 }