X-Git-Url: https://git.auder.net/?a=blobdiff_plain;f=client%2Fsrc%2Fviews%2FHall.vue;h=ac2e26ecf8c8f6e68f13ca9ae28703b4f7e639f0;hb=584f81b93154313a3856112400b7df98e0eb2632;hp=271c0bcf6b22b839427020496674a511d3904f4e;hpb=a041d5d84031f29fc001597a9ac958d6a3e6de76;p=vchess.git diff --git a/client/src/views/Hall.vue b/client/src/views/Hall.vue index 271c0bcf..ac2e26ec 100644 --- a/client/src/views/Hall.vue +++ b/client/src/views/Hall.vue @@ -15,8 +15,11 @@ main span.variantName {{ curChallToAccept.vname }} span {{ curChallToAccept.cadence }} span {{ st.tr["with"] + " " + curChallToAccept.from.name }} - .diagram(v-html="tchallDiag") - .button-group#buttonsTchall + .diagram( + v-if="!!curChallToAccept.fen" + v-html="tchallDiag" + ) + .button-group#buttonsTchall(:style="tchallButtonsMargin()") button.acceptBtn(@click="decisionChallenge(true)") span {{ st.tr["Accept challenge?"] }} button.refuseBtn(@click="decisionChallenge(false)") @@ -117,7 +120,7 @@ main .button-group button#peopleBtn(onClick="window.doClick('modalPeople')") | {{ st.tr["Who's there?"] }} - button(onClick="window.doClick('modalNewgame')") + button(@click="showNewchallengeForm()") | {{ st.tr["New game"] }} .row .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2 @@ -363,7 +366,20 @@ export default { : "losefocus" ); }, - // Helpers: + partialResetNewchallenge: function() { + // Reset potential target and custom FEN: + this.newchallenge.to = ""; + this.newchallenge.fen = ""; + this.newchallenge.diag = ""; + }, + showNewchallengeForm: function() { + this.partialResetNewchallenge(); + window.doClick("modalNewgame"); + }, + tchallButtonsMargin: function() { + if (!!this.curChallToAccept.fen) return { "margin-top": "10px" }; + return {}; + }, cadenceFocusIfOpened: function() { if (event.target.checked) document.getElementById("cadence").focus(); @@ -416,7 +432,8 @@ export default { ); }, challenge: function(sid) { - // Available, in Hall (only) + this.partialResetNewchallenge(); + // Available, in Hall this.newchallenge.to = this.people[sid].name; document.getElementById("modalPeople").checked = false; window.doClick("modalNewgame"); @@ -665,11 +682,10 @@ export default { } case "game": //individual request case "newgame": { - // NOTE: it may be live or correspondance const game = data.data; - // Ignore games where I play (corr games) + // Ignore games where I play (will go in MyGames page) if (game.players.every(p => - p.sid != this.st.user.sid || p.id != this.st.user.id)) + p.sid != this.st.user.sid || p.uid != this.st.user.id)) { let locGame = this.games.find(g => g.id == game.id); if (!locGame) { @@ -703,7 +719,7 @@ export default { break; } case "startgame": { - // New game just started: data contain all information + // New game just started, I'm involved const gameInfo = data.data; if (this.classifyObject(gameInfo) == "live") this.startNewGame(gameInfo); @@ -716,8 +732,7 @@ export default { "#/game/" + gameInfo.id + ""; - let modalBox = document.getElementById("modalInfo"); - modalBox.checked = true; + document.getElementById("modalInfo").checked = true; } break; } @@ -911,17 +926,11 @@ export default { position: parsedFen.position, orientation: c.mycolor }); - this.curChallToAccept = c; - document.getElementById("modalAccept").checked = true; - } - else { - if (!confirm(this.st.tr["Accept challenge?"])) - c.accepted = false; - this.finishProcessingChallenge(c); } + this.curChallToAccept = c; + document.getElementById("modalAccept").checked = true; } - else - this.finishProcessingChallenge(c); + else this.finishProcessingChallenge(c); } else { // My challenge @@ -939,6 +948,16 @@ export default { }, // NOTE: when launching game, the challenge is already being deleted launchGame: function(c) { + let players = + !!c.mycolor + ? (c.mycolor == "w" ? [c.seat, c.from] : [c.from, c.seat]) + : shuffle([c.from, c.seat]); + // Convention for players IDs in stored games is 'uid' + players.forEach(p => { + let pWithUid = p; + pWithUid["uid"] = p.id; + delete pWithUid["id"]; + }); // These game informations will be shared let gameInfo = { id: getRandString(), @@ -953,16 +972,17 @@ export default { const notifyNewgame = () => { const oppsid = this.getOppsid(c); if (!!oppsid) - //opponent is online + // Opponent is online this.send("startgame", { data: gameInfo, target: oppsid }); - // Send game info (only if live) to everyone except me in this tab - this.send("newgame", { data: gameInfo }); + // Send game info (only if live) to everyone except me and opponent + // TODO: this double message send could be avoided. + this.send("newgame", { data: gameInfo, oppsid: oppsid }); }; if (c.type == "live") { notifyNewgame(); this.startNewGame(gameInfo); - } //corr: game only on server - else { + } else { + // corr: game only on server ajax( "/games", "POST", @@ -980,25 +1000,36 @@ export default { }, // NOTE: for live games only (corr games start on the server) startNewGame: function(gameInfo) { - const game = Object.assign({}, gameInfo, { - // (other) Game infos: constant - fenStart: gameInfo.fen, - vname: this.getVname(gameInfo.vid), - created: Date.now(), - // Game state (including FEN): will be updated - moves: [], - clocks: [-1, -1], //-1 = unstarted - initime: [0, 0], //initialized later - score: "*" - }); - GameStorage.add(game, (err) => { - // If an error occurred, game is not added: abort - if (!err) { - if (this.st.settings.sound) - new Audio("/sounds/newgame.flac").play().catch(() => {}); - this.$router.push("/game/" + gameInfo.id); + const game = Object.assign( + {}, + gameInfo, + { + // (other) Game infos: constant + fenStart: gameInfo.fen, + vname: this.getVname(gameInfo.vid), + created: Date.now(), + // Game state (including FEN): will be updated + moves: [], + clocks: [-1, -1], //-1 = unstarted + initime: [0, 0], //initialized later + score: "*" } - }); + ); + setTimeout( + () => { + GameStorage.add(game, (err) => { + // If an error occurred, game is not added: a tab already + // added the game and (if focused) is redirected toward it. + // If no error and the tab is hidden: do not show anything. + if (!err && !document.hidden) { + if (this.st.settings.sound) + new Audio("/sounds/newgame.flac").play().catch(() => {}); + this.$router.push("/game/" + gameInfo.id); + } + }); + }, + document.hidden ? 500 + 1000 * Math.random() : 0 + ); } } }; @@ -1071,7 +1102,7 @@ button.refuseBtn background-color: red #buttonsTchall - margin-top: 10px + // margin-top set dynamically (depends if diagram showed or not) & > button > span width: 100% text-align: center