"tooltip": true,
"play": true,
"seek": this.seek,
- "playing": this.mode == "human",
+ "playing": this.mode == "human" && this.score == "*",
},
},
[h('i', { 'class': { "material-icons": true } }, "accessibility")])
);
- if (variant != "Dark" &&
- (["idle","computer","friend"].includes(this.mode)
- || ["friend","human"].includes(this.mode) && this.score != "*"))
+ if (["idle","computer","friend"].includes(this.mode)
+ || (this.mode == "human" && this.score != "*"))
{
actionArray.push(
h('button',
'class': {
"tooltip":true,
"play": true,
- "playing": this.mode == "computer",
+ "playing": this.mode == "computer" && this.score == "*",
"spaceleft": true,
},
},
[h('i', { 'class': { "material-icons": true } }, "computer")])
);
}
- if (variant != "Dark" &&
- (["idle","friend"].includes(this.mode)
- || ["computer","human"].includes(this.mode) && this.score != "*"))
+ if (variant != "Dark" && (["idle","friend"].includes(this.mode)
+ || (["computer","human"].includes(this.mode) && this.score != "*")))
{
actionArray.push(
h('button',
}
);
aboveBoardElts.push(turnIndic);
- const settingsBtn = h(
- 'button',
- {
- on: { click: this.showSettings },
- attrs: {
- "aria-label": translations['Settings'],
- "id": "settingsBtn",
- },
- 'class': {
- "tooltip": true,
- "play": true,
- "above-board": true,
- "indic-right": true,
- },
- },
- [h('i', { 'class': { "material-icons": true } }, "settings")]
- );
- aboveBoardElts.push(settingsBtn);
elementArray.push(
h('div',
{ "class": { "aboveboard-wrapper": true } },
{
myReservePiecesArray.push(h('div',
{
- 'class': {'board':true, ['board'+sizeY+'-reserve']:true},
+ 'class': {'board':true, ['board'+sizeY]:true},
attrs: { id: this.getSquareId({x:sizeX+shiftIdx,y:i}) }
},
[
{
oppReservePiecesArray.push(h('div',
{
- 'class': {'board':true, ['board'+sizeY+'-reserve']:true},
+ 'class': {'board':true, ['board'+sizeY]:true},
attrs: { id: this.getSquareId({x:sizeX+(1-shiftIdx),y:i}) }
},
[
)
];
elementArray = elementArray.concat(modalFenEdit);
- const modalSettings = [
- h('input',
- {
- attrs: { "id": "modal-settings", type: "checkbox" },
- "class": { "modal": true },
- }),
- h('div',
- {
- attrs: { "role": "dialog", "aria-labelledby": "settingsTitle" },
- },
- [
- h('div',
- {
- "class": { "card": true, "smallpad": true },
- },
- [
- h('label',
- {
- attrs: { "id": "close-settings", "for": "modal-settings" },
- "class": { "modal-close": true },
- }
- ),
- h('h3',
- {
- attrs: { "id": "settingsTitle" },
- "class": { "section": true },
- domProps: { innerHTML: translations["Preferences"] },
- }
- ),
- h('fieldset',
- { },
- [
- h('label',
- {
- attrs: { for: "nameSetter" },
- domProps: { innerHTML: translations["My name is..."] },
- },
- ),
- h('input',
- {
- attrs: {
- "id": "nameSetter",
- type: "text",
- value: this.myname,
- },
- on: { "change": this.setMyname },
- }
- ),
- ]
- ),
- h('fieldset',
- { },
- [
- h('label',
- {
- attrs: { for: "setHints" },
- domProps: { innerHTML: translations["Show hints?"] },
- },
- ),
- h('input',
- {
- attrs: {
- "id": "setHints",
- type: "checkbox",
- checked: this.hints,
- },
- on: { "change": this.toggleHints },
- }
- ),
- ]
- ),
- h('fieldset',
- { },
- [
- h('label',
- {
- attrs: { for: "selectColor" },
- domProps: { innerHTML: translations["Board colors"] },
- },
- ),
- h("select",
- {
- attrs: { "id": "selectColor" },
- on: { "change": this.setBoardColor },
- },
- [
- h("option",
- {
- domProps: {
- "value": "lichess",
- innerHTML: translations["brown"]
- },
- attrs: { "selected": this.color=="lichess" },
- }
- ),
- h("option",
- {
- domProps: {
- "value": "chesscom",
- innerHTML: translations["green"]
- },
- attrs: { "selected": this.color=="chesscom" },
- }
- ),
- h("option",
- {
- domProps: {
- "value": "chesstempo",
- innerHTML: translations["blue"]
- },
- attrs: { "selected": this.color=="chesstempo" },
- }
- ),
- ],
- ),
- ]
- ),
- h('fieldset',
- { },
- [
- h('label',
- {
- attrs: { for: "selectSound" },
- domProps: { innerHTML: translations["Play sounds?"] },
- },
- ),
- h("select",
- {
- attrs: { "id": "selectSound" },
- on: { "change": this.setSound },
- },
- [
- h("option",
- {
- domProps: {
- "value": "0",
- innerHTML: translations["None"]
- },
- attrs: { "selected": this.sound==0 },
- }
- ),
- h("option",
- {
- domProps: {
- "value": "1",
- innerHTML: translations["New game"]
- },
- attrs: { "selected": this.sound==1 },
- }
- ),
- h("option",
- {
- domProps: {
- "value": "2",
- innerHTML: translations["All"]
- },
- attrs: { "selected": this.sound==2 },
- }
- ),
- ],
- ),
- ]
- ),
- ]
- )
- ]
- )
- ];
- elementArray = elementArray.concat(modalSettings);
let chatEltsArray =
[
h('label',
actionArray
);
elementArray.push(actions);
- if (this.score != "*" && this.pgnTxt.length > 0)
- {
- elementArray.push(
- h('div',
- {
- attrs: { id: "pgn-div" },
- "class": { "section-content": true },
- },
- [
- h('a',
- {
- attrs: {
- id: "download",
- href: "#",
- }
- }
- ),
- h('p',
- {
- attrs: { id: "pgn-game" },
- domProps: { innerHTML: this.pgnTxt }
- }
- ),
- h('button',
- {
- attrs: { "id": "downloadBtn" },
- on: { click: this.download },
- domProps: { innerHTML: translations["Download game"] },
- }
- ),
- ]
- )
- );
- }
- else if (this.mode != "idle")
+ if (!!this.vr)
{
if (this.mode == "problem")
{
)
);
}
+ elementArray.push(
+ h('div',
+ {
+ attrs: { id: "pgn-div" },
+ "class": { "section-content": true },
+ },
+ [
+ h('a',
+ {
+ attrs: {
+ id: "download",
+ href: "#",
+ }
+ }
+ ),
+ h('button',
+ {
+ attrs: { "id": "downloadBtn" },
+ on: { click: this.download },
+ domProps: { innerHTML: translations["Download PGN"] },
+ }
+ ),
+ ]
+ )
+ );
}
return h(
'div',
};
const socketMessageListener = msg => {
const data = JSON.parse(msg.data);
- const L = (!!this.vr ? this.vr.moves.length : 0);
+ let L = undefined;
switch (data.code)
{
case "oppname":
break;
case "newgame": //opponent found
// oppid: opponent socket ID
- this.newGame("human", data.fen, data.color, data.oppid);
+ this.newGame("human", data.fen, data.color, data.oppid, data.gameid);
break;
case "newmove": //..he played!
this.play(data.move, (variant!="Dark" ? "animate" : null));
break; //games IDs don't match: definitely over...
this.oppConnected = true;
// Send our "last state" informations to opponent
+ L = this.vr.moves.length;
this.conn.send(JSON.stringify({
code: "lastate",
oppid: this.oppid,
}));
break;
case "lastate": //got opponent infos about last move
+ L = this.vr.moves.length;
if (this.gameId != data.gameId)
break; //games IDs don't match: nothing we can do...
// OK, opponent still in game (which might be over)
- if (this.mode != "human")
+ if (this.score != "*")
{
// We finished the game (any result possible)
this.conn.send(JSON.stringify({
this.conn.send(JSON.stringify({
code: "lastate",
oppid: this.oppid,
+ gameId: this.gameId,
lastMove: this.vr.moves[L-1],
movesCount: L,
}));
// before they appear on page:
const delay = Math.max(500-(Date.now()-self.timeStart), 0);
setTimeout(() => {
+ const animate = (variant!="Dark" ? "animate" : null);
if (self.mode == "computer") //warning: mode could have changed!
- self.play(compMove[0], "animate");
+ self.play(compMove[0], animate);
if (compMove.length == 2)
setTimeout( () => {
if (self.mode == "computer")
- self.play(compMove[1], "animate");
+ self.play(compMove[1], animate);
}, 750);
}, delay);
}
: "none";
},
download: function() {
- let content = document.getElementById("pgn-game").innerHTML;
- content = content.replace(/<br>/g, "\n");
+ // Variants may have special PGN structure (so next function isn't defined here)
+ const content = this.vr.getPGN(this.mycolor, this.score, this.fenStart, this.mode);
// Prepare and trigger download link
let downloadAnchor = document.getElementById("download");
downloadAnchor.setAttribute("download", "game.pgn");
- downloadAnchor.href = "data:text/plain;charset=utf-8," +
- encodeURIComponent(content);
+ downloadAnchor.href = "data:text/plain;charset=utf-8," + encodeURIComponent(content);
downloadAnchor.click();
},
showScoreMsg: function() {
localStorage.setItem(prefix+"score", score);
}
this.showScoreMsg();
- // Variants may have special PGN structure (so next function isn't defined here)
- this.pgnTxt = this.vr.getPGN(this.mycolor, this.score, this.fenStart, this.mode);
if (this.mode == "human" && this.oppConnected)
{
// Send our nickname to opponent
},
clickGameSeek: function(e) {
this.getRidOfTooltip(e.currentTarget);
- if (this.mode == "human")
+ if (this.mode == "human" && this.score == "*")
return; //no newgame while playing
if (this.seek)
{
},
clickComputerGame: function(e) {
this.getRidOfTooltip(e.currentTarget);
+ if (this.mode == "computer" && this.score == "*"
+ && this.vr.turn != this.mycolor)
+ {
+ // Wait for computer reply first (avoid potential "ghost move" bug)
+ return;
+ }
this.newGame("computer");
},
clickFriendGame: function(e) {
}
this.endGame(this.mycolor=="w"?"0-1":"1-0");
},
- newGame: function(mode, fenInit, color, oppId) {
+ newGame: function(mode, fenInit, color, oppId, gameId) {
const fen = fenInit || VariantRules.GenRandInitFen();
console.log(fen); //DEBUG
if (mode=="human" && !oppId)
}
// Send game request and wait..
try {
- this.conn.send(JSON.stringify({code:"newgame", fen:fen}));
+ this.conn.send(JSON.stringify({code:"newgame", fen:fen, gameid: getRandString() }));
} catch (INVALID_STATE_ERR) {
return; //nothing achieved
}
return;
}
}
- else if (score == "*")
- return this.continueGame("computer");
}
}
else if (mode == "friend")
this.mode = mode;
this.incheck = [];
this.fenStart = V.ParseFen(fen).position; //this is enough
- if (mode != "problem")
- this.setStorage(); //store game state in case of interruptions
if (mode=="human")
{
// Opponent found!
- this.gameId = getRandString();
+ this.gameId = gameId;
this.oppid = oppId;
this.oppConnected = true;
this.mycolor = color;
else if (mode == "friend")
this.mycolor = "w"; //convention...
//else: problem solving: nothing more to do
+ if (mode != "problem")
+ this.setStorage(); //store game state in case of interruptions
},
continueGame: function(mode) {
this.mode = mode;
else if (mode == "computer")
{
this.compWorker.postMessage(["init",fen]);
- if (this.mycolor != this.vr.turn)
+ if (score == "*" && this.mycolor != this.vr.turn)
this.playComputerMove();
}
//else: nothing special to do in friend mode
},
},
})
+
+// TODO: keep moves list here
+get lastMove()
+ {
+ const L = this.moves.length;
+ return (L>0 ? this.moves[L-1] : null);
+ }
projects / vchess.git / blobdiff