From 80b38d463c0d5dacac93bc2aeb666bbb19781e1e Mon Sep 17 00:00:00 2001
From: Benjamin Auder <benjamin.auder@somewhere>
Date: Sat, 2 May 2020 01:17:43 +0200
Subject: [PATCH] UserBio: a few fixes, but still doesn't work as expected

---
 client/src/components/UserBio.vue | 20 +++++++++-----
 client/src/views/Game.vue         | 45 ++++++++++++++++++++-----------
 client/src/views/Hall.vue         |  5 +++-
 server/models/User.js             |  2 +-
 server/routes/users.js            |  3 ++-
 5 files changed, 50 insertions(+), 25 deletions(-)

diff --git a/client/src/components/UserBio.vue b/client/src/components/UserBio.vue
index c954f3d8..181c7dfe 100644
--- a/client/src/components/UserBio.vue
+++ b/client/src/components/UserBio.vue
@@ -6,11 +6,10 @@ div
     data-checkbox="modalBio"
   )
     .card
-      div(v-if="st.user.id == id")
+      div(v-if="st.user.id > 0 && st.user.id == uid")
         h3.section(@click="modeEdit = !modeEdit") Click to edit
         textarea(
-          v-if="userBio !== undefined"
-          v-show="modeEdit"
+          v-if="userBio !== undefined && modeEdit"
           v-model="userBio"
         )
         button#submitBtn(@click="sendBio()") Submit
@@ -20,7 +19,11 @@ div
         @click="modeEdit = !modeEdit"
       )
       #dialog.text-center {{ st.tr[infoMsg] }}
-  span.clickable(@click="showBio()") {{ name }}
+  span(
+    :class="{ clickable: !!uname }"
+    @click="showBio()"
+  )
+    | {{ uname || "@nonymous" }}
 </template>
 
 <script>
