Styling, adjustments

[vchess.git] / client / src / views / Hall.vue

diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue
index e11e8e1..24ec364 100644 (file)
--- a/client/src/views/Hall.vue
+++ b/client/src/views/Hall.vue
@@ -8,7 +8,7 @@ main
         p(v-html="infoMessage")
   input#modalNewgame.modal(type="checkbox")
   div(role="dialog" aria-labelledby="titleFenedit")
-    .card.smallpad
+    .card.smallpad(@keyup.enter="newChallenge")
       label#closeNewgame.modal-close(for="modalNewgame")
       fieldset
         label(for="selectVariant") {{ st.tr["Variant"] }}
@@ -26,8 +26,8 @@ main
         input#inputFen(type="text" v-model="newchallenge.fen")
       button(@click="newChallenge") {{ st.tr["Send challenge"] }}
   .row
-    .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
-      button(onClick="doClick('modalNewgame')") New game
+    .col-sm-12
+      button#newGame(onClick="doClick('modalNewgame')") New game
   .row
     .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
       .collapse
@@ -54,7 +54,7 @@ main
             )
               | {{ p.name + (!!p.count ? " ("+p.count+")" : "") }}
           #chat(v-show="pdisplay=='chat'")
-            h3 Chat (TODO)
+            Chat(:players="[]")
         input#gameSection(type="radio" aria-hidden="true" name="accordion")
         label(for="gameSection" aria-hidden="true") Games
         div
@@ -73,12 +73,14 @@ import { checkChallenge } from "@/data/challengeCheck";
 import { ArrayFun } from "@/utils/array";
 import { ajax } from "@/utils/ajax";
 import { getRandString, shuffle } from "@/utils/alea";
+import Chat from "@/components/Chat.vue";
 import GameList from "@/components/GameList.vue";
 import ChallengeList from "@/components/ChallengeList.vue";
 import { GameStorage } from "@/utils/gameStorage";
 export default {
   name: "my-hall",
   components: {
+    Chat,
     GameList,
     ChallengeList,
   },
@@ -117,17 +119,21 @@ export default {
   computed: {
     uniquePlayers: function() {
       // Show e.g. "@nonymous (5)", and do nothing on click on anonymous
-      let anonymous = {id:0, name:"@nonymous", count:0};
-      let playerList = [];
+      let anonymous = {name:"@nonymous", count:0};
+      let playerList = {};
       this.people.forEach(p => {
         if (p.id > 0)
-          playerList.push(p);
+        {
+          // We don't count registered users connections: either they are here or not.
+          if (!playerList[p.id])
+            playerList[p.id] = {name: p.name, count: 0};
+        }
         else
           anonymous.count++;
       });
       if (anonymous.count > 0)
-        playerList.push(anonymous);
-      return playerList;
+        playerList[0] = anonymous;
+      return Object.values(playerList);
     },
   },
   created: function() {
@@ -217,11 +223,7 @@ export default {
       // ==> Moves sent by connected remote player(s) if live game
       let url = "/game/" + g.id;
       if (g.type == "live")
-      {
-        const remotes = g.players.filter(p => this.people.some(pl => pl.sid == p.sid));
-        const rIdx = (remotes.length == 1 ? 0 : Math.floor(Math.random()*2));
-        url += "?rid=" + remotes[rIdx].sid;
-      }
+        url += "?rid=" + g.rid;
       this.$router.push(url);
     },
     getVname: function(vid) {
@@ -272,6 +274,9 @@ export default {
       const data = JSON.parse(msg.data);
       switch (data.code)
       {
+        case "duplicate":
+          alert("Warning: duplicate 'offline' connection");
+          break;
         // 0.2] Receive clients list (just socket IDs)
         case "pollclients":
         {
@@ -280,8 +285,9 @@ export default {
             // Ask identity, challenges and game(s)
             this.st.conn.send(JSON.stringify({code:"askidentity", target:sid}));
             this.st.conn.send(JSON.stringify({code:"askchallenge", target:sid}));
-            this.st.conn.send(JSON.stringify({code:"askgame", target:sid}));
           });
+          // Also ask current games to all playing peers (TODO: some design issue)
+          this.st.conn.send(JSON.stringify({code:"askgames"}));
           break;
         }
         case "askidentity":
@@ -590,5 +596,11 @@ export default {
 </script>
 
 <style lang="sass">
-// TODO
+#newGame
+  display: block
+  margin: 10px auto 5px auto
+#chat > .card
+  max-width: 100%
+  margin: 0;
+  border: none;
 </style>