Graphs: disabled one CPU consuming graph

app/js/app.config.js

@@ -30,5 +30,5 @@ module.exports = () => {
   homeControllers.controller('CurrencyController',         require('./controllers/main/settings/tabs/CurrencyController'));
   homeControllers.controller('KeyController',              require('./controllers/main/settings/tabs/KeyController'));
   homeControllers.controller('GraphsController',           require('./controllers/main/graphs/GraphsController'));
-  homeControllers.controller('BlockchainGraphsController', require('./controllers/main/graphs/BlockchainGraphsController'));
+  homeControllers.controller('GraphsBlockchainController', require('./controllers/main/graphs/GraphsBlockchainController'));
 };

app/js/controllers/main/graphs/BlockchainGraphsController.js → app/js/controllers/main/graphs/GraphsBlockchainController.js

@@ -4,10 +4,31 @@ const BLOCKS_COUNT = 40;
 
 var co = require('co');
 
-module.exports = ($scope, $state, BMA, UIUtils, Graph) => {
+module.exports = ($scope, $state, $timeout, BMA, UIUtils, Graph) => {
 
+  let data = {};
+
+  $scope.loading = true;
   $scope.blocksCount = $scope.blocksCount || BLOCKS_COUNT;
 
+  $scope.$watch('withTime', (newValue) => {
+    if (newValue) {
+      timeGraph();
+    }
+  });
+
+  $scope.$watch('withSpeed', (newValue) => {
+    if (newValue) {
+      speedGraph();
+    }
+  });
+
+  $scope.$watch('withDifficulty', (newValue) => {
+    if (newValue) {
+      diffGraph();
+    }
+  });
+
   $scope.updateGraphs = () => {
     return co(function *() {
       let summary = yield BMA.webmin.summary();
@@ -34,27 +55,52 @@ module.exports = ($scope, $state, BMA, UIUtils, Graph) => {
         accelerations.push(block.time - block.medianTime);
         medianTimeIncrements.push(block.medianTime - (i ? blocks[i-1].medianTime : block.medianTime));
       }
-      let minSpeeds = speeds.map(() => parseFloat((BY_HOUR/Math.ceil(parameters.avgGenTime * Math.sqrt(1.066))).toFixed(2)));
-      let maxSpeeds = speeds.map(() => parseFloat((BY_HOUR/Math.floor(parameters.avgGenTime / Math.sqrt(1.066))).toFixed(2)));
-      let minDurations = speeds.map(() => parseFloat(((parameters.avgGenTime / 1.066)).toFixed(2)));
-      let maxDurations = speeds.map(() => parseFloat(((parameters.avgGenTime * 1.066)).toFixed(2)));
-      let difficulties = blocks.map((b) => b.powMin);
+      data.summary = summary;
+      data.speeds = speeds;
+      data.accelerations = accelerations;
+      data.medianTimeIncrements = medianTimeIncrements;
+      data.actualDurations = actualDurations;
+      data.minSpeeds = speeds.map(() => parseFloat((BY_HOUR/Math.ceil(parameters.avgGenTime * Math.sqrt(1.066))).toFixed(2)));
+      data.maxSpeeds = speeds.map(() => parseFloat((BY_HOUR/Math.floor(parameters.avgGenTime / Math.sqrt(1.066))).toFixed(2)));
+      data.minDurations = speeds.map(() => parseFloat(((parameters.avgGenTime / 1.066)).toFixed(2)));
+      data.maxDurations = speeds.map(() => parseFloat(((parameters.avgGenTime * 1.066)).toFixed(2)));
+      data.difficulties = blocks.map((b) => b.powMin);
+
+      let graphs = [];
+      if ($scope.withTime) graphs.push(timeGraph);
+      if ($scope.withSpeed) graphs.push(speedGraph);
+      if ($scope.withDifficulty) graphs.push(diffGraph);
+      for (let i = 0, len = graphs.length; i < len; i++) {
+        graphs[i]();
+      }
+      $scope.loading = false;
+    });
+  };
 
-      setTimeout(() => {
-        Graph.timeGraphs('#timeGraph', Math.max(0, summary.current.number - $scope.blocksCount + 1), accelerations, medianTimeIncrements, actualDurations, minDurations, maxDurations);
+  function timeGraph() {
+    if ($scope.withTime) {
+      Graph.timeGraphs('#timeGraph', Math.max(0, data.summary.current.number - $scope.blocksCount + 1), data.accelerations, data.medianTimeIncrements, data.actualDurations, data.minDurations, data.maxDurations);
+    }
+  }
 
-        setTimeout(() => {
-          Graph.speedGraph('#speedGraph', Math.max(0, summary.current.number - $scope.blocksCount), speeds, minSpeeds, maxSpeeds, (series) => {
+  function speedGraph() {
+    if ($scope.withSpeed) {
+      Graph.speedGraph('#speedGraph', Math.max(0, data.summary.current.number - $scope.blocksCount), data.speeds, data.minSpeeds, data.maxSpeeds, (series) => {
         $scope.series = series;
       });
-        }, 1000);
+    }
+  }
 
-        setTimeout(() => {
-          Graph.difficultyGraph('#difficultyGraph', Math.max(0, summary.current.number - $scope.blocksCount), difficulties);
-        }, 1000);
-      }, 100);
-    });
-  };
+  function diffGraph() {
+    if ($scope.withDifficulty) {
+      Graph.difficultyGraph('#difficultyGraph', Math.max(0, data.summary.current.number - $scope.blocksCount), data.difficulties);
+    }
+  }
 
-  setTimeout(() => $scope.updateGraphs(), 300);
+  return co(function *() {
+    yield $scope.updateGraphs();
+    $scope.withTime = true;
+    $scope.withDifficulty = true;
+    $scope.$apply();
+  });
 };

