// fen: to start from a FEN without identifiers (analyze mode)
// subMode: "auto" (game comp vs comp) or "corr" (correspondance game),
// or "examine" (after human game: TODO)
- props: ["conn","gameId","fen","mode","subMode","allowChat","allowMovelist",
- "queryHash","settings"],
+ props: ["conn","gameRef","fen","mode","subMode",
+ "allowChat","allowMovelist","settings"],
data: function() {
return {
// Web worker to play computer moves without freezing interface:
return this.$emit("computer-think");
this.newGameFromFen();
},
- gameId: function() {
- this.loadGame();
- },
- queryHash: function(newQhash) {
- // New query hash = "id=42"; get 42 as gameId
- this.gameId = parseInt(newQhash.substr(2));
+ gameRef: function() {
this.loadGame();
},
},
</div>
`,
created: function() {
- if (!!this.gameId)
+ if (!!this.gameRef)
this.loadGame();
else if (!!this.fen)
{
}
// TODO: if I'm one of the players in game, then:
// Send ping to server (answer pong if opponent is connected)
- if (true && !!this.conn)
+ if (true && !!this.conn && !!this.gameRef)
{
this.conn.onopen = () => {
this.conn.send(JSON.stringify({
- code:"ping",oppid:this.oppid,gameId:this.gameId}));
+ code:"ping",oppid:this.oppid,gameId:this.gameRef.id}));
};
}
// TODO: also handle "draw accepted" (use opponents array?)
this.play(data.move, variant.name!="Dark" ? "animate" : null);
break;
case "pong": //received if we sent a ping (game still alive on our side)
- if (this.gameId != data.gameId)
+ if (this.gameRef.id != data.gameId)
break; //games IDs don't match: definitely over...
this.oppConnected = true;
// Send our "last state" informations to opponent(s)
this.conn.send(JSON.stringify({
code: "lastate",
oppid: oid,
- gameId: this.gameId,
+ gameId: this.gameRef.id,
lastMove: (L>0?this.vr.moves[L-1]:undefined),
movesCount: L,
}));
// TODO: refactor this, because at 3 or 4 players we may have missed 2 or 3 moves (not just one)
case "lastate": //got opponent infos about last move
L = this.vr.moves.length;
- if (this.gameId != data.gameId)
+ if (this.gameRef.id != data.gameId)
break; //games IDs don't match: nothing we can do...
// OK, opponent still in game (which might be over)
if (this.score != "*")
this.conn.send(JSON.stringify({
code: "lastate",
oppid: data.oppid,
- gameId: this.gameId,
+ gameId: this.gameRef.id,
score: this.score,
}));
}
this.conn.send(JSON.stringify({
code: "lastate",
oppid: this.opponent.id,
- gameId: this.gameId,
+ gameId: this.gameRef.id,
lastMove: this.vr.moves[L-1],
movesCount: L,
}));
// 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(this.gameId);
+ const game = getGameFromStorage(this.gameRef.id, 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;
Vue.component('my-problems', {
- props: ["queryHash","settings"],
+ props: ["probId","settings"],
data: function () {
return {
userId: user.id,
curProb: null, //(reference to) current displayed problem (if any)
showSolution: false,
nomoreMessage: "",
+ mode: "analyze", //for game component
pbNum: 0, //to navigate directly to some problem
// New problem (to upload), or existing problem to edit:
modalProb: {
<div id="instructions-div" class="section-content">
<p id="problem-instructions">{{ curProb.instructions }}</p>
</div>
- <my-game :fen="curProb.fen" :mode="analyze" :allowMovelist="true"
- :settings="settings"
- >
+ <my-game :fen="curProb.fen" :mode="mode" :allowMovelist="true"
+ :settings="settings">
</my-game>
<div id="solution-div" class="section-content">
<h3 class="clickable" @click="showSolution = !showSolution">
- {{ translations["Show solution"] }}
+ {{ translate("Show solution") }}
</h3>
<p id="problem-solution" v-show="showSolution">{{ curProb.solution }}</p>
</div>
</div>
`,
watch: {
- queryHash: function(newQhash) {
- if (!!newQhash)
- {
- // New query hash = "id=42"; get 42 as problem ID
- const pid = parseInt(newQhash.substr(2));
- this.showProblem(pid);
- }
- else
- this.curProb = null; //(back to) list display
+ probId: function() {
+ this.showProblem(this.probId);
},
},
created: function() {
- if (!!this.queryHash)
- {
- const pid = parseInt(this.queryHash.substr(2));
- this.showProblem(pid);
- }
+ if (!!this.probId)
+ this.showProblem(this.probId);
else
this.firstFetch();
},
methods: {
+ translate: translate,
firstFetch: function() {
// Fetch most recent problems from server, for both lists
this.fetchProblems("others", "bacwkard");
const pIdx = parray.findIndex(p => p.id == pid);
if (pIdx >= 0)
{
- curProb = parray[pIdx];
+ this.curProb = parray[pIdx];
break;
}
}
- if (!curProb)
+ if (!this.curProb)
{
// Cannot find problem in current set; get from server, and add to singletons.
ajax(
- "/problems/" + variant.name + "/" + pid, //TODO: use variant._id ?
+ "/problems/" + variant.id + "/" + pid, //TODO: variant ID should not be required
"GET",
response => {
if (!!response.problem)
);
}
},
- translate: function(text) {
- return translations[text];
- },
curProblems: function() {
switch (this.display)
{
el: "#VueElement",
data: {
display: "", //default to main hall; see "created()" function
- gameid: undefined, //...yet
- queryHash: "",
+ gameRef: undefined, //...for now
+ probId: undefined,
conn: null,
mode: "analyze",
allowChat: false,
},
},
created: function() {
+ window.onhashchange = this.setDisplay;
if (!!localStorage["variant"])
- {
location.hash = "#game?id=" + localStorage["gameId"];
- this.display = location.hash.substr(1);
- }
else
this.setDisplay();
- window.onhashchange = this.setDisplay;
// Our ID, always set (DB id if registered, collision-free random string otherwise)
this.myid = user.id || localStorage["myid"] || "anon-" + getRandString();
this.conn = new WebSocket(socketUrl + "/?sid=" + this.myid + "&page=" + variant.id);
location.hash = "#room"; //default
const hashParts = location.hash.substr(1).split("?");
this.display = hashParts[0];
- this.queryHash = hashParts[1]; //may be empty, undefined...
+ if (hashParts[0] == "problems" && !!hashParts[1])
+ {
+ // Show a specific problem
+ this.probId = hashParts[1].split("=")[1];
+ }
+ else if (hashParts[0] == "game" && !!hashParts[1])
+ {
+ // Show a specific game, maybe with a user ID
+ const params = hashParts[1].split("&").filter(h => h.split("=")[1]);
+ // TODO: Vue.set(...) probably required here
+ this.gameRef = {
+ id: params[0],
+ uid: params[1], //may be undefined
+ };
+ }
// Close menu on small screens:
let menuToggle = document.getElementById("drawer-control");
if (!!menuToggle)
my-room(v-show="display=='room'" :conn="conn" :settings="settings")
my-tab-games(v-show="display=='tabGames'")
my-rules(v-show="display=='rules'" :settings="settings")
- my-problems(v-show="display=='problems'" :query-hash="queryHash"
- :settings="settings")
- my-game(v-show="display=='game'" :game-id="gameid" :conn="conn"
+ my-problems(v-show="display=='problems'" :prob-id="probId" :settings="settings")
+ my-game(v-show="display=='game'" :game-ref="gameRef" :conn="conn"
:allow-chat="allowChat" :allow-movelist="allowMovelist"
- :mode="mode" :query-hash="queryHash" :settings="settings"
- @game-over="archiveGame")
+ :mode="mode" :settings="settings" @game-over="archiveGame")
block javascripts
script(src="/javascripts/utils/array.js")
projects / vchess.git / commitdiff