From ed06d9e92387e60fc15d7c9768dd5680605e35d1 Mon Sep 17 00:00:00 2001 From: Benjamin Auder Date: Tue, 4 Feb 2020 09:58:45 +0100 Subject: [PATCH] 'update' --- client/src/components/BaseGame.vue | 5 +- client/src/views/Game.vue | 23 ++++-- client/src/views/Hall.vue | 112 ++++++++++++++--------------- 3 files changed, 78 insertions(+), 62 deletions(-) diff --git a/client/src/components/BaseGame.vue b/client/src/components/BaseGame.vue index 6faa1b60..d035e009 100644 --- a/client/src/components/BaseGame.vue +++ b/client/src/components/BaseGame.vue @@ -20,7 +20,7 @@ div#baseGame(tabindex=-1 @click="() => focusBg()" button(@click="() => play()") > button(@click="gotoEnd") >> #pgnDiv - div(v-if="game.vname!='Dark' || game.score!='*'") + #downloadDiv(v-if="game.vname!='Dark' || game.score!='*'") a#download(href="#") button(@click="download") {{ st.tr["Download PGN"] }} button(v-if="game.vname!='Dark' && game.mode!='analyze'" @@ -394,6 +394,9 @@ console.log(newMove); margin-left: auto margin-right: auto +#downloadDiv + display: inline-block + #modal-eog+div .card overflow: hidden #controls diff --git a/client/src/views/Game.vue b/client/src/views/Game.vue index edaca5c1..e77492f0 100644 --- a/client/src/views/Game.vue +++ b/client/src/views/Game.vue @@ -5,6 +5,12 @@ main aria-labelledby="inputChat") #chat.card label.modal-close(for="modalChat") + #participants + span {{ Object.keys(people).length }} participant(s): + span(v-for="p in Object.values(people)" v-if="!!p.name") + | {{ p.name }} + span.anonymous(v-if="Object.values(people).some(p => !p.name)") + | + @nonymous Chat(:players="game.players" :pastChats="game.chats" @newchat-sent="finishSendChat" @newchat-received="processChat") .row @@ -159,8 +165,6 @@ export default { case "pollclients": { data.sockIds.forEach(sid => { - // TODO: understand clearly what happens here, problems when a - // game is quit, and then launch a new game from hall. if (!!this.people[sid]) return; this.$set(this.people, sid, {id:0, name:""}); @@ -552,7 +556,11 @@ export default { this.drawOffer = "threerep"; }, toggleChat: function() { - document.getElementById("chatBtn").style.backgroundColor = "#e2e2e2"; + let modalChat = document.getElementById("modalChat"); + modalChat.style.backgroundColor = + (modalChat.style.backgroundColor == "#e2e2e2" + ? "#c5fefe" + : "#e2e2e2"); }, finishSendChat: function(chat) { // NOTE: anonymous chats in corr games are not stored on server (TODO?) @@ -560,7 +568,7 @@ export default { GameStorage.update(this.gameRef.id, {chat: chat}); }, processChat: function() { - if (!document.getElementById("inputChat").checked) + if (!document.getElementById("modalChat").checked) document.getElementById("chatBtn").style.backgroundColor = "#c5fefe"; }, gameOver: function(score, scoreMsg) { @@ -583,6 +591,13 @@ export default { .connected background-color: lightgreen +#participants + margin-left: 5px + +.anonymous + color: grey + font-style: italic + @media screen and (min-width: 768px) #actions width: 300px diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue index f165b0a9..ee7e01b5 100644 --- a/client/src/views/Hall.vue +++ b/client/src/views/Hall.vue @@ -31,42 +31,40 @@ main 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 - div - .button-group - 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") - div - .button-group - 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}") - | {{ (p.name || '@nonymous') + (!!p.count ? " ("+p.count+")" : "") }} - button.player-action(v-if="!p.count && p.name != st.user.name" - @click="challOrWatch(p,$event)") - | {{ whatPlayerDoes(p) }} - #chat(v-show="pdisplay=='chat'") - Chat(:players="[]") - div - .button-group - 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')" - @show-game="showGame") + div + .button-group + 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") + #people + h3.text-center Who's there? + #players + p(v-for="p in Object.values(people)" v-if="!!p.name") + span {{ p.name }} + button.player-action( + v-if="p.name != st.user.name" + @click="challOrWatch(p,$event)" + ) + | {{ whatPlayerDoes(p) }} + p.anonymous @nonymous ({{ anonymousCount }}) + #chat + Chat(:players="[]") + .clearer + div + .button-group + 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')" + @show-game="showGame")