Developer view first draft
diff --git a/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js b/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js
index 6616b50..c1f08fa 100644
--- a/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js
+++ b/views/ngXosLib/xosHelpers/src/ui_components/smartComponents/smartPie/smartPie.component.js
@@ -187,7 +187,7 @@
`,
bindToController: true,
controllerAs: 'vm',
- controller: function($injector, $timeout, $interval, $scope, _){
+ controller: function($injector, $interval, $scope, $timeout, _){
if(!this.config.resource && !this.config.data){
throw new Error('[xosSmartPie] Please provide a resource or an array of data in the configuration');
@@ -198,11 +198,13 @@
const formatLabels = (data) => angular.isFunction(this.config.labelFormatter) ? this.config.labelFormatter(Object.keys(data)) : Object.keys(data);
const prepareData = (data) => {
- // group data
- let grouped = groupData(data);
- this.data = formatData(grouped);
- // create labels
- this.labels = formatLabels(grouped);
+ // $timeout(() => {
+ // group data
+ let grouped = groupData(data);
+ this.data = formatData(grouped);
+ // create labels
+ this.labels = formatLabels(grouped);
+ // }, 10);
}
if(this.config.resource){
@@ -234,6 +236,14 @@
}, true);
}
+ $scope.$on('create', function (event, chart) {
+ console.log(`create: ${chart.id}`);
+ });
+
+ $scope.$on('destroy', function (event, chart) {
+ console.log(`destroy: ${chart.id}`);
+ });
+
}
};
});
diff --git a/views/ngXosViews/developer/gulp/build.js b/views/ngXosViews/developer/gulp/build.js
index b90ff38..f86af0f 100644
--- a/views/ngXosViews/developer/gulp/build.js
+++ b/views/ngXosViews/developer/gulp/build.js
@@ -98,8 +98,8 @@
gulp.task('copyHtml', function(){
return gulp.src(options.src + 'index.html')
// remove dev dependencies from html
- .pipe(replace(/<!-- bower:css -->(\n.*)*\n<!-- endbower --><!-- endcss -->/, ''))
- .pipe(replace(/<!-- bower:js -->(\n.*)*\n<!-- endbower --><!-- endjs -->/, ''))
+ .pipe(replace(/<!-- bower:css -->(\n^<link.*)*\n<!-- endbower -->/gmi, ''))
+ .pipe(replace(/<!-- bower:js -->(\n^<script.*)*\n<!-- endbower -->/gmi, ''))
// injecting minified files
.pipe(
inject(
diff --git a/views/ngXosViews/developer/src/js/main.js b/views/ngXosViews/developer/src/js/main.js
index c4ddcd8..5cb919b 100644
--- a/views/ngXosViews/developer/src/js/main.js
+++ b/views/ngXosViews/developer/src/js/main.js
@@ -23,14 +23,17 @@
bindToController: true,
controllerAs: 'vm',
templateUrl: 'templates/developer-dashboard.tpl.html',
- controller: function($timeout, SlicesPlus, _){
+ controller: function($scope, $timeout, SlicesPlus, Instances, _){
this.instancePerSliceConfig = {
- resource: 'Instances',
+ data: [],
groupBy: 'slice',
legend: true,
+ classes: 'instance per slice',
labelFormatter: (labels) => {
- return labels.map(l => _.find(this.slices, {id: parseInt(l)}).name);
+ return labels.map(l => {
+ return _.find(this.slices, {id: parseInt(l)}).name
+ });
}
};
@@ -38,12 +41,14 @@
data: [],
groupBy: 'site',
legend: true,
+ classes: 'instance per site',
};
this.networkPerSliceConfig = {
data: [],
groupBy: 'name',
legend: true,
+ classes: 'network per slice',
};
this.tableConfig = {
@@ -82,13 +87,17 @@
// retrieving user list
SlicesPlus.query().$promise
- .then(slices => {
+ .then((slices) => {
+ this.slices = slices;
+ return Instances.query().$promise
+ })
+ .then(instances => {
// formatting data in this way sucks.
// Provide a way to just pass data to the chart if needed [smartPie].
// retrieving network per slices
- let networkPerSlice = _.reduce(slices, (list, s) => {
+ let networkPerSlice = _.reduce(this.slices, (list, s) => {
if( s.networks.length > 1){
// push s.neworks.length values in array
for(let i = 0; i < s.networks.length; i++){
@@ -102,7 +111,7 @@
}, []);
// retrieving instance distribution across sites
- let instancePerSite = _.reduce(slices, (list, s) => {
+ let instancePerSite = _.reduce(this.slices, (list, s) => {
_.forEach(Object.keys(s.instance_distribution), k => {
for(let i = 0; i < s.instance_distribution[k]; i++){
list.push({site: k, instance: i})
@@ -113,12 +122,10 @@
this.sites = Object.keys(_.groupBy(instancePerSite, 'site'));
- $timeout(() => {
- this.instancePerSiteConfig.data = instancePerSite;
- this.networkPerSliceConfig.data = networkPerSlice;
- }, 0);
+ this.instancePerSliceConfig.data = instances;
+ this.instancePerSiteConfig.data = instancePerSite;
+ this.networkPerSliceConfig.data = networkPerSlice;
- this.slices = slices;
})
.catch((e) => {
throw new Error(e);
diff --git a/views/ngXosViews/developer/src/templates/developer-dashboard.tpl.html b/views/ngXosViews/developer/src/templates/developer-dashboard.tpl.html
index f1688fb..fd82f77 100644
--- a/views/ngXosViews/developer/src/templates/developer-dashboard.tpl.html
+++ b/views/ngXosViews/developer/src/templates/developer-dashboard.tpl.html
@@ -1,13 +1,13 @@
<div class="row">
- <div ng-class="{'col-sm-4': vm.sites.length > 1, 'col-sm-6': vm.sites.length <= 1}" class="text-center">
+ <div ng-class="{'col-sm-4': vm.sites.length > 1 || !vm.sites, 'col-sm-6': vm.sites.length <= 1}" class="text-center">
<h3>Instances per Slice</h3>
- <xos-smart-pie ng-if="vm.slices" config="vm.instancePerSliceConfig"></xos-smart-pie>
+ <xos-smart-pie ng-if="vm.instancePerSliceConfig.data.length > 0" config="vm.instancePerSliceConfig"></xos-smart-pie>
</div>
<div ng-if="vm.sites.length > 1" class="col-sm-4 text-center">
<h3>Instances per Site</h3>
<xos-smart-pie ng-if="vm.instancePerSiteConfig.data.length > 0" config="vm.instancePerSiteConfig"></xos-smart-pie>
</div>
- <div ng-class="{'col-sm-4': vm.sites.length > 1, 'col-sm-6': vm.sites.length <= 1}" class="text-center">
+ <div ng-class="{'col-sm-4': vm.sites.length > 1 || !vm.sites, 'col-sm-6': vm.sites.length <= 1}" class="text-center">
<h3>Network per Slice</h3>
<xos-smart-pie ng-if="vm.networkPerSliceConfig.data.length > 0" config="vm.networkPerSliceConfig"></xos-smart-pie>
</div>