+ // Input array of objects with at least fields x,y (e.g. PiPo)
+ animateFading(arr, cb) {
+ const animLength = 350; //TODO: 350ms? More? Less?
+ arr.forEach(v => {
+ let fadingPiece = this.getDomPiece(v.x, v.y);
+ fadingPiece.style.transitionDuration = (animLength / 1000) + "s";
+ fadingPiece.style.opacity = "0";
+ });
+ setTimeout(cb, animLength);
+ }
+
+ animate(move, callback) {
+ if (this.noAnimate || move.noAnimate) {
+ callback();
+ return;
+ }
+ let segments = move.segments;
+ if (!segments)
+ segments = [ [[move.start.x, move.start.y], [move.end.x, move.end.y]] ];
+ let targetObj = new TargetObj(callback);
+ if (move.start.x != move.end.x || move.start.y != move.end.y) {
+ targetObj.target++;
+ this.animateMoving(move.start, move.end, move.drag, segments,
+ () => targetObj.increment());
+ }
+ if (move.vanish.length > move.appear.length) {
+ const arr = move.vanish.slice(move.appear.length)
+ // Ignore disappearing pieces hidden by some appearing ones:
+ .filter(v => move.appear.every(a => a.x != v.x || a.y != v.y));
+ if (arr.length > 0) {
+ targetObj.target++;
+ this.animateFading(arr, () => targetObj.increment());
+ }
+ }
+ targetObj.target +=
+ this.tryAnimateCastle(move, () => targetObj.increment());
+ targetObj.target +=
+ this.customAnimate(move, segments, () => targetObj.increment());
+ if (targetObj.target == 0)
+ callback();
+ }
+
+ tryAnimateCastle(move, cb) {
+ if (
+ this.hasCastle &&
+ move.vanish.length == 2 &&
+ move.appear.length == 2 &&
+ this.isKing(0, 0, move.vanish[0].p) &&
+ this.isKing(0, 0, move.appear[0].p)
+ ) {
+ const start = {x: move.vanish[1].x, y: move.vanish[1].y},
+ end = {x: move.appear[1].x, y: move.appear[1].y};
+ const segments = [ [[start.x, start.y], [end.x, end.y]] ];
+ this.animateMoving(start, end, null, segments, cb);
+ return 1;
+ }
+ return 0;
+ }
+
+ // Potential other animations (e.g. for Suction variant)
+ customAnimate(move, segments, cb) {
+ return 0; //nb of targets
+ }
+
+ launchAnimation(moves, container, callback) {
+ if (this.hideMoves) {
+ for (let i=0; i<moves.length; i++)
+ // If hiding moves, they are revealed into play():
+ this.play(moves[i], i == moves.length - 1 ? callback : () => {});
+ return;
+ }
+ const r = container.querySelector(".chessboard").getBoundingClientRect();
+ const animateRec = i => {
+ this.animate(moves[i], () => {
+ this.play(moves[i]);
+ this.playVisual(moves[i], r);
+ if (i < moves.length - 1)
+ setTimeout(() => animateRec(i+1), 300);
+ else
+ callback();
+ });