adjust performance chart, move data to service

Author: micrum

src/app/controllers/PerformanceController.js

@@ -9,17 +9,6 @@
     function PerformanceController(performanceService, $q) {
         var vm = this;
 
-
-        vm.performanceChartData = performanceFunction;
-
-        function performanceFunction() {
-            var sin = [];
-            for (var i = 0; i < 100; i++) {
-                sin.push({x: i, y: Math.abs(Math.cos(i/10) *0.25*i + 0.9 - 0.4*i)});
-            }
-            return [ { values: sin, color: 'rgb(0, 150, 136)', area: true } ];
-        }
-
         vm.chartOptions = {
             chart: {
                 type: 'stackedAreaChart',
@@ -32,37 +21,13 @@
                 title: 'Over 9K',
                 showYAxis: false,
                 showXAxis: false,
+                color: ['rgb(0, 150, 136)', 'rgb(204, 203, 203)', 'rgb(149, 149, 149)', 'rgb(44, 44, 44)'],
                 tooltip: { contentGenerator: function (d) { return '<div class="custom-tooltip">' + d.point.y + '%</div>' + '<div class="custom-tooltip">' + d.series[0].key + '</div>' } },
                 showControls: false
             }
         };
 
-        vm.performanceData = {};
-        vm.performanceChartData = [
-
-
-            // TODO: move data to service, implement period switching
-            {
-                "key" : 'Middleware' ,
-                "values" : [ [1,13], [2,14], [3,24], [4,18], [5,16], [6,14], [7,11], [8, 13], [9,15], [10,11], [11,18], [12,16], [13,28], [14,11], [15,12], [16,13], [17,12], [18,20], [19, 22], [20, 18], [21,11], [22,10], [23,18], [24, 20], [25,9], [26,14], [27,10], [28,11], [29,17] ]
-            },
-
-            {
-                "key" : 'Ruby' ,
-                "values" : [ [1,29], [2,36], [3,42], [4,25], [5,22], [6,34], [7,41], [8, 19], [9,45], [10,31], [11,28], [12,36], [13,54], [14,41], [15,36], [16,39], [17,21], [18,20], [19, 22], [20, 44], [21,32], [22,20], [23,28], [24, 24], [25,29], [26,19], [27,20], [28,31], [29,49] ]
-            },
-
-            {
-                "key" : 'Web External' ,
-                "values" : [ [1,54], [2,74], [3,64], [4,68], [5,56], [6,44], [7,61], [8, 63], [9,45], [10,51], [11,68], [12,46], [13,64], [14,51], [15,42], [16,63], [17,72], [18,60], [19, 52], [20, 58], [21,41], [22,40], [23,58], [24, 30], [25,49], [26,54], [27,60], [28,41], [29,66] ]
-            } ,
-            {
-                "key" : 'Database' ,
-                "values" : [ [1,64], [2,84], [3,64], [4,68], [5,86], [6,74], [7,81], [8, 83], [9,65], [10,61], [11,88], [12,76], [13,84], [14,71], [15,82], [16,73], [17,92], [18,80], [19, 62], [20, 68], [21,71], [22,50], [23,78], [24, 60], [25,59], [26,74], [27,80], [28,51], [29,97] ]
-            }
-
-
-        ];
+        vm.performanceChartData = [];
         vm.performancePeriod = 'week';
         vm.changePeriod = changePeriod;
 
@@ -75,7 +40,7 @@
 
 
         function loadData() {
-            vm.performanceData = performanceService.getPerformanceData(vm.performancePeriod);
+            vm.performanceChartData = performanceService.getPerformanceData(vm.performancePeriod);
         }
 
         function changePeriod() {

src/app/views/dashboard.html

@@ -11,6 +11,6 @@
 </div>
 
 <div layout-gt-md="row">
-  <panel-widget flex title="Performance" template="app/views/partials/progress.html" options="true"></panel-widget>
+  <panel-widget flex title="Performance" template="app/views/partials/performance.html" options="true"></panel-widget>
   <panel-widget flex title="TODO list" template="app/views/partials/checkboxes.html"></panel-widget>
 </div>

src/app/views/partials/progress.html renamed to src/app/views/partials/performance.html

@@ -18,47 +18,43 @@
       if (performancePeriod === 'week') {
         return [
           {
-            title: 'Database',
-            value: 54,
-            theme: 'dark'
+            "key" : 'Middleware' ,
+            "values" : [ [1,11], [2,10], [3,14], [4,21], [5,13], [6,21], [7,21], [8, 18], [9,11], [10,11], [11,18], [12,14], [13,10], [14,20], [15,21], [16,28], [17,12], [18,16], [19, 22], [20, 18], [21,21], [22,10], [23,11], [24, 14], [25,9], [26,14], [27,10], [28,21], [29,11] ]
           },
+
           {
-            title: 'Web external',
-            value: 64,
-            theme: ''
+            "key" : 'Ruby' ,
+            "values" : [ [1,29], [2,36], [3,42], [4,25], [5,22], [6,34], [7,41], [8, 19], [9,45], [10,31], [11,28], [12,36], [13,54], [14,41], [15,36], [16,39], [17,21], [18,20], [19, 22], [20, 44], [21,32], [22,20], [23,28], [24, 24], [25,29], [26,19], [27,20], [28,31], [29,49] ]
           },
+
           {
-            title: 'Middleware',
-            value: 13,
-            theme: 'grey'
-          },
+            "key" : 'Web External' ,
+            "values" : [ [1,54], [2,74], [3,64], [4,68], [5,56], [6,44], [7,61], [8, 63], [9,45], [10,51], [11,68], [12,46], [13,64], [14,51], [15,42], [16,63], [17,72], [18,60], [19, 52], [20, 58], [21,41], [22,40], [23,58], [24, 30], [25,49], [26,54], [27,60], [28,41], [29,66] ]
+          } ,
           {
-            title: 'Ruby',
-            value: 29,
-            theme: 'red'
+            "key" : 'Database' ,
+            "values" : [ [1,64], [2,84], [3,64], [4,68], [5,86], [6,74], [7,81], [8, 83], [9,65], [10,61], [11,88], [12,76], [13,84], [14,71], [15,82], [16,73], [17,92], [18,80], [19, 62], [20, 68], [21,71], [22,50], [23,78], [24, 60], [25,59], [26,74], [27,80], [28,51], [29,97] ]
           }
         ]
       } else {
         return [
           {
-            title: 'Database',
-            value: 41,
-            theme: 'dark'
+            "key" : 'Middleware' ,
+            "values" : [ [1,13], [2,14], [3,24], [4,18], [5,16], [6,14], [7,11], [8, 13], [9,15], [10,11], [11,18], [12,16], [13,28], [14,11], [15,12], [16,13], [17,12], [18,20], [19, 22], [20, 18], [21,11], [22,10], [23,18], [24, 20], [25,9], [26,14], [27,10], [28,11], [29,17] ]
           },
+
           {
-            title: 'Web external',
-            value: 43,
-            theme: ''
+            "key" : 'Ruby' ,
+            "values" : [ [1,29], [2,36], [3,42], [4,25], [5,22], [6,34], [7,41], [8, 19], [9,45], [10,31], [11,28], [12,36], [13,54], [14,41], [15,36], [16,39], [17,21], [18,20], [19, 22], [20, 44], [21,32], [22,20], [23,28], [24, 24], [25,29], [26,19], [27,20], [28,31], [29,49] ]
           },
+
           {
-            title: 'Middleware',
-            value: 6,
-            theme: 'grey'
-          },
+            "key" : 'Web External' ,
+            "values" : [ [1,54], [2,74], [3,64], [4,68], [5,56], [6,44], [7,61], [8, 63], [9,45], [10,51], [11,68], [12,46], [13,64], [14,51], [15,42], [16,63], [17,72], [18,60], [19, 52], [20, 58], [21,41], [22,40], [23,58], [24, 30], [25,49], [26,54], [27,60], [28,41], [29,66] ]
+          } ,
           {
-            title: 'Ruby',
-            value: 21,
-            theme: 'red'
+            "key" : 'Database' ,
+            "values" : [ [1,74], [2,64], [3,84], [4,78], [5,66], [6,64], [7,71], [8, 83], [9,55], [10,81], [11,88], [12,76], [13,84], [14,71], [15,62], [16,73], [17,82], [18,80], [19, 92], [20, 68], [21,71], [22,70], [23,78], [24, 80], [25,59], [26,74], [27,80], [28,51], [29,67] ]
           }
         ]
       }