From: Benjamin Auder Date: Fri, 7 Feb 2020 09:50:13 +0000 (+0100) Subject: Fixes about lastate X-Git-Url: https://git.auder.net/variants/Chakart/pieces/doc/%3C?a=commitdiff_plain;h=a0c41e7e23c9ff64031739e072f38e493bac8dca;p=vchess.git Fixes about lastate --- diff --git a/client/src/components/BaseGame.vue b/client/src/components/BaseGame.vue index 55ed249f..aa606aa5 100644 --- a/client/src/components/BaseGame.vue +++ b/client/src/components/BaseGame.vue @@ -81,7 +81,6 @@ export default { this.re_setVariables(); }, // Received a new move to play: - // TODO: error "flush nextTick callbacks" when observer reloads page "game.moveToPlay": function(newMove) { if (!!newMove) //if stop + launch new game, get undefined move this.play(newMove, "receive"); @@ -274,12 +273,18 @@ export default { }, animateMove: function(move, callback) { let startSquare = document.getElementById(getSquareId(move.start)); + // TODO: error "flush nextTick callbacks" when observer reloads page: + // this late check is not a fix! + if (!startSquare) + return; let endSquare = document.getElementById(getSquareId(move.end)); let rectStart = startSquare.getBoundingClientRect(); let rectEnd = endSquare.getBoundingClientRect(); let translation = {x:rectEnd.x-rectStart.x, y:rectEnd.y-rectStart.y}; let movingPiece = document.querySelector("#" + getSquareId(move.start) + " > img.piece"); + if (!movingPiece) //TODO: shouldn't happen + return; // HACK for animation (with positive translate, image slides "under background") // Possible improvement: just alter squares on the piece's way... const squares = document.getElementsByClassName("board"); diff --git a/client/src/views/Analyze.vue b/client/src/views/Analyze.vue index 9a6d0471..96ecdad9 100644 --- a/client/src/views/Analyze.vue +++ b/client/src/views/Analyze.vue @@ -36,33 +36,32 @@ export default { }; }, watch: { - "$route": function(to, from) { - this.gameRef.fen = to.query["fen"].replace(/_/g, " "); - this.gameRef.vname = to.params["vname"]; - this.loadGame(); - }, + // NOTE: no watcher for $route change, because if fenStart doesn't change + // then it doesn't trigger BaseGame.re_init() and the result is weird. "vr.movesCount": function(fen) { this.curFen = this.vr.getFen(); this.adjustFenSize(); }, }, created: function() { - this.gameRef.fen = this.$route.query["fen"].replace(/_/g, " "); this.gameRef.vname = this.$route.params["vname"]; - if (this.gameRef.vname != "Dark") - this.initialize(this.loadGame); - else + if (this.gameRef.vname == "Dark") { alert(this.st.tr["Analyze in Dark mode makes no sense!"]); history.back(); //or this.$router.go(-1) } + else + { + this.gameRef.fen = this.$route.query["fen"].replace(/_/g, " "); + this.initialize(); + } }, methods: { - initialize: async function(callback) { + initialize: async function() { // Obtain VariantRules object const vModule = await import("@/variants/" + this.gameRef.vname + ".js"); window.V = vModule.VariantRules; - callback(); + this.loadGame(); }, loadGame: function() { // NOTE: no need to set score (~unused) diff --git a/client/src/views/Game.vue b/client/src/views/Game.vue index ee151f3d..35cec3a8 100644 --- a/client/src/views/Game.vue +++ b/client/src/views/Game.vue @@ -59,7 +59,10 @@ export default { id: "", rid: "" }, - game: {players:[{name:""},{name:""}]}, //passed to BaseGame + game: { //passed to BaseGame + players:[{name:""},{name:""}], + rendered: false, + }, virtualClocks: [0, 0], //initialized with true game.clocks vr: null, //"variant rules" object initialized from FEN drawOffer: "", @@ -191,31 +194,39 @@ export default { } case "identity": { - // NOTE: sometimes player.id fails because player is undefined... - // Probably because the event was meant for Hall? - if (!this.people[data.user.sid]) - return; this.$set(this.people, data.user.sid, {id: data.user.id, name: data.user.name}); - // Sending last state only for live games: corr games are complete, - // only if I played a move (otherwise opponent has all) - if (!!this.game.mycolor && this.game.type == "live" - && this.game.oppsid == data.user.sid - && this.game.moves.length > 0 && this.vr.turn != this.game.mycolor) + // Ask potentially missed last state, if opponent and I play + if (!!this.game.mycolor + && this.game.type == "live" && this.game.score == "*" + && this.game.players.some(p => p.sid == data.user.sid)) + { + this.st.conn.send(JSON.stringify({code:"asklastate", target:data.user.sid})); + } + break; + } + case "asklastate": + { + // Sending last state if I played a move or score != "*" + if ((this.game.moves.length > 0 && this.vr.turn != this.game.mycolor) + || this.game.score != "*") { // Send our "last state" informations to opponent const L = this.game.moves.length; + const myIdx = ["w","b"].indexOf(this.game.mycolor); this.st.conn.send(JSON.stringify({ code: "lastate", - target: data.user.sid, + target: data.from, state: { - lastMove: this.game.moves[L-1], - // Since we played a move, only drawOffer=="sent" is possible + // NOTE: lastMove (when defined) includes addTime + lastMove: (L>0 ? this.game.moves[L-1] : undefined), + // Since we played a move (or abort or resign), + // only drawOffer=="sent" is possible drawSent: this.drawOffer == "sent", score: this.game.score, movesCount: L, - clocks: this.game.clocks, + initime: this.game.initime[1-myIdx], //relevant only if I played } })); } @@ -252,8 +263,8 @@ export default { break; case "lastate": //got opponent infos about last move { - this.lastate = data; - if (!!this.game.type) //game is loaded + this.lastate = data.state; + if (this.game.rendered) //game is rendered (Board component) this.processLastate(); //else: will be processed when game is ready break; @@ -281,12 +292,8 @@ export default { break; case "connect": { - // TODO: next condition is probably not required. See note line 150 - if (!this.people[data.from]) - { - this.$set(this.people, data.from, {name:"", id:0}); - this.st.conn.send(JSON.stringify({code:"askidentity", target:data.from})); - } + this.$set(this.people, data.from, {name:"", id:0}); + this.st.conn.send(JSON.stringify({code:"askidentity", target:data.from})); break; } case "disconnect": @@ -302,12 +309,16 @@ export default { if (data.movesCount > L) { // Just got last move from him - if (data.score != "*" && this.game.score == "*") - this.gameOver(data.score); - this.game.clocks = data.clocks; //TODO: check this? + const myIdx = ["w","b"].indexOf(this.game.mycolor); if (!!data.drawSent) this.drawOffer = "received"; - this.$set(this.game, "moveToPlay", data.lastMove); + this.$set(this.game, "moveToPlay", Object.assign({}, data.lastMove, {initime: data.initime})); + } + if (data.score != "*") + { + this.drawOffer = ""; + if (this.game.score == "*") + this.gameOver(data.score); } }, clickDraw: function() { @@ -476,6 +487,12 @@ export default { oppid: (myIdx < 0 ? undefined : game.players[1-myIdx].uid), } ); + this.$nextTick(() => { + this.game.rendered = true; + // Did lastate arrive before game was rendered? + if (!!this.lastate) + this.processLastate(); + }); this.repeat = {}; //reset: scan past moves' FEN: let repIdx = 0; // NOTE: vr_tmp to obtain FEN strings is redundant with BaseGame @@ -492,8 +509,6 @@ export default { }); if (this.repeat[repIdx] >= 3) this.drawOffer = "threerep"; - if (!!this.lastate) //lastate arrived before game was loaded: - this.processLastate(); callback(); }; if (!!game) @@ -514,6 +529,7 @@ export default { processMove: function(move) { // Update storage (corr or live) if I play in the game const colorIdx = ["w","b"].indexOf(move.color); + const nextIdx = ["w","b"].indexOf(this.vr.turn); // https://stackoverflow.com/a/38750895 if (!!this.game.mycolor) { @@ -550,15 +566,17 @@ export default { })); } }); + // (Add)Time indication: useful in case of lastate infos requested + move.addTime = addTime; } else addTime = move.addTime; //supposed transmitted - const nextIdx = ["w","b"].indexOf(this.vr.turn); // Update current game object: this.game.moves.push(move); this.game.fen = move.fen; this.$set(this.game.clocks, colorIdx, this.game.clocks[colorIdx] + addTime); - this.game.initime[nextIdx] = Date.now(); + // move.initime is set only when I receive a "lastate" move from opponent + this.game.initime[nextIdx] = move.initime || Date.now(); // If repetition detected, consider that a draw offer was received: const fenObj = V.ParseFen(move.fen); let repIdx = fenObj.position + "_" + fenObj.turn; @@ -597,7 +615,7 @@ export default { move: { squares: filtered_move, - played: Date.now(), //TODO: on server? + played: Date.now(), idx: this.game.moves.length - 1, }, drawOffer: drawCode, diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue index db8f528b..38ec2b30 100644 --- a/client/src/views/Hall.vue +++ b/client/src/views/Hall.vue @@ -483,12 +483,12 @@ export default { challOrWatch: function(sid, e) { switch (e.target.innerHTML) { - case "Challenge": + case "Available": this.tryChallenge(sid); break; case "Playing": this.showGame(this.games.find( - g => g.type=="live" && g.players.some(pl => pl.sid == sid))); + g => g.players.some(pl => pl.sid == sid || pl.uid == this.people[sid].id))); break; }; }, diff --git a/server/sockets.js b/server/sockets.js index 75aeadd3..fcaab83c 100644 --- a/server/sockets.js +++ b/server/sockets.js @@ -1,6 +1,7 @@ const url = require('url'); // Node version in Ubuntu 16.04 does not know about URL class +// NOTE: url is already transformed, without ?xxx=yyy... parts function getJsonFromUrl(url) { const query = url.substr(2); //starts with "/?" @@ -18,7 +19,14 @@ module.exports = function(wss) { const query = getJsonFromUrl(req.url); const sid = query["sid"]; if (!!clients[sid]) - return socket.send(JSON.stringify({code:"duplicate"})); + { + // Dummy messages listener: just send "duplicate" event on anything + // ('connect' events for Hall and Game, 'askfullgame' for observers) + return socket.on("message", objtxt => { + if (["connect","askfullgame"].includes(JSON.parse(objtxt).code)) + socket.send(JSON.stringify({code:"duplicate"})); + }); + } clients[sid] = {sock: socket, page: query["page"]}; const notifyRoom = (page,code,obj={},excluded=[]) => { Object.keys(clients).forEach(k => { @@ -65,11 +73,13 @@ module.exports = function(wss) { break; case "pagechange": // page change clients[sid].page --> obj.page + // TODO: some offline rooms don't need to receive disconnect event notifyRoom(clients[sid].page, "disconnect"); if (clients[sid].page.indexOf("/game/") >= 0) notifyRoom("/", "gdisconnect"); clients[sid].page = obj.page; - notifyRoom(obj.page, "connect"); + // No need to notify connection: it's self-sent in .vue file + //notifyRoom(obj.page, "connect"); if (obj.page.indexOf("/game/") >= 0) notifyRoom("/", "gconnect"); break; @@ -77,6 +87,10 @@ module.exports = function(wss) { clients[obj.target].sock.send(JSON.stringify( {code:"askidentity",from:sid})); break; + case "asklastate": + clients[obj.target].sock.send(JSON.stringify( + {code:"asklastate",from:sid})); + break; case "askchallenge": clients[obj.target].sock.send(JSON.stringify( {code:"askchallenge",from:sid}));