);
}
const lm = this.vr.lastMove;
- const highlight = !!lm && _.isMatch(lm.end, {x:ci,y:cj});
+ const showLight = !this.expert &&
+ (this.mode!="idle" || this.cursor==this.vr.moves.length);
return h(
'div',
{
'class': {
'board': true,
['board'+sizeY]: true,
- 'light-square': (i+j)%2==0 && (this.expert || !highlight),
- 'dark-square': (i+j)%2==1 && (this.expert || !highlight),
- 'highlight': !this.expert && highlight,
- 'incheck': !this.expert && incheckSq[ci][cj],
+ 'light-square': (i+j)%2==0,
+ 'dark-square': (i+j)%2==1,
+ 'highlight': showLight && !!lm && _.isMatch(lm.end, {x:ci,y:cj}),
+ 'incheck': showLight && incheckSq[ci][cj],
},
attrs: {
id: this.getSquareId({x:ci,y:cj}),
style: { "margin-left": "30px" },
on: { click: e => this.undo() },
attrs: { "aria-label": 'Undo' },
- 'class': {
- "tooltip":true,
- "bottom": true,
- },
},
[h('i', { 'class': { "material-icons": true } }, "fast_rewind")]),
h('button',
{
on: { click: e => this.play() },
attrs: { "aria-label": 'Play' },
- 'class': {
- "tooltip":true,
- "bottom": true,
- },
},
[h('i', { 'class': { "material-icons": true } }, "fast_forward")]),
]
}),
h('div',
{
- attrs: { "role": "dialog", "aria-labelledby": "dialog-title" },
+ attrs: { "role": "dialog", "aria-labelledby": "modal-eog" },
},
[
h('div',
}),
h('div',
{
- attrs: { "role": "dialog", "aria-labelledby": "dialog-title" },
+ attrs: { "role": "dialog", "aria-labelledby": "modal-newgame" },
},
[
h('div',
else if (localStorage.getItem("newgame") === variant)
{
// New game request has been cancelled on disconnect
- this.seek = true;
this.newGame("human", undefined, undefined, undefined, undefined, "reconnect");
}
};
}
return eogMessage;
},
- toggleExpertMode: function() {
- this.expert = !this.expert;
- document.cookie = "expert=" + (this.expert ? "1" : "0");
- },
- resign: function() {
- if (this.mode == "human" && this.oppConnected)
- {
- try {
- this.conn.send(JSON.stringify({code: "resign", oppid: this.oppid}));
- } catch (INVALID_STATE_ERR) {
- return; //socket is not ready (and not yet reconnected)
- }
- }
- this.endGame(this.mycolor=="w"?"0-1":"1-0");
- },
setStorage: function() {
localStorage.setItem("myid", this.myid);
localStorage.setItem("variant", variant);
delete localStorage["fen"];
delete localStorage["moves"];
},
- clickGameSeek: function() {
+ // HACK because mini-css tooltips are persistent after click...
+ getRidOfTooltip: function(elt) {
+ elt.style.visibility = "hidden";
+ setTimeout(() => { elt.style.visibility="visible"; }, 100);
+ },
+ clickGameSeek: function(e) {
+ this.getRidOfTooltip(e.currentTarget);
if (this.mode == "human")
return; //no newgame while playing
if (this.seek)
{
+ this.conn.send(JSON.stringify({code:"cancelnewgame"}));
delete localStorage["newgame"]; //cancel game seek
this.seek = false;
}
else
this.newGame("human");
},
- clickComputerGame: function() {
+ clickComputerGame: function(e) {
+ this.getRidOfTooltip(e.currentTarget);
if (this.mode == "human")
return; //no newgame while playing
this.newGame("computer");
},
+ toggleExpertMode: function(e) {
+ this.getRidOfTooltip(e.currentTarget);
+ this.expert = !this.expert;
+ document.cookie = "expert=" + (this.expert ? "1" : "0");
+ },
+ resign: function() {
+ if (this.mode == "human" && this.oppConnected)
+ {
+ try {
+ this.conn.send(JSON.stringify({code: "resign", oppid: this.oppid}));
+ } catch (INVALID_STATE_ERR) {
+ return; //socket is not ready (and not yet reconnected)
+ }
+ }
+ this.endGame(this.mycolor=="w"?"0-1":"1-0");
+ },
newGame: function(mode, fenInit, color, oppId, moves, continuation) {
const fen = fenInit || VariantRules.GenRandInitFen();
console.log(fen); //DEBUG
- this.score = "*";
if (mode=="human" && !oppId)
{
const storageVariant = localStorage.getItem("variant");
// random enough (TODO: function)
this.gameId = (Date.now().toString(36) + Math.random().toString(36).substr(2, 7)).toUpperCase();
this.vr = new VariantRules(fen, moves || []);
+ this.score = "*";
this.pgnTxt = ""; //redundant with this.score = "*", but cleaner
this.mode = mode;
this.incheck = []; //in case of
this.animateMove(move);
return;
}
- this.incheck = this.vr.getCheckSquares(move); //is opponent in check?
// Not programmatic, or animation is over
if (this.mode == "human" && this.vr.turn == this.mycolor)
this.conn.send(JSON.stringify({code:"newmove", move:move, oppid:this.oppid}));
new Audio("/sounds/chessmove1.mp3").play().then(() => {}).catch(err => {});
if (this.mode != "idle")
+ {
+ this.incheck = this.vr.getCheckSquares(move); //is opponent in check?
this.vr.play(move, "ingame");
+ }
else
+ {
VariantRules.PlayOnBoard(this.vr.board, move);
+ this.$forceUpdate(); //TODO: ?!
+ }
if (this.mode == "human")
this.updateStorage(); //after our moves and opponent moves
if (this.mode != "idle")
// Navigate after game is over
if (this.cursor == 0)
return; //already at the beginning
+ if (this.cursor == this.vr.moves.length)
+ this.incheck = []; //in case of...
const move = this.vr.moves[--this.cursor];
VariantRules.UndoOnBoard(this.vr.board, move);
this.$forceUpdate(); //TODO: ?!