analysis autoplay

ui/analyse/src/actionMenu.js

@@ -17,15 +17,19 @@ module.exports = {
     return m('div.action_menu',
       m('div.inner', [
         m('a.button.text[data-icon=B]', flipAttrs, ctrl.trans('flipBoard')),
-        ctrl.data.inGame ? null : m('a.button.text[data-icon=m]', {
+        m('a.button.text[data-icon=m]', {
           href: ctrl.data.userAnalysis ? '/editor?fen=' + ctrl.vm.situation.fen : '/' + ctrl.data.game.id + '/edit?fen=' + ctrl.vm.situation.fen,
           rel: 'nofollow'
         }, ctrl.trans('boardEditor')),
-        ctrl.data.inGame ? null : m('a.button.text[data-icon=U]', {
+        m('a.button.text[data-icon=U]', {
           onclick: function() {
             $.modal($('.continue_with.' + ctrl.data.game.id));
           }
         }, ctrl.trans('continueFromHere')),
+        m('a.button[data-icon=G]', {
+          class: 'text' + (ctrl.autoplay.active() ? ' active' : ''),
+          onclick: ctrl.togglePlay
+        }, 'Auto play'),
         m('div.continue_with.' + ctrl.data.game.id, [
           m('a.button', {
             href: ctrl.data.userAnalysis ? '/?fen=' + ctrl.vm.situation.fen + '#ai' : ctrl.router.Round.continue(ctrl.data.game.id, 'ai').url + '?fen=' + ctrl.vm.situation.fen,

ui/analyse/src/autoplay.js

@@ -0,0 +1,40 @@
+var control = require('./control');
+var partial = require('chessground').util.partial;
+var m = require('mithril');
+
+module.exports = function(ctrl) {
+
+  var interval;
+  var delay = 1000;
+
+  var next = function() {
+    if (control.canGoForward(ctrl)) {
+      var p = ctrl.vm.path;
+      p[p.length - 1].ply++;
+      ctrl.jump(p);
+      m.redraw();
+    } else this.stop();
+  }.bind(this);
+
+  this.start = function() {
+    this.stop();
+    next();
+    interval = setInterval(next, delay);
+  }.bind(this);
+
+  this.stop = function() {
+    if (interval) {
+      clearInterval(interval);
+      interval = null;
+    }
+  }.bind(this);
+
+  this.toggle = function() {
+    if (this.active()) this.stop();
+    else this.start();
+  }.bind(this);
+
+  this.active = function() {
+    return !!interval;
+  }.bind(this);
+};

ui/analyse/src/control.js

@@ -15,6 +15,8 @@ function canGoForward(ctrl) {
 
 module.exports = {
 
+  canGoForward: canGoForward,
+
   next: function(ctrl) {
     if (!canGoForward(ctrl)) return;
     var p = ctrl.vm.path;

ui/analyse/src/ctrl.js

@@ -6,6 +6,8 @@ var ground = require('./ground');
 var keyboard = require('./keyboard');
 var treePath = require('./path');
 var actionMenu = require('./actionMenu').controller;
+var autoplay = require('./autoplay');
+var control = require('./control');
 var m = require('mithril');
 
 module.exports = function(cfg, router, i18n, onChange) {
@@ -13,6 +15,7 @@ module.exports = function(cfg, router, i18n, onChange) {
   this.data = data({}, cfg);
   this.analyse = new analyse(this.data.game, this.data.analysis);
   this.actionMenu = new actionMenu();
+  this.autoplay = new autoplay(this);
 
   var initialPath = cfg.path ? treePath.read(cfg.path) : treePath.default();
 
@@ -21,8 +24,7 @@ module.exports = function(cfg, router, i18n, onChange) {
     pathStr: treePath.write(initialPath),
     situation: null,
     comments: true,
-    flip: false,
-    play: false
+    flip: false
   };
 
   this.flip = function() {
@@ -32,6 +34,16 @@ module.exports = function(cfg, router, i18n, onChange) {
     });
   }.bind(this);
 
+  this.togglePlay = function() {
+    this.autoplay.toggle();
+    this.actionMenu.open = false;
+  }.bind(this);
+
+  this.control = function(command) {
+    this.autoplay.stop();
+    control[command](this);
+  }.bind(this);
+
   var gameVariantChessId = function() {
     switch (this.data.game.variant.key) {
       case 'chess960':

ui/analyse/src/view.js

@@ -6,7 +6,6 @@ var partial = require('chessground').util.partial;
 var renderStatus = require('game').view.status;
 var mod = require('game').view.mod;
 var treePath = require('./path');
-var control = require('./control');
 var actionMenu = require('./actionMenu').view;
 
 function renderEval(e) {
@@ -236,8 +235,8 @@ function renderAnalyse(ctrl) {
 }
 
 function wheel(ctrl, e) {
-  if (e.deltaY > 0) control.next(ctrl);
-  else if (e.deltaY < 0) control.prev(ctrl);
+  if (e.deltaY > 0) ctrl.control('next');
+  else if (e.deltaY < 0) ctrl.control('prev');
   m.redraw();
   e.preventDefault();
   return false;
@@ -270,10 +269,10 @@ function buttons(ctrl) {
   return [
     m('div.game_control', [
       m('div.jumps.hint--bottom', [
-        ['first', 'W', control.first, ],
-        ['prev', 'Y', control.prev],
-        ['next', 'X', control.next],
-        ['last', 'V', control.last]
+        ['first', 'W', 'first', ],
+        ['prev', 'Y', 'prev'],
+        ['next', 'X', 'next'],
+        ['last', 'V', 'last']
       ].map(function(b) {
         return {
           tag: 'a',
@@ -283,11 +282,11 @@ function buttons(ctrl) {
               glowing: ctrl.vm.late && b[0] === 'last'
             }),
             'data-icon': b[1],
-            onclick: partial(b[2], ctrl)
+            onclick: partial(ctrl.control, b[2])
           }
         };
       })),
-      m('a.button', {
+      ctrl.data.inGame ? null : m('a.button', {
         onclick: ctrl.actionMenu.toggle,
         class: ctrl.actionMenu.open ? 'active' : ''
       }, m('span', {