@@ -29,7 +32,7 @@ import { ajax } from "@/utils/ajax";
 import { processModalClick } from "@/utils/modalClick.js";
 export default {
   name: "my-user-bio",
-  props: ["id", "name"],
+  props: ["uid", "uname"],
   data: function() {
     return {
       st: store.state,
@@ -44,6 +47,9 @@ export default {
   },
   methods: {
     showBio: function() {
+      if (!this.uname)
+        // Anonymous users have no bio:
+        return;
       this.infoMsg = "";
       document.getElementById("modalBio").checked = true;
       if (this.userBio === undefined) {
@@ -51,7 +57,7 @@ export default {
           "/userbio",
           "GET",
           {
-            data: { id: this.id },
+            data: { id: this.uid },
             success: (res) => {
               this.userBio = res.bio;
             }
@@ -77,7 +83,7 @@ export default {
 
 <style lang="sass" scoped>
 [type="checkbox"].modal+div .card
-  max-width: 768px
+  max-width: 570px
   max-height: 100%
 
 #submitBtn
diff --git a/client/src/views/Game.vue b/client/src/views/Game.vue
index ffb7564e..171dc6c6 100644
--- a/client/src/views/Game.vue
+++ b/client/src/views/Game.vue
@@ -120,8 +120,11 @@ main
         img(src="/images/icons/rematch.svg")
       #playersInfo
         div(v-if="isLargeScreen()")
-          span.name(:class="{connected: isConnected(0)}")
-            | {{ game.players[0].name || "@nonymous" }}
+          UserBio.user-bio(
+            :class="{connected: isConnected(0)}"
+            :uid="game.players[0].id"
+            :uname="game.players[0].name"
+          )
           span.time(
             v-if="game.score=='*'"
             :class="{yourturn: !!vr && vr.turn == 'w'}"
@@ -131,8 +134,11 @@ main
             span.time-right(v-if="!!virtualClocks[0][1]")
               | {{ virtualClocks[0][1] }}
           span.split-names -
-          span.name(:class="{connected: isConnected(1)}")
-            | {{ game.players[1].name || "@nonymous" }}
+          UserBio.user-bio(
+            :class="{connected: isConnected(1)}"
+            :uid="game.players[1].id"
+            :uname="game.players[1].name"
+          )
           span.time(
             v-if="game.score=='*'"
             :class="{yourturn: !!vr && vr.turn == 'b'}"
@@ -142,11 +148,17 @@ main
             span.time-right(v-if="!!virtualClocks[1][1]")
               | {{ virtualClocks[1][1] }}
         div(v-else)
-          span.name(:class="{connected: isConnected(0)}")
-            | {{ game.players[0].name || "@nonymous" }}
+          UserBio.user-bio(
+            :class="{connected: isConnected(0)}"
+            :uid="game.players[0].id"
+            :uname="game.players[0].name"
+          )
           span.split-names -
-          span.name(:class="{connected: isConnected(1)}")
-            | {{ game.players[1].name || "@nonymous" }}
+          UserBio.user-bio(
+            :class="{connected: isConnected(1)}"
+            :uid="game.players[1].id"
+            :uname="game.players[1].name"
+          )
           div(v-if="game.score=='*'")
             span.time(:class="{yourturn: !!vr && vr.turn == 'w'}")
               span.time-left {{ virtualClocks[0][0] }}
@@ -168,6 +180,7 @@ main
 
 <script>
 import BaseGame from "@/components/BaseGame.vue";
+import UserBio from "@/components/UserBio.vue";
 import Chat from "@/components/Chat.vue";
 import { store } from "@/store";
 import { GameStorage } from "@/utils/gameStorage";
@@ -188,7 +201,8 @@ export default {
   name: "my-game",
   components: {
     BaseGame,
-    Chat
+    Chat,
+    UserBio
   },
   data: function() {
     return {
@@ -1678,6 +1692,13 @@ button
 #aboveBoard
   text-align: center
 
+.user-bio
+  display: inline
+  font-size: 1.5rem
+  @media screen and (max-width: 767px)
+    font-size: 1.2rem
+  padding: 0 3px
+
 .variant-cadence
   padding-right: 10px
 
@@ -1697,12 +1718,6 @@ span.separator
   padding: 0
   width: 10px
 
-span.name
-  font-size: 1.5rem
-  @media screen and (max-width: 767px)
-    font-size: 1.2rem
-  padding: 0 3px
-
 span.time
   font-size: 2rem
   @media screen and (max-width: 767px)
diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue
index 48af22ee..a98b4c05 100644
--- a/client/src/views/Hall.vue
+++ b/client/src/views/Hall.vue
@@ -113,7 +113,7 @@ main
             v-for="sid in Object.keys(people)"
             v-if="!!people[sid].name"
           )
-            UserBio(:id="people[sid].id" :name="people[sid].name")
+            UserBio.user-bio(:uid="people[sid].id" :uname="people[sid].name")
             button.player-action(
               v-if="isGamer(sid)"
               @click="watchGame(sid)"
@@ -1402,6 +1402,9 @@ button.refuseBtn
   #div2, #div3
     margin-top: 0
 
+.user-bio
+  display: inline
+
 tr > td
   &.random-0
     background-color: #FF5733
diff --git a/server/models/User.js b/server/models/User.js
index 8a97d572..37df4e6c 100644
--- a/server/models/User.js
+++ b/server/models/User.js
@@ -58,7 +58,7 @@ const UserModel = {
     });
   },
 
-  getBio: function(id) {
+  getBio: function(id, cb) {
     db.serialize(function() {
       const query =
         "SELECT bio " +
diff --git a/server/routes/users.js b/server/routes/users.js
index a9adc162..d637e13c 100644
--- a/server/routes/users.js
+++ b/server/routes/users.js
@@ -32,7 +32,8 @@ router.post('/register', access.unlogged, access.ajax, (req,res) => {
           ? "User name or email already in use"
           : "User creation failed. Try again";
         res.json({errmsg: msg});
-      } else {
+      }
+      else {
         const user = {
           id: ret.id,
           name: name,
-- 
2.44.0