1 files changed, 94 insertions, 22 deletions

diff --git a/public/bundle.js b/public/bundle.js
index 8144ab3..da96b1f 100644
--- a/public/bundle.js
+++ b/public/bundle.js
@@ -310,11 +310,13 @@ function crud_upload(type, fd, data, dispatch) {
 
     dispatch && dispatch({ type: (0, _crud.as_type)(type, 'upload_loading') });
 
+    var complete = false;
+
     function uploadProgress(e) {
       if (e.lengthComputable) {
         dispatch && dispatch(_defineProperty({
           type: (0, _crud.as_type)(type, 'upload_progress'),
-          percent: Math.round(e.loaded * 100 / e.total)
+          percent: Math.round(e.loaded * 100 / e.total) || 0
         }, type, id));
       } else {
         dispatch && dispatch(_defineProperty({
@@ -381,6 +383,12 @@ exports.actions = undefined;
 
 var _crud = __webpack_require__(/*! ./crud.actions */ "./app/client/api/crud.actions.js");
 
+var _util = __webpack_require__(/*! ./util */ "./app/client/api/util.js");
+
+var util = _interopRequireWildcard(_util);
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
+
 /*
 for our crud events, create corresponding actions
 the actions fire a 'loading' event, call the underlying api method, and then resolve.
@@ -400,6 +408,33 @@ var actions = exports.actions = ['folder', 'file', 'dataset', 'task', 'user'].re
 
 /***/ }),
 
+/***/ "./app/client/api/util.js":
+/*!********************************!*\
+  !*** ./app/client/api/util.js ***!
+  \********************************/
+/*! no static exports found */
+/***/ (function(module, exports, __webpack_require__) {
+
+"use strict";
+
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var is_iphone = exports.is_iphone = !!(navigator.userAgent.match(/iPhone/i) || navigator.userAgent.match(/iPod/i));
+var is_ipad = exports.is_ipad = !!navigator.userAgent.match(/iPad/i);
+var is_android = exports.is_android = !!navigator.userAgent.match(/Android/i);
+var is_mobile = exports.is_mobile = is_iphone || is_ipad || is_android;
+var is_desktop = exports.is_desktop = !is_mobile;
+
+var htmlClassList = document.body.parentNode.classList;
+htmlClassList.add(is_desktop ? 'desktop' : 'mobile');
+htmlClassList.remove('loading');
+
+// window.debug = false
+
+/***/ }),
+
 /***/ "./app/client/common/button.component.js":
 /*!***********************************************!*\
   !*** ./app/client/common/button.component.js ***!
@@ -551,7 +586,7 @@ var FileList = function (_Component) {
       var fileList = files.map(function (file) {
         return (0, _preact.h)(
           'div',
-          { 'class': 'row', key: file.name },
+          { 'class': 'row file', key: file.name },
           (0, _preact.h)(
             'div',
             { className: 'filename' },
@@ -840,8 +875,9 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
 function Header(_ref) {
-  var fps = _ref.fps,
-      app = _ref.app,
+  var app = _ref.app,
+      fps = _ref.fps,
+      playing = _ref.playing,
       actions = _ref.actions;
 
   var tool_list = Object.keys(_modules2.default).map(function (name, i) {
@@ -891,7 +927,7 @@ function Header(_ref) {
       )
     ),
     (0, _preact.h)(Links, null),
-    (0, _preact.h)(
+    playing && (0, _preact.h)(
       'span',
       null,
       fps,
@@ -903,7 +939,8 @@ function Header(_ref) {
 var mapStateToProps = function mapStateToProps(state) {
   return {
     app: state.system.app,
-    fps: state.live.fps
+    fps: state.live.fps,
+    playing: state.live.playing
   };
 };
 
@@ -1979,6 +2016,10 @@ var _socket = __webpack_require__(/*! ./socket */ "./app/client/socket/index.js"
 
 var socket = _interopRequireWildcard(_socket);
 
+var _util = __webpack_require__(/*! ./util */ "./app/client/util.js");
+
+var util = _interopRequireWildcard(_util);
+
 var _header = __webpack_require__(/*! ./common/header.component */ "./app/client/common/header.component.js");
 
 var _header2 = _interopRequireDefault(_header);
@@ -1999,14 +2040,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
 
-// import client from './client'
-
-window.debug = false;
-
 var module_list = Object.keys(_modules2.default).map(function (name) {
   var module = _modules2.default[name];
   return (0, _preact.h)(_reactRouterDom.Route, { path: '/' + module.name, component: module.router });
 });
+// import client from './client'
 
 var app = (0, _preact.h)(
   _reactRedux.Provider,
@@ -2148,6 +2186,7 @@ var liveInitialState = {
   epochs: ['latest'],
   sequences: [],
   fps: 0,
+  playing: false,
   frame: { i: 0, sequence_i: 0, sequence_len: '1' }
 };
 
@@ -2205,6 +2244,16 @@ var liveReducer = function liveReducer() {
         frame: action.meta
       }) : state;
 
+    case _types2.default.player.pausing:
+      return _extends({}, state, {
+        playing: false
+      });
+
+    case _types2.default.player.playing:
+      return _extends({}, state, {
+        playing: true
+      });
+
     case _types2.default.player.start_recording:
       return _extends({}, state, {
         opt: _extends({}, state.opt, {
@@ -2217,7 +2266,6 @@ var liveReducer = function liveReducer() {
           recordFrames: (state.opt.recordFrames || 0) + 1
         })
       });
-
     case _types2.default.player.save_frame:
       _fileSaver2.default.saveAs(action.blob, state.opt.checkpoint_name + "_" + state.opt.sequence + "_" + (0, _moment2.default)().format("YYYYMMDD_HHmm") + ".png");
       return state;
@@ -2343,17 +2391,40 @@ function onFrame(data) {
   img.src = url;
 }
 
-setInterval(function () {
-  _store.store.dispatch({
-    type: _types2.default.player.set_fps,
-    fps: fps
-  });
-  _store.store.dispatch({
-    type: _types2.default.player.current_frame,
-    meta: last_frame
-  });
-  fps = 0;
-}, 1000);
+var previousValue = void 0,
+    currentValue = void 0;
+function handleChange() {
+  var previousValue = currentValue;
+  currentValue = _store.store.getState().live.playing;
+
+  if (previousValue !== currentValue) {
+    if (currentValue) {
+      startWatchingFPS();
+    } else {
+      stopWatchingFPS();
+    }
+  }
+}
+
+var fpsInterval = void 0;
+
+function startWatchingFPS() {
+  clearInterval(fpsInterval);
+  fpsInterval = setInterval(function () {
+    _store.store.dispatch({
+      type: _types2.default.player.set_fps,
+      fps: fps
+    });
+    _store.store.dispatch({
+      type: _types2.default.player.current_frame,
+      meta: last_frame
+    });
+    fps = 0;
+  }, 1000);
+}
+function stopWatchingFPS() {
+  clearInterval(fpsInterval);
+}
 
 /***/ }),
 
@@ -3762,6 +3833,7 @@ var samplernnReducer = function samplernnReducer() {
   var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : samplernnInitialState;
   var action = arguments[1];
 
+  console.log(action);
   switch (action.type) {
     case _types2.default.socket.connect:
       return _extends({}, state);