X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FGame.vue;h=2ef43c36f6afb8a423b316710f64e0a470b7fde1;hb=6dd02928259482332d639bb71d2c44ff684fcfb5;hp=44341a8e8e06a806992bf9bbe7e98c803be8260d;hpb=46284a2f440304a82210a2ddb2c05c43ff92e651;p=vchess.git diff --git a/client/src/views/Game.vue b/client/src/views/Game.vue index 44341a8e..2ef43c36 100644 --- a/client/src/views/Game.vue +++ b/client/src/views/Game.vue @@ -16,14 +16,12 @@ pareil quand quelqu'un reco. @@ -33,6 +31,7 @@ import BaseGame from "@/components/BaseGame.vue"; //import Chat from "@/components/Chat.vue"; //import MoveList from "@/components/MoveList.vue"; import { store } from "@/store"; +import { GameStorage } from "@/utils/storage"; export default { name: 'my-game', @@ -40,34 +39,24 @@ export default { BaseGame, }, // gameRef: to find the game in (potentially remote) storage - // mode: "live" or "corr" (correspondance game), or "analyze" data: function() { return { st: store.state, - // variables passed to BaseGame: - fenStart: "", - vr: null, - players: ["Myself","Computer"], //always playing white for now - mycolor: "w", - //////////// - gameRef: {id: "", rid: ""}, //given in URL (rid = remote ID, if applicable) - mode: "live", //or "corr" - vname: "", //filled when game is retrieved - drawOfferSent: false, //did I just ask for draw? - players: [], //filled later (2 to 4 players) - people: [], //potential observers + gameRef: {id: "", rid: ""}, //given in URL (rid = remote ID) + game: {}, //passed to BaseGame + vr: null, //"variant rules" object initialized from FEN + drawOfferSent: false, //did I just ask for draw? (TODO: draw variables?) + people: [], //potential observers (TODO) }; }, - computed: { - analyze: function() { - return this.mode == "analyze"; - }, - }, watch: { '$route' (to, from) { - this.gameRef.id = to.params["id"]; - this.gameRef.rid = to.query["rid"]; - this.launchGame(); + if (!!to.params["id"]) + { + this.gameRef.id = to.params["id"]; + this.gameRef.rid = to.query["rid"]; + this.loadGame(); + } }, }, created: function() { @@ -75,20 +64,22 @@ export default { { this.gameRef.id = this.$route.params["id"]; this.gameRef.rid = this.$route.query["rid"]; - this.launchGame(); - } - // Poll all players except me (if I'm playing) to know online status. - // --> Send ping to server (answer pong if players[s] are connected) - if (!!this.gameRef.id) - { - this.players.forEach(p => { - if (p.sid != this.st.user.sid) - this.st.conn.send(JSON.stringify({code:"ping", oppid:p.sid})); - }); + this.loadGame(); } // TODO: how to know who is observing ? Send message to everyone with game ID ? // and then just listen to (dis)connect events + + // server always send "connect on " + URL ; then add to observers if game... + // detect multiple tabs connected (when connect ask server if my SID is already in use) +// router when access a game page tell to server I joined + game ID (no need rid) +// and ask server for current joined (= observers) +// when send to chat (or a move), reach only this group (send gid along) + + // --> doivent être enregistrés comme observers au niveau du serveur... + // non: poll users + events startObserving / stopObserving + + // TODO: also handle "draw accepted" (use opponents array?) // --> must give this info also when sending lastState... // and, if all players agree then OK draw (end game ...etc) @@ -100,8 +91,8 @@ export default { case "newmove": // TODO: observer on dark games must see all board ? Or alternate ? (seems better) // ...or just see nothing as on buho21 - this.$refs["baseGame"].play( - data.move, this.vname!="Dark" ? "animate" : null); + this.$refs["basegame"].play( + data.move, this.game.vname!="Dark" ? "animate" : null); break; case "pong": //received if we sent a ping (game still alive on our side) if (this.gameRef.id != data.gameId) @@ -236,29 +227,33 @@ export default { } this.endGame(this.mycolor=="w"?"0-1":"1-0"); }, - // TODO: vname is unknown before game is loaded (vname is a field in memory) - launchGame: async function() { - const vModule = await import("@/variants/" + this.vname + ".js"); - window.V = vModule.VariantRules; - this.loadGame(this.gid); - }, - loadGame: function(gid) { - // TODO: ask game to remote peer if this.remoteId is set - // (or just if game not found locally) - // NOTE: if it's a corr game, ask it from server - const game = getGameFromStorage(gid); //, this.gameRef.uid); //uid may be blank - this.opponent.id = game.oppid; //opponent ID in case of running HH game - this.opponent.name = game.oppname; //maye be blank (if anonymous) - this.score = game.score; - this.mycolor = game.mycolor; - this.fenStart = game.fenStart; - this.moves = game.moves; - this.cursor = game.moves.length-1; - this.lastMove = (game.moves.length > 0 ? game.moves[this.cursor] : null); - // TODO: fill players array + // 4 cases for loading a game: + // - from localStorage (one running game I play) + // - from indexedDB (one completed live game) + // - from server (one correspondance game I play[ed] or not) + // - from remote peer (one live game I don't play, finished or not) + loadGame: function() { + GameStorage.get(this.gameRef, async (game) => { + this.game = game; + const vModule = await import("@/variants/" + game.vname + ".js"); + window.V = vModule.VariantRules; + this.vr = new V(game.fen); + }); +// // Poll all players except me (if I'm playing) to know online status. +// // --> Send ping to server (answer pong if players[s] are connected) +// if (this.gameInfo.players.some(p => p.sid == this.st.user.sid)) +// { +// this.game.players.forEach(p => { +// if (p.sid != this.st.user.sid) +// this.st.conn.send(JSON.stringify({code:"ping", oppid:p.sid})); +// }); +// } }, oppConnected: function(uid) { - return this.opponents.any(o => o.id == uidi && o.online); + return this.opponents.some(o => o.id == uid && o.online); + }, + processMove: function(move) { + // TODO: process some opponent's move }, }, };