app/js/lib/conf/i18n/en.json

@@ -121,5 +121,8 @@
   "settings.data.reset.experimental": "This functionality is still considered experimental. If you encounters strange behaviors, please stop the software and reset manually your node by removing all the files BUT conf.json under ~/.config/ucoin/ucoin_default, and restart the software.",
   "graphs.tabs.blockchain": "Blockchain",
   "graphs.tabs.currency": "Currency",
-  "graphs.blockchain.range": "Graphs for the last X blocks: (please choose X value)"
+  "graphs.blockchain.range": "Graphs for the last X blocks: (please choose X value)",
+  "graphs.blockchain.with.time": "Time variations graph",
+  "graphs.blockchain.with.speed": "Writing speed graph",
+  "graphs.blockchain.with.difficulty": "Difficulty graph"
 }

app/js/lib/conf/routes.js

@@ -168,7 +168,7 @@ module.exports = (app) => {
     state('main.graphs.blockchain', {
       url: '/blockchain',
       template: require('views/main/graphs/blockchain'),
-      controller: 'BlockchainGraphsController'
+      controller: 'GraphsBlockchainController'
     }).
 
     //state('graphs.crypto', {

app/views/main/graphs/blockchain.jade

+.container
+  .row
+    .card
+      .card-action
         .row
-
           .col.s12
             .container
               p {{ 'graphs.blockchain.range' | translate }}
               .range-field
                 input(type="range" min="30" max="600" ng-model="blocksCount" ng-mouseup="updateGraphs()")
 
-  .col.s12
-    .card.graph
-      .card-content
-        #timeGraph
+              //.input-field.col.s6.m4
+              //  input#time.filled-in(type="checkbox" ng-model="withTime")
+              //  label(for="time") {{ 'graphs.blockchain.with.time' | translate }}
 
-  .col.s12
-    .card.graph
-      .card-content
-        #speedGraph
+              // Too heavy for now
+              //.input-field.col.s6.m4
+              //  input#speed.filled-in(type="checkbox" ng-model="withSpeed")
+              //  label(for="speed") {{ 'graphs.blockchain.with.speed' | translate }}
 
-  .col.s12
-    .card.graph
-      .card-content
+              //.input-field.col.s6.m4
+              //  input#difficulty.filled-in(type="checkbox" ng-model="withDifficulty")
+              //  label(for="difficulty") {{ 'graphs.blockchain.with.difficulty' | translate }}
+            .s12.center(ng-if="loading")
+              .row
+              .row
+              .preloader-wrapper.active
+                .spinner-layer.spinner-blue-only
+                  .circle-clipper.left
+                    .circle
+              p {{ message | translate:'{number: current_number}' }}
+          #timeGraph
+          //#speedGraph
           #difficultyGraph