Moved related stats in a standalone component
diff --git a/mCordPortal/src/app/components/related-profiles/related-profiles.js b/mCordPortal/src/app/components/related-profiles/related-profiles.js
index 1fd03dc..9fbeddc 100644
--- a/mCordPortal/src/app/components/related-profiles/related-profiles.js
+++ b/mCordPortal/src/app/components/related-profiles/related-profiles.js
@@ -32,7 +32,6 @@
});
const loadProfiles = () => {
- console.log('loadProfiles');
this.model.getProfiles()
.then((profiles) => {
this.profiles = profiles;
diff --git a/mCordPortal/src/app/components/related-stats/related-stats.js b/mCordPortal/src/app/components/related-stats/related-stats.js
new file mode 100644
index 0000000..d40f6cf
--- /dev/null
+++ b/mCordPortal/src/app/components/related-stats/related-stats.js
@@ -0,0 +1,82 @@
+/*
+ * Copyright 2015 Open Networking Laboratory
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+angular.module('mCord')
+ .directive('relatedStats', function () {
+ return {
+ restrict: 'E',
+ templateUrl: 'app/components/related-stats/related-stats.tpl.html',
+ scope: {
+ model: '=',
+ type: '@'
+ },
+ bindToController: true,
+ controllerAs: 'vm',
+ controller: function($scope, $filter, _){
+ $scope.$watch(() => this.model, enode => {
+ if(enode){
+ loadStats();
+ }
+ });
+
+ const loadStats = () => {
+ this.model.getStats()
+ .then((stats) => {
+ this.selectedStats = 'download_data';
+ this.stats = formatStats(stats);
+ });
+ };
+
+ const formatStats = stats => {
+ let series = _.reduce(stats, (list, s) => {
+ return list.concat([s.Profile]);
+ }, []);
+ let labels = _.reduce(stats[0].StatsArray, (list, s) => {
+ return list.concat([$filter('date')(new Date(s.Time * 1000), 'shortTime')]);
+ }, []);
+ const download_data = _.reduce(stats, (list, stat) => {
+ let bitrate = _.reduce(stat.StatsArray, (data, s) => {
+ return data.concat([s.DlBitrate]);
+ }, []);
+ list.push(bitrate);
+ return list;
+ }, []);
+ const upload_data = _.reduce(stats, (list, stat) => {
+ let bitrate = _.reduce(stat.StatsArray, (data, s) => {
+ return data.concat([s.UlBitrate]);
+ }, []);
+ list.push(bitrate);
+ return list;
+ }, []);
+ return {
+ labels: labels,
+ series: series,
+ data: download_data,
+ upload_data: upload_data,
+ download_data: download_data
+ };
+ };
+
+ this.setChart = type => {
+ if(!this.stats){
+ return;
+ }
+ this.selectedStats = type;
+ this.stats.data = this.stats[type];
+ }
+ }
+ };
+ });
diff --git a/mCordPortal/src/app/components/related-stats/related-stats.tpl.html b/mCordPortal/src/app/components/related-stats/related-stats.tpl.html
new file mode 100644
index 0000000..a7aa183
--- /dev/null
+++ b/mCordPortal/src/app/components/related-stats/related-stats.tpl.html
@@ -0,0 +1,14 @@
+<div class="row text-center">
+ <div class="col-xs-6">
+ <a ng-click="vm.setChart('download_data')"
+ ng-class="{active: vm.selectedStats == 'download_data'}"
+ class="btn btn-primary-border">Download</a>
+ </div>
+ <div class="col-xs-6">
+ <a ng-click="vm.setChart('upload_data')"
+ ng-class="{active: vm.selectedStats == 'upload_data'}"
+ class="btn btn-primary-border">Upload</a>
+ </div>
+</div>
+<canvas id="line" class="chart chart-line" chart-data="vm.stats.data"
+ chart-labels="vm.stats.labels" chart-legend="true" chart-series="vm.stats.series"></canvas>
\ No newline at end of file