X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FHall.vue;h=71d776406e4c0c7c8d50754ab42ca56a7db9d5ed;hb=107dc1bd5361e2538b1551bdcc37c1e90a444b83;hp=0ed355bf5cdae241da3c81b1d397c6c2081a6a14;hpb=bfa7d9931b50c1ed54ff3c6d4ef5bc423f26de94;p=vchess.git diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue index 0ed355bf..71d77640 100644 --- a/client/src/views/Hall.vue +++ b/client/src/views/Hall.vue @@ -99,7 +99,7 @@ main button(@click="issueNewChallenge()") {{ st.tr["Send challenge"] }} input#modalPeople.modal( type="checkbox" - @click="resetSocialColor()" + @click="toggleSocialColor()" ) div#peopleWrap( role="dialog" @@ -135,7 +135,7 @@ main .row .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2 .button-group - button#peopleBtn(@click="openModalPeople()") + button#peopleBtn(onClick="window.doClick('modalPeople')") | {{ st.tr["Who's there?"] }} button(@click="showNewchallengeForm()") | {{ st.tr["New game"] }} @@ -186,13 +186,13 @@ main GameList( v-show="gdisplay=='live'" :games="filterGames('live')" - :showBoth="true" + :show-both="true" @show-game="showGame" ) div(v-show="gdisplay=='corr'") GameList( :games="filterGames('corr')" - :showBoth="true" + :show-both="true" @show-game="showGame" ) button#loadMoreBtn( @@ -241,7 +241,9 @@ export default { vid: parseInt(localStorage.getItem("vid")) || 0, to: "", //name of challenged player (if any) cadence: localStorage.getItem("cadence") || "", - randomness: parseInt(localStorage.getItem("challRandomness")) || 2, + randomness: + // Warning: randomness can be 0, then !!randomness is false + (parseInt(localStorage.getItem("challRandomness"))+1 || 3) - 1, // VariantRules object, stored to not interfere with // diagrams of targetted challenges: V: null, @@ -257,8 +259,7 @@ export default { connexionString: "", socketCloseListener: 0, // Related to (killing of) self multi-connects: - newConnect: {}, - killed: {} + newConnect: {} }; }, watch: { @@ -323,7 +324,13 @@ export default { ); }, mounted: function() { - ["peopleWrap", "infoDiv", "newgameDiv"].forEach(eltName => { + document.getElementById("peopleWrap") + .addEventListener("click", (e) => { + processModalClick(e, () => { + this.toggleSocialColor("close") + }); + }); + ["infoDiv", "newgameDiv"].forEach(eltName => { document.getElementById(eltName) .addEventListener("click", processModalClick); }); @@ -424,10 +431,6 @@ export default { ["random-" + pc.randomness]: true }; }, - openModalPeople: function() { - window.doClick("modalPeople"); - document.getElementById("inputChat").focus(); - }, anonymousCount: function() { let count = 0; Object.values(this.people).forEach(p => { @@ -517,8 +520,10 @@ export default { filterGames: function(type) { return this.games.filter(g => g.type == type); }, + // o: challenge or game classifyObject: function(o) { - // o: challenge or game + // Consider imports as live games (TODO) + if (!!o.id && !!o.id.toString().match(/^i/)) return "live"; return o.cadence.indexOf("d") === -1 ? "live" : "corr"; }, setDisplay: function(letter, type, e) { @@ -567,18 +572,18 @@ export default { } }); const gid = gids[Math.floor(Math.random() * gids.length)]; - const game = this.games.find(g => g.id == gid); - if (!!game) this.showGame(game); - else this.$router.push("/game/" + gid); //game vs. me + window.open("/#/game/" + gid, "_blank"); }, showGame: function(g) { // NOTE: we are an observer, since only games I don't play are shown here // ==> Moves sent by connected remote player(s) if live game - this.$router.push("/game/" + g.id); + window.open("/#/game/" + g.id, "_blank"); }, - resetSocialColor: function() { - // TODO: this is called twice, once on opening an once on closing - document.getElementById("peopleBtn").classList.remove("somethingnew"); + toggleSocialColor: function(action) { + if (!action && document.getElementById("modalPeople").checked) + document.getElementById("inputChat").focus(); + else + document.getElementById("peopleBtn").classList.remove("somethingnew"); }, processChat: function(chat) { this.send("newchat", { data: chat }); @@ -638,13 +643,13 @@ export default { const page = data.page || "/"; if (data.code == "connect") { // Ask challenges only on first connexion: - if (!this.people[data.from]) + if (!this.people[data.from[0]]) this.send("askchallenges", { target: data.from[0] }); } // Ask game only if live: else if (!page.match(/\/[0-9]+$/)) this.send("askgame", { target: data.from[0], page: page }); - if (!this.people[data.from]) { + if (!this.people[data.from[0]]) { this.$set( this.people, data.from[0], @@ -654,7 +659,8 @@ export default { } } ); - this.newConnect[data.from] = true; //for self multi-connects tests + // For self multi-connects tests: + this.newConnect[data.from[0]] = true; this.send("askidentity", { target: data.from[0], page: page }); } else { this.people[data.from[0]].tmpIds[data.from[1]] = @@ -675,12 +681,19 @@ export default { this.$delete(this.people, data.from[0]); else this.$forceUpdate(); //TODO: shouldn't be required if (data.code == "disconnect") { - // Remove the live challenges sent by this player: - ArrayFun.remove( - this.challenges, - c => c.type == "live" && c.from.sid == data.from[0], - "all" - ); + // Remove the live challenges sent by this player, if + // he isn't connected on another tab: + if ( + !this.people[data.from[0]] || + Object.values(this.people[data.from[0]].tmpIds) + .every(v => v.page != "/") + ) { + ArrayFun.remove( + this.challenges, + c => c.type == "live" && c.from.sid == data.from[0], + "all" + ); + } } else { // Remove the matching live game if now unreachable const gid = data.page.match(/[a-zA-Z0-9]+$/)[0]; @@ -713,13 +726,6 @@ export default { } break; } - case "killed": - // I logged in elsewhere: - this.conn.removeEventListener("message", this.socketMessageListener); - this.conn.removeEventListener("close", this.socketCloseListener); - this.conn = null; - alert(this.st.tr["New connexion detected: tab now offline"]); - break; case "askidentity": { // Request for identification const me = { @@ -742,16 +748,16 @@ export default { this.$forceUpdate(); // If I multi-connect, kill current connexion if no mark (I'm older) if (this.newConnect[user.sid]) { + delete this.newConnect[user.sid]; if ( user.id > 0 && user.id == this.st.user.id && - user.sid != this.st.user.sid && - !this.killed[this.st.user.sid] + user.sid != this.st.user.sid ) { - this.send("killme", { sid: this.st.user.sid }); - this.killed[this.st.user.sid] = true; + // I logged in elsewhere: + this.cleanBeforeDestroy(); + alert(this.st.tr["New connexion detected: tab now offline"]); } - delete this.newConnect[user.sid]; } break; } @@ -814,9 +820,13 @@ export default { // Ignore games where I play (will go in MyGames page), // and also games that I already received. if ( - game.players.every(p => - p.sid != this.st.user.sid && p.id != this.st.user.id) && - this.games.findIndex(g => g.id == game.id) == -1 + this.games.findIndex(g => g.id == game.id) == -1 && + game.players.every(p => { + return ( + p.sid != this.st.user.sid && + (p.id == 0 || p.id != this.st.user.id) + ); + }) ) { let newGame = game; newGame.type = this.classifyObject(game); @@ -826,6 +836,7 @@ export default { newGame.score = "*"; this.games.push(newGame); if ( + newGame.score == '*' && (newGame.type == "live" && this.gdisplay == "corr") || (newGame.type == "corr" && this.gdisplay == "live") ) { @@ -877,7 +888,8 @@ export default { if ( this.cursor == Number.MAX_SAFE_INTEGER && this.games.length == 0 && - this.gdisplay == "live" + this.gdisplay == "live" && + res.games.some(g => g.score == '*') ) { // First loading: show indicators document @@ -1008,7 +1020,11 @@ export default { let chall = Object.assign({}, this.newchallenge); // Add only if not already issued (not counting target or FEN): if (this.challenges.some(c => - (c.from.sid == this.st.user.sid || c.from.id == this.st.user.id) && + ( + c.from.sid == this.st.user.sid || + (c.from.id > 0 && c.from.id == this.st.user.id) + ) + && c.vid == chall.vid && c.cadence == chall.cadence && c.randomness == chall.randomness @@ -1030,7 +1046,10 @@ export default { const c = this.challenges[i]; if ( c.type == ctype && - (c.from.sid == this.st.user.sid || c.from.id == this.st.user.id) + ( + c.from.sid == this.st.user.sid || + (c.from.id > 0 && c.from.id == this.st.user.id) + ) ) { countMyChalls++; if (c.added < oldestAdded) { @@ -1183,10 +1202,13 @@ export default { // NOTE: when launching game, the challenge is already being deleted launchGame: function(c) { // White player index 0, black player index 1: - const players = + let players = !!c.mycolor ? (c.mycolor == "w" ? [c.seat, c.from] : [c.from, c.seat]) : shuffle([c.from, c.seat]); + players.forEach(p => { + if (!!p["tmpIds"]) delete p["tmpIds"]; + }); // These game informations will be shared let gameInfo = { id: getRandString(), @@ -1278,7 +1300,8 @@ export default { { body: "vs " + game.players[1-myIdx].name || "@nonymous" } ); } - this.$router.push("/game/" + gameInfo.id); + this.$router.push( + "/game/" + gameInfo.id + "/?focus=" + this.focus); }); }, this.focus ? 500 + 1000 * Math.random() : 0 @@ -1290,7 +1313,7 @@ export default {