}
}
- for (var i = 0; i < a.length; i++) {
- // clear a piece
- if (a[i].type === 'clear') {
- document.getElementById(SQUARE_ELS_IDS[a[i].square]).querySelectorAll('.' + CSS.piece).forEach(
- (piece) => fadeOut(piece, onFinish)
- );
- }
+ requestAnimationFrame(() => { // Firefox workaround.
+ for (var i = 0; i < a.length; i++) {
+ // clear a piece
+ if (a[i].type === 'clear') {
+ document.getElementById(SQUARE_ELS_IDS[a[i].square]).querySelectorAll('.' + CSS.piece).forEach(
+ (piece) => fadeOut(piece, onFinish)
+ );
+ }
- // add a piece (no spare pieces)
- if (a[i].type === 'add' && cfg.sparePieces !== true) {
- let square = document.getElementById(SQUARE_ELS_IDS[a[i].square]);
- square.append(buildPiece(a[i].piece, true));
- let piece = square.querySelector('.' + CSS.piece);
- fadeIn(piece, onFinish);
- }
+ // add a piece (no spare pieces)
+ if (a[i].type === 'add' && cfg.sparePieces !== true) {
+ let square = document.getElementById(SQUARE_ELS_IDS[a[i].square]);
+ square.append(buildPiece(a[i].piece, true));
+ let piece = square.querySelector('.' + CSS.piece);
+ fadeIn(piece, onFinish);
+ }
- // add a piece from a spare piece
- if (a[i].type === 'add' && cfg.sparePieces === true) {
- animateSparePieceToSquare(a[i].piece, a[i].square, onFinish);
- }
+ // add a piece from a spare piece
+ if (a[i].type === 'add' && cfg.sparePieces === true) {
+ animateSparePieceToSquare(a[i].piece, a[i].square, onFinish);
+ }
- // move a piece
- if (a[i].type === 'move') {
- animateSquareToSquare(a[i].source, a[i].destination, a[i].piece,
- onFinish);
+ // move a piece
+ if (a[i].type === 'move') {
+ animateSquareToSquare(a[i].source, a[i].destination, a[i].piece,
+ onFinish);
+ }
}
- }
+ });
}
// returns the distance between two squares