implement atomic chess UI explosions

public/stylesheets/chessground.css

@@ -129,6 +129,9 @@ body.highlight .cg-board .cg-square.check {
 body.base .cg-board .cg-square.current-premove {
   background-color: rgba(20, 30, 85, 0.5);
 }
+body.base .cg-board .cg-square.exploding {
+  background-color: rgba(255, 0, 0, 0.5);
+}
 .cg-piece {
   width: 100%;
   height: 100%;

ui/analyse/package.json

@@ -30,7 +30,7 @@
     "watchify": "^1.0.2"
   },
   "dependencies": {
-    "chessground": "1.8.2",
+    "chessground": "1.8.4",
     "chessli.js": "file:../chessli",
     "game": "file:../game",
     "lodash-node": "^2.4.1",

ui/editor/package.json

@@ -30,7 +30,7 @@
     "watchify": "^1.0.2"
   },
   "dependencies": {
-    "chessground": "1.8.2",
+    "chessground": "1.8.4",
     "lodash-node": "^2.4.1",
     "mithril": "0.1.27"
   }

ui/lobby/package.json

@@ -30,7 +30,7 @@
     "watchify": "^1.0.2"
   },
   "dependencies": {
-    "chessground": "1.8.2",
+    "chessground": "1.8.4",
     "lodash-node": "^2.4.1",
     "mithril": "0.1.27"
   }

ui/puzzle/package.json

@@ -30,7 +30,7 @@
     "watchify": "^1.0.2"
   },
   "dependencies": {
-    "chessground": "1.8.2",
+    "chessground": "1.8.4",
     "chessli.js": "file:../chessli",
     "lodash-node": "^2.4.1",
     "merge": "^1.2.0",

ui/round/package.json

@@ -30,7 +30,7 @@
     "watchify": "^1.0.2"
   },
   "dependencies": {
-    "chessground": "1.8.2",
+    "chessground": "1.8.4",
     "chessli.js": "file:../chessli",
     "game": "file:../game",
     "lodash-node": "^2.4.1",

ui/round/src/atomic.js

@@ -0,0 +1,17 @@
+var util = require('chessground').util;
+
+function capture(ctrl, key) {
+  var ps = [];
+  var pos = util.key2pos(key);
+  for (var x = -1; x < 2; x++) {
+    for (var y = -1; y < 2; y++) {
+      var p = util.pos2key([pos[0] + x, pos[1] + y]);
+      if (p) ps.push(p);
+    }
+  }
+  ctrl.chessground.explode(ps);
+};
+
+module.exports = {
+  capture: capture
+};

ui/round/src/ctrl.js

@@ -16,6 +16,7 @@ var replayCtrl = require('./replay/ctrl');
 var clockCtrl = require('./clock/ctrl');
 var correspondenceClockCtrl = require('./correspondenceClock/ctrl');
 var moveOn = require('./moveOn');
+var atomic = require('./atomic');
 
 module.exports = function(opts) {
 
@@ -51,12 +52,19 @@ module.exports = function(opts) {
     });
   }.bind(this);
 
-  this.userMove = function(orig, dest, meta) {
+  var onUserMove = function(orig, dest, meta) {
     hold.register(this.socket, meta.holdTime);
     if (!promotion.start(this, orig, dest, meta.premove)) this.sendMove(orig, dest);
     $.sound.move(this.data.player.color == 'white');
   }.bind(this);
 
+  var onCapture = function(key) {
+    if (this.data.game.variant.key === 'atomicChess') atomic.capture(this, key);
+    else $.sound.take();
+  }.bind(this);
+
+  this.chessground = ground.make(this.data, opts.data.game.fen, onUserMove, onCapture);
+
   this.apiMove = function(o) {
     if (this.replay.active) this.replay.vm.late = true;
     else this.chessground.apiMove(o.from, o.to);
@@ -69,8 +77,6 @@ module.exports = function(opts) {
     if (game.isPlayerPlaying(this.data) && o.color === this.data.player.color) this.moveOn.next();
   }.bind(this);
 
-  this.chessground = ground.make(this.data, opts.data.game.fen, this.userMove);
-
   this.reload = function(cfg) {
     this.replay.onReload(cfg);
     this.data = data(this.data, cfg);

ui/round/src/ground.js

@@ -39,18 +39,18 @@ function makeConfig(data, fen, flip) {
     },
     draggable: {
       showGhost: data.pref.highlight
-    },
-    events: {
-      capture: $.sound.take
     }
   };
 }
 
-function make(data, fen, userMove) {
+function make(data, fen, userMove, onCapture) {
   var config = makeConfig(data, fen);
   config.movable.events = {
     after: userMove
   };
+  config.events = {
+    capture: onCapture
+  };
   config.viewOnly = data.player.spectator;
   return new chessground.controller(config);
 }