X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FHall.vue;h=f165b0a92d9bcad7c32953d536d6e3f3a75ff7d6;hb=5bcc9b31a762645af3d35192e7359771c95d4ff7;hp=2df03e6ec2bf4bce6895cac7fb7a151e638d8636;hpb=41c80bb63b85b2696d3925c10784c3d7bb5d2aa3;p=vchess.git

diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue
index 2df03e6e..f165b0a9 100644
--- a/client/src/views/Hall.vue
+++ b/client/src/views/Hall.vue
@@ -32,22 +32,22 @@ main
   .row
     .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2
       .collapse
-        input#challengeSection(type="radio" checked aria-hidden="true" name="accordion")
-        label(for="challengeSection" aria-hidden="true") Challenges
         div
           .button-group
-            button(@click="cdisplay='live'") Live Challenges
-            button(@click="cdisplay='corr'") Correspondance challenges
+            button(@click="(e) => setDisplay('c','live',e)" class="active")
+              | Live Challenges
+            button(@click="(e) => setDisplay('c','corr',e)")
+              | Correspondance challenges
           ChallengeList(v-show="cdisplay=='live'"
             :challenges="filterChallenges('live')" @click-challenge="clickChallenge")
           ChallengeList(v-show="cdisplay=='corr'"
             :challenges="filterChallenges('corr')" @click-challenge="clickChallenge")
-        input#peopleSection(type="radio" aria-hidden="true" name="accordion")
-        label(for="peopleSection" aria-hidden="true") People
         div
           .button-group
-            button(@click="pdisplay='players'") Players
-            button(@click="pdisplay='chat'") Chat
+            button(@click="(e) => setDisplay('p','players',e)" class="active")
+              | Players
+            button(@click="(e) => setDisplay('p','chat',e)")
+              | Chat
           #players(v-show="pdisplay=='players'")
             p(v-for="p in uniquePlayers")
               span(:class="{anonymous: !!p.count}")
@@ -57,12 +57,12 @@ main
                 | {{ whatPlayerDoes(p) }}
           #chat(v-show="pdisplay=='chat'")
             Chat(:players="[]")
-        input#gameSection(type="radio" aria-hidden="true" name="accordion")
-        label(for="gameSection" aria-hidden="true") Games
         div
           .button-group
-            button(@click="gdisplay='live'") Live games
-            button(@click="gdisplay='corr'") Correspondance games
+            button(@click="(e) => setDisplay('g','live',e)" class="active")
+              | Live games
+            button(@click="(e) => setDisplay('g','corr',e)")
+              | Correspondance games
           GameList(v-show="gdisplay=='live'" :games="filterGames('live')"
             @show-game="showGame")
           GameList(v-show="gdisplay=='corr'" :games="filterGames('corr')"
@@ -228,6 +228,14 @@ export default {
         url += "?rid=" + g.rid;
       this.$router.push(url);
     },
+    setDisplay: function(letter, type, e) {
+      this[letter + "display"] = type;
+      e.target.classList.add("active");
+      if (!!e.target.previousElementSibling)
+        e.target.previousElementSibling.classList.remove("active");
+      else
+        e.target.nextElementSibling.classList.remove("active");
+    },
     getVname: function(vid) {
       const variant = this.st.variants.find(v => v.id == vid);
       // this.st.variants might be uninitialized (variant == null)
@@ -353,7 +361,7 @@ export default {
         {
           // Receive game from some player (+sid)
           // NOTE: it may be correspondance (if newgame while we are connected)
-          if (!this.games.some(g => g.id == data.game.id)) //ignore duplicates
+          if (this.games.every(g => g.id != data.game.id)) //ignore duplicates
           {
             let newGame = data.game;
             newGame.type = this.classifyObject(data.game);
@@ -625,6 +633,8 @@ export default {
 </script>
 
 <style lang="sass" scoped>
+.active
+  color: #42a983
 #newGame
   display: block
   margin: 10px auto 5px auto