projects
/
xogo.git
/ blobdiff
commit
grep
author
committer
pickaxe
?
search:
re
summary
|
shortlog
|
log
|
commit
|
commitdiff
|
tree
raw
|
inline
| side by side
Use document.hidden instead of document.hasFocus()
[xogo.git]
/
base_rules.js
diff --git
a/base_rules.js
b/base_rules.js
index
eb01442
..
acee324
100644
(file)
--- a/
base_rules.js
+++ b/
base_rules.js
@@
-482,7
+482,7
@@
export default class ChessRules {
for (let y=0; y<this.size.y; y++) {
if (this.enlightened[x][y] && !newEnlightened[x][y]) {
let elt = document.getElementById(this.coordsToId([x, y]));
for (let y=0; y<this.size.y; y++) {
if (this.enlightened[x][y] && !newEnlightened[x][y]) {
let elt = document.getElementById(this.coordsToId([x, y]));
- elt.
style.fillOpacity = "0.5"
;
+ elt.
classList.add("in-shadow")
;
if (this.g_pieces[x][y]) {
this.g_pieces[x][y].remove();
this.g_pieces[x][y] = null;
if (this.g_pieces[x][y]) {
this.g_pieces[x][y].remove();
this.g_pieces[x][y] = null;
@@
-490,7
+490,7
@@
export default class ChessRules {
}
else if (!this.enlightened[x][y] && newEnlightened[x][y]) {
let elt = document.getElementById(this.coordsToId([x, y]));
}
else if (!this.enlightened[x][y] && newEnlightened[x][y]) {
let elt = document.getElementById(this.coordsToId([x, y]));
- elt.
style.fillOpacity = "1"
;
+ elt.
classList.remove("in-shadow")
;
if (this.board[x][y] != "") {
const piece = this.getPiece(x, y);
const color = this.getColor(x, y);
if (this.board[x][y] != "") {
const piece = this.getPiece(x, y);
const color = this.getColor(x, y);
@@
-627,13
+627,12
@@
export default class ChessRules {
for (let j=0; j < sizeY; j++) {
const ii = (flipped ? this.size.x - 1 - i : i);
const jj = (flipped ? this.size.y - 1 - j : j);
for (let j=0; j < sizeY; j++) {
const ii = (flipped ? this.size.x - 1 - i : i);
const jj = (flipped ? this.size.y - 1 - j : j);
- let
fillOpacity = '1'
;
- if (this.
options["dark"]
&& !this.enlightened[ii][jj])
-
fillOpacity = '0.5'
;
+ let
classes = this.getSquareColorClass(ii, jj)
;
+ if (this.
enlightened
&& !this.enlightened[ii][jj])
+
classes += " in-shadow"
;
// NOTE: x / y reversed because coordinates system is reversed.
// NOTE: x / y reversed because coordinates system is reversed.
- // TODO: CSS "wood" style, rect --> style --> background-image ?
- board += `<rect style="fill-opacity:${fillOpacity};
- fill:#${this.getSquareColor(ii, jj)}"
+ board += `<rect
+ class="${classes}"
id="${this.coordsToId([ii, jj])}"
width="10"
height="10"
id="${this.coordsToId([ii, jj])}"
width="10"
height="10"
@@
-646,8
+645,8
@@
export default class ChessRules {
}
// Generally light square bottom-right; TODO: user-defined colors at least
}
// Generally light square bottom-right; TODO: user-defined colors at least
- getSquareColor(i, j) {
- return ((i+j) % 2 == 0 ? "
f0d9b5": "b58863
");
+ getSquareColor
Class
(i, j) {
+ return ((i+j) % 2 == 0 ? "
light-square": "dark-square
");
}
setupPieces(r) {
}
setupPieces(r) {
@@
-1172,7
+1171,7
@@
export default class ChessRules {
}
// All possible moves from selected square
}
// All possible moves from selected square
- getPotentialMovesFrom(sq) {
+ getPotentialMovesFrom(sq
, color
) {
if (typeof sq[0] == "string") return this.getDropMovesFrom(sq);
if (this.options["madrasi"] && this.isImmobilized(sq)) return [];
const piece = this.getPiece(sq[0], sq[1]);
if (typeof sq[0] == "string") return this.getDropMovesFrom(sq);
if (this.options["madrasi"] && this.isImmobilized(sq)) return [];
const piece = this.getPiece(sq[0], sq[1]);
@@
-2091,9
+2090,9
@@
export default class ChessRules {
else launchAnimation(); //focused user!
};
let boardContainer = document.getElementById("boardContainer");
else launchAnimation(); //focused user!
};
let boardContainer = document.getElementById("boardContainer");
- if (
!document.hasFocus()
) {
-
window.onfocus
= () => {
-
window.onfocus
= undefined;
+ if (
document.hidden
) {
+
document.onvisibilitychange
= () => {
+
document.onvisibilitychange
= undefined;
checkDisplayThenAnimate();
};
}
checkDisplayThenAnimate();
};
}