Merge branch 'master' of github.com:jermowery/xos into AddVPNService
diff --git a/views/ngXosLib/README.md b/views/ngXosLib/README.md
index 0166efd..cfce430 100644
--- a/views/ngXosLib/README.md
+++ b/views/ngXosLib/README.md
@@ -51,6 +51,8 @@
 
 >_NOTE: for the API related service, check documentation in [Apigen](#apigen) section._
 
+When some changes are applied to this common library it should be rebuilt with: `npm run build`
+
 ### Yo Xos
 
 We have created a [yeoman](http://yeoman.io/) generator to help you scaffolding views.
diff --git a/views/ngXosLib/karma.conf.js b/views/ngXosLib/karma.conf.js
index b75f95b..d4137a0 100644
--- a/views/ngXosLib/karma.conf.js
+++ b/views/ngXosLib/karma.conf.js
@@ -11,6 +11,15 @@
   return path.relative(process.cwd(), file);
 });
 
+var files = bowerComponents.concat([
+  'api/**/*.js',
+  'xosHelpers/src/*.module.js',
+  'xosHelpers/src/**/*.js',
+  'xosHelpers/spec/**/*.test.js'
+]);
+
+console.log('files', files)
+
 module.exports = function(config) {
 /*eslint-enable*/
   config.set({
@@ -25,11 +34,7 @@
 
 
     // list of files / patterns to load in the browser
-    files: bowerComponents.concat([
-      'xosHelpers/src/*.module.js',
-      'xosHelpers/src/**/*.js',
-      'xosHelpers/spec/**/*.test.js',
-    ]),
+    files: files,
 
 
     // list of files to exclude
@@ -40,15 +45,24 @@
     // preprocess matching files before serving them to the browser
     // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
     preprocessors: {
-      '**/*.test.js': ['babel'],
-      'src/**/*.html': ['ng-html2js']
+      '**/*.test.js': ['babel']
     },
 
-    ngHtml2JsPreprocessor: {
-      stripPrefix: 'src/', //strip the src path from template url (http://stackoverflow.com/questions/22869668/karma-unexpected-request-when-testing-angular-directive-even-with-ng-html2js)
-      moduleName: 'templates' // define the template module name
+    babelPreprocessor: {
+      options: {
+        presets: ['es2015'],
+        sourceMap: 'inline'
+      },
+      filename: function (file) {
+        return file.originalPath;
+      },
     },
 
+    //ngHtml2JsPreprocessor: {
+    //  stripPrefix: 'src/', //strip the src path from template url (http://stackoverflow.com/questions/22869668/karma-unexpected-request-when-testing-angular-directive-even-with-ng-html2js)
+    //  moduleName: 'templates' // define the template module name
+    //},
+
     // test results reporter to use
     // possible values: 'dots', 'progress'
     // available reporters: https://npmjs.org/browse/keyword/karma-reporter
@@ -65,7 +79,7 @@
 
     // level of logging
     // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
-    logLevel: config.LOG_DEBUG,
+    logLevel: config.LOG_INFO,
 
 
     // enable / disable watching file and executing tests whenever any file changes
@@ -74,7 +88,7 @@
 
     // start these browsers
     // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
-    browsers: ['PhantomJS'],
+    browsers: ['PhantomJS', 'Chrome'],
 
 
     // Continuous Integration mode
diff --git a/views/ngXosLib/package.json b/views/ngXosLib/package.json
index 9e13e28..b2d092d 100644
--- a/views/ngXosLib/package.json
+++ b/views/ngXosLib/package.json
@@ -8,14 +8,14 @@
     "apigen": "node xos-resource-generator.js",
     "swagger": "node xos-swagger-def.js",
     "apidoc": "jsdoc api/ng-xos.js api/ng-xoslib.js api/ng-hpcapi.js -d api/docs",
-    "build": "gulp vendor"
+    "build": "gulp vendor && gulp helpers"
   },
   "author": "Matteo Scandolo",
   "license": "ISC",
   "dependencies": {
     "bluebird": "^3.0.5",
     "chalk": "^1.1.1",
-    "concat": "^1.0.0",
+    "concat": "^2.0.0",
     "eslint": "^1.8.0",
     "eslint-plugin-angular": "linkmesrl/eslint-plugin-angular",
     "fetch-swagger-schema": "^0.1.2",
@@ -23,6 +23,7 @@
     "swagger-js-codegen": "^1.1.5"
   },
   "devDependencies": {
+    "babel-preset-es2015": "^6.6.0",
     "gulp": "^3.9.0",
     "gulp-angular-filesort": "^1.1.1",
     "gulp-concat": "^2.6.0",
@@ -31,6 +32,7 @@
     "jasmine-core": "^2.4.1",
     "karma": "^0.13.19",
     "karma-babel-preprocessor": "^6.0.1",
+    "karma-chrome-launcher": "^0.2.3",
     "karma-jasmine": "^0.3.6",
     "karma-mocha-reporter": "^1.1.3",
     "karma-ng-html2js-preprocessor": "^0.2.0",
diff --git a/views/ngXosLib/xosHelpers/spec/csrftoken.test.js b/views/ngXosLib/xosHelpers/spec/csrftoken.test.js
index e49c52b..443034d 100644
--- a/views/ngXosLib/xosHelpers/spec/csrftoken.test.js
+++ b/views/ngXosLib/xosHelpers/spec/csrftoken.test.js
@@ -1,22 +1,36 @@
 'use strict';
-
 describe('The xos.helper module', function(){
-  
-  var app, httpProvider;
+  var SetCSRFToken, httpProviderObj;
 
-  beforeEach(module('xos.helpers'));
+  //beforeEach(module('xos.helpers'));
+  //
+  //beforeEach(inject(function($httpProvider){
+  //  httpProviderObj = $httpProvider;
+  //}));
+  //
+  //beforeEach(inject(function(_SetCSRFToken_){
+  //  console.log('inject csrf');
+  //  SetCSRFToken = _SetCSRFToken_;
+  //}));
 
-  beforeEach(function(){
-    module(function(_$httpProvider_){
-      console.log('beforeEach');
-      httpProvider = _$httpProvider_;
+  beforeEach(function() {
+    module('xos.helpers', function ($httpProvider) {
+      //save our interceptor
+      httpProviderObj = $httpProvider;
     });
+
+    inject(function (_SetCSRFToken_) {
+      SetCSRFToken = _SetCSRFToken_;
+    })
   });
 
-  it('should set SetCSRFToken interceptor', inject(function($http){
-    console.log('httpProvider',httpProvider);
-    expect(true).toBeTrue();
-    // expect(httpProvider.interceptors).toContain('SetCSRFToken');
-  }));
+  it('should exist', () => {
+    expect(SetCSRFToken).toBeDefined();
+  });
+  
+  it('should set SetCSRFToken interceptor', () => {
+    expect(httpProviderObj).toBeDefined();
+    expect(httpProviderObj.interceptors).toContain('SetCSRFToken');
+  });
 
 });
\ No newline at end of file
diff --git a/views/ngXosLib/xosHelpers/src/services/csrfToken.interceptor.js b/views/ngXosLib/xosHelpers/src/services/csrfToken.interceptor.js
index 283e90d..f3a234e 100644
--- a/views/ngXosLib/xosHelpers/src/services/csrfToken.interceptor.js
+++ b/views/ngXosLib/xosHelpers/src/services/csrfToken.interceptor.js
@@ -1,6 +1,8 @@
 (function() {
     'use strict';
 
+    console.log('SetCSRFToken');
+
     angular
         .module('xos.helpers')
         .factory('SetCSRFToken', setCSRFToken);
diff --git a/views/ngXosLib/xosHelpers/src/xosHelpers.module.js b/views/ngXosLib/xosHelpers/src/xosHelpers.module.js
index d5b53da..abbf012 100644
--- a/views/ngXosLib/xosHelpers/src/xosHelpers.module.js
+++ b/views/ngXosLib/xosHelpers/src/xosHelpers.module.js
@@ -1,6 +1,6 @@
 (function() {
     'use strict';
-
+    console.log('XOS Helpers Module')
     angular.module('bugSnag', []).factory('$exceptionHandler', function () {
       return function (exception, cause) {
         if( window.Bugsnag ){
@@ -15,14 +15,15 @@
     angular
         .module('xos.helpers',[
           'ngCookies',
+          'ngResource',
           'xos.xos',
           'xos.hpcapi',
           'xos.xoslib',
-          'bugSnag'
+          'bugSnag',
         ])
         .config(config);
 
-    function config($httpProvider, $interpolateProvider, $resourceProvider) { 
+    function config($httpProvider, $interpolateProvider, $resourceProvider) {
       $httpProvider.interceptors.push('SetCSRFToken');
 
       $interpolateProvider.startSymbol('{$');
diff --git a/views/ngXosViews/ceilometerDashboard/env/default.js b/views/ngXosViews/ceilometerDashboard/env/default.js
index a829f62..d6dcddd 100644
--- a/views/ngXosViews/ceilometerDashboard/env/default.js
+++ b/views/ngXosViews/ceilometerDashboard/env/default.js
@@ -7,7 +7,7 @@
 // (works only for local environment as both application are served on the same domain)
 
 module.exports = {
-  host: 'http://apt088.apt.emulab.net:9999/',
-  xoscsrftoken: 'BunrrI2xqNYwNtCPes1ii7zJAFzgORlW',
-  xossessionid: 'ysq87pq2kp0bvarsu2xkq2kcjy7u2mx1'
+  host: 'http://apt020.apt.emulab.net:9999/',
+  xoscsrftoken: 'Z5RslzJ4IpxQ22c9pLyQalRnMbIGuK6p',
+  xossessionid: '0fqmxa903dhj7pjkwk21lmhako9qgdi8'
 };
diff --git a/views/ngXosViews/ceilometerDashboard/gulp/build.js b/views/ngXosViews/ceilometerDashboard/gulp/build.js
index 7c3aa6d..f49cc1e 100644
--- a/views/ngXosViews/ceilometerDashboard/gulp/build.js
+++ b/views/ngXosViews/ceilometerDashboard/gulp/build.js
@@ -29,7 +29,7 @@
 
 var TEMPLATE_FOOTER = `}]);
 angular.module('xos.ceilometerDashboard').run(function($location){$location.path('/')});
-angular.bootstrap(angular.element('#xosCeilometerDashboard'), ['xos.ceilometerDashboard']);`;
+angular.element(document).ready(function() {angular.bootstrap(angular.element('#xosCeilometerDashboard'), ['xos.ceilometerDashboard']);});`;
 
 module.exports = function(options){
   
@@ -71,7 +71,7 @@
     .pipe(ngAnnotate())
     .pipe(angularFilesort())
     .pipe(concat('xosCeilometerDashboard.js'))
-    .pipe(uglify())
+    //.pipe(uglify())
     .pipe(gulp.dest(options.static + 'js/'));
   });
 
diff --git a/views/ngXosViews/ceilometerDashboard/karma.conf.js b/views/ngXosViews/ceilometerDashboard/karma.conf.js
index 1978cbd..cbc5a83 100644
--- a/views/ngXosViews/ceilometerDashboard/karma.conf.js
+++ b/views/ngXosViews/ceilometerDashboard/karma.conf.js
@@ -26,8 +26,10 @@
     // list of files / patterns to load in the browser
     files: bowerComponents.concat([
       'src/css/**/*.css',
-      '../../../xos/core/xoslib/static/js/xosApi.js',
+      '../../../xos/core/xoslib/static/js/vendor/ngXosVendor.js',
       '../../../xos/core/xoslib/static/js/vendor/ngXosHelpers.js',
+      '../../../xos/core/xoslib/static/js/xosApi.js',
+      'src/js/main.js',
       'src/js/**/*.js',
       'spec/**/*.mock.js',
       'spec/**/*.test.js',
diff --git a/views/ngXosViews/ceilometerDashboard/spec/backend.mock.js b/views/ngXosViews/ceilometerDashboard/spec/backend.mock.js
index 86ed3d8..2908041 100644
--- a/views/ngXosViews/ceilometerDashboard/spec/backend.mock.js
+++ b/views/ngXosViews/ceilometerDashboard/spec/backend.mock.js
@@ -26,42 +26,42 @@
     {
       meter: 'cpu',
       resource_name: 'fakeName',
-      project_id: 'fakeTenant',
+      resource_id: 'fakeTenant',
       timestamp: '2015-12-15T00:34:08',
       volume: 110
     },
     {
       meter: 'cpu',
       resource_name: 'fakeName',
-      project_id: 'fakeTenant',
+      resource_id: 'fakeTenant',
       timestamp: '2015-12-15T00:44:08',
       volume: 120
     },
     {
       meter: 'cpu',
       resource_name: 'anotherName',
-      project_id: 'anotherTenant',
+      resource_id: 'anotherTenant',
       timestamp: '2015-12-15T00:24:08',
       volume: 210
     },
     {
       meter: 'cpu',
       resource_name: 'anotherName',
-      project_id: 'anotherTenant',
+      resource_id: 'anotherTenant',
       timestamp: '2015-12-15T00:34:08',
       volume: 220
     },
     {
       meter: 'cpu',
       resource_name: 'anotherName',
-      project_id: 'anotherTenant',
+      resource_id: 'anotherTenant',
       timestamp: '2015-12-15T00:44:08',
       volume: 230
     },
     {
       meter: 'cpu',
       resource_name: 'thirdName',
-      project_id: 'thirdTenant',
+      resource_id: 'thirdTenant',
       timestamp: '2015-12-15T00:44:08',
       volume: 310
     }
@@ -70,7 +70,7 @@
   const mapping = [
     {
       service: 'service-a',
-      slice: [
+      slices: [
         {
           project_id: 'id-a-1',
           slice: 'slice-a-1'
@@ -83,7 +83,7 @@
     },
     {
       service: 'service-b',
-      slice: [
+      slices: [
         {
           project_id: 'id-b-1',
           slice: 'slice-b-1'
diff --git a/views/ngXosViews/ceilometerDashboard/spec/ceilometer.test.js b/views/ngXosViews/ceilometerDashboard/spec/ceilometer.test.js
index cbd8ca0..933f892 100644
--- a/views/ngXosViews/ceilometerDashboard/spec/ceilometer.test.js
+++ b/views/ngXosViews/ceilometerDashboard/spec/ceilometer.test.js
@@ -21,31 +21,17 @@
       httpBackend.flush();
     }));
 
-    xdescribe('when loading meters', () => {
-      it('should group meters by services', () => {
-        expect(Object.keys(vm.projects).length).toBe(2);
-      });
-
-      it('should group services by slices', () => {
-        expect(Object.keys(vm.projects.service_2).length).toBe(2);
-      });
-
-      it('should group slices by resources', () => {
-        expect(Object.keys(vm.projects.service_2.slice_2).length).toBe(2);
-      });
-    });
-
     describe('when loading service list', () => {
       it('should append the list to the scope', () => {
         expect(vm.services.length).toBe(2);
-        expect(vm.services[0].slice.length).toBe(2);
-        expect(vm.services[1].slice.length).toBe(2);
+        expect(vm.services[0].slices.length).toBe(2);
+        expect(vm.services[1].slices.length).toBe(2);
       });
     });
 
     describe('when a slice is selected', () => {
       it('should load corresponding meters', () => {
-        vm.loadSliceMeter(vm.services[0].slice[0]);
+        vm.loadSliceMeter(vm.services[0].slices[0]);
 
         httpBackend.flush();
 
@@ -89,7 +75,7 @@
       expect(vm.chart.data[0].length).toBe(2);
       expect(vm.chart.data[0][0]).toBe(110);
       expect(vm.chart.data[0][1]).toBe(120);
-      expect(vm.chartMeters[0].project_id).toBe('fakeTenant')
+      expect(vm.chartMeters[0].resource_id).toBe('fakeTenant')
       expect(vm.chartMeters[0].resource_name).toBe('fakeName')
     });
 
@@ -100,7 +86,7 @@
       expect(vm.chart.data[1][0]).toBe(210);
       expect(vm.chart.data[1][1]).toBe(220);
       expect(vm.chart.data[1][2]).toBe(230);
-      expect(vm.chartMeters[1].project_id).toBe('anotherTenant')
+      expect(vm.chartMeters[1].resource_id).toBe('anotherTenant')
       expect(vm.chartMeters[1].resource_name).toBe('anotherName')
     });
 
@@ -112,7 +98,7 @@
       expect(vm.chart.data[0][0]).toBe(210);
       expect(vm.chart.data[0][1]).toBe(220);
       expect(vm.chart.data[0][2]).toBe(230);
-      expect(vm.chartMeters[0].project_id).toBe('anotherTenant')
+      expect(vm.chartMeters[0].resource_id).toBe('anotherTenant')
       expect(vm.chartMeters[0].resource_name).toBe('anotherName')
     });
 
@@ -120,10 +106,10 @@
       it('should create an array of unique labels', () => {
         // unique because every resource has multiple samples (time-series)
         const samples = [
-          {project_id: 1, resource_name: 'fakeName'},
-          {project_id: 1, resource_name: 'fakeName'},
-          {project_id: 2, resource_name: 'anotherName'},
-          {project_id: 2, resource_name: 'anotherName'}
+          {resource_id: 1, resource_name: 'fakeName'},
+          {resource_id: 1, resource_name: 'fakeName'},
+          {resource_id: 2, resource_name: 'anotherName'},
+          {resource_id: 2, resource_name: 'anotherName'}
         ];
 
         const result = vm.formatSamplesLabels(samples);
diff --git a/views/ngXosViews/ceilometerDashboard/src/index.html b/views/ngXosViews/ceilometerDashboard/src/index.html
index 6363764..be59e4b 100644
--- a/views/ngXosViews/ceilometerDashboard/src/index.html
+++ b/views/ngXosViews/ceilometerDashboard/src/index.html
@@ -38,4 +38,8 @@
 <script src="/api/ng-xos.js"></script>
 <script src="/api/ng-hpcapi.js"></script>
 <script src="/.tmp/main.js"></script>
+<script src="/.tmp/stats.directive.js"></script>
+<script src="/.tmp/samples.directive.js"></script>
+<script src="/.tmp/rest.js"></script>
+<script src="/.tmp/dashboard.directive.js"></script>
 <!-- endinject -->
diff --git a/views/ngXosViews/ceilometerDashboard/src/js/dashboard.directive.js b/views/ngXosViews/ceilometerDashboard/src/js/dashboard.directive.js
new file mode 100644
index 0000000..a051350
--- /dev/null
+++ b/views/ngXosViews/ceilometerDashboard/src/js/dashboard.directive.js
@@ -0,0 +1,162 @@
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard')
+    .directive('ceilometerDashboard', function(lodash){
+      return {
+        restrict: 'E',
+        scope: {},
+        bindToController: true,
+        controllerAs: 'vm',
+        templateUrl: 'templates/ceilometer-dashboard.tpl.html',
+        controller: function(Ceilometer){
+
+          this.showStats = false;
+
+          // this open the accordion
+          this.accordion = {
+            open: {}
+          };
+
+          /**
+           * Open the active panel base on the service stored values
+           */
+          this.openPanels = () => {
+            if(Ceilometer.selectedService){
+              this.accordion.open[Ceilometer.selectedService] = true;
+              if(Ceilometer.selectedSlice){
+                this.loadSliceMeter(Ceilometer.selectedSlice, Ceilometer.selectedService);
+                this.selectedSlice = Ceilometer.selectedSlice;
+                if(Ceilometer.selectedResource){
+                  this.selectedResource = Ceilometer.selectedResource;
+                }
+              }
+            }
+          };
+
+          /**
+           * Load the list of service and slices
+           */
+          this.loadMappings = () => {
+            this.loader = true;
+            Ceilometer.getMappings()
+              .then((services) => {
+
+                // rename thing in UI
+                services.map((service) => {
+                  if(service.service === 'service_ONOS_vBNG'){
+                    service.service = 'ONOS_FABRIC';
+                  }
+                  if(service.service === 'service_ONOS_vOLT'){
+                    service.service = 'ONOS_CORD';
+                  }
+
+                  service.slices.map(s => {
+                    if(s.slice === 'mysite_onos_volt'){
+                      s.slice = 'ONOS_CORD';
+                    }
+                    if(s.slice === 'mysite_onos_vbng'){
+                      s.slice = 'ONOS_FABRIC';
+                    }
+                    if(s.slice === 'mysite_vbng'){
+                      s.slice = 'mysite_vRouter';
+                    }
+                  });
+
+                  return service;
+                });
+                // end rename thing in UI
+
+                this.services = services;
+                this.openPanels();
+              })
+              .catch(err => {
+                this.error = (err.data && err.data.detail) ? err.data.detail : 'An Error occurred. Please try again later.';
+              })
+              .finally(() => {
+                this.loader = false;
+              });
+          };
+
+          this.loadMappings();
+
+          /**
+           * Load the list of a single slice
+           */
+          this.loadSliceMeter = (slice, service_name) => {
+
+            Ceilometer.selectedSlice = null;
+            Ceilometer.selectedService = null;
+            Ceilometer.selectedResources = null;
+
+            // visualization info
+            this.loader = true;
+            this.error = null;
+            this.ceilometerError = null;
+
+            Ceilometer.getMeters({tenant: slice.project_id})
+              .then((sliceMeters) => {
+                this.selectedSlice = slice.slice;
+                this.selectedTenant = slice.project_id;
+
+                // store the status
+                Ceilometer.selectedSlice = slice;
+                Ceilometer.selectedService = service_name;
+
+                // rename things in UI
+                sliceMeters.map(m => {
+                  m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
+                  m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
+                  m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
+                  return m;
+                });
+                // end rename things in UI
+
+                this.selectedResources = lodash.groupBy(sliceMeters, 'resource_name');
+
+                // hacky
+                if(Ceilometer.selectedResource){
+                  this.selectedMeters = this.selectedResources[Ceilometer.selectedResource];
+                }
+              })
+              .catch(err => {
+
+                // this means that ceilometer is not yet ready
+                if(err.status === 503){
+                  return this.ceilometerError = err.data.detail.specific_error;
+                }
+
+                this.ceilometerError = (err.data && err.data.detail && err.data.detail.specific_error) ? err.data.detail.specific_error : 'An Error occurred. Please try again later.';
+              })
+              .finally(() => {
+                this.loader = false;
+              });
+          };
+
+          /**
+           * Select Meters for a resource
+           *
+           * @param Array meters The list of selected resources
+           * @returns void
+           */
+          this.selectedMeters = null;
+          this.selectMeters = (meters, resource) => {
+            this.selectedMeters = meters;
+
+            Ceilometer.selectedResource = resource;
+            this.selectedResource = resource;
+          }
+
+        }
+      };
+    })
+})();
+
diff --git a/views/ngXosViews/ceilometerDashboard/src/js/main.js b/views/ngXosViews/ceilometerDashboard/src/js/main.js
index 4023396..26cdcbc 100644
--- a/views/ngXosViews/ceilometerDashboard/src/js/main.js
+++ b/views/ngXosViews/ceilometerDashboard/src/js/main.js
@@ -30,410 +30,4 @@
   $rootScope.$on('$stateChangeStart', (event, toState) => {
     $rootScope.stateName = toState.name;
   })
-})
-.service('Ceilometer', function($http, $q){
-
-  this.getMappings = () => {
-    let deferred = $q.defer();
-
-    $http.get('/xoslib/xos-slice-service-mapping/')
-    .then((res) => {
-      deferred.resolve(res.data)
-    })
-    .catch((e) => {
-      deferred.reject(e);
-    });
-
-    return deferred.promise;
-  }
-
-  this.getMeters = (params) => {
-    let deferred = $q.defer();
-
-    $http.get('/xoslib/meters/', {cache: true, params: params})
-    // $http.get('../meters_mock.json', {cache: true})
-    .then((res) => {
-      deferred.resolve(res.data)
-    })
-    .catch((e) => {
-      deferred.reject(e);
-    });
-
-    return deferred.promise;
-  }
-
-  this.getSamples = (name, tenant) => {
-    let deferred = $q.defer();
-
-    $http.get(`/xoslib/metersamples/`, {params: {meter: name, tenant: tenant}})
-    .then((res) => {
-      deferred.resolve(res.data)
-    })
-    .catch((e) => {
-      deferred.reject(e);
-    });
-
-    return deferred.promise;
-  }
-
-  this.getStats = (options) => {
-    let deferred = $q.defer();
-
-    $http.get('/xoslib/meterstatistics/', {cache: true, params: options})
-    // $http.get('../stats_mock.son', {cache: true})
-    .then((res) => {
-      deferred.resolve(res.data);
-    })
-    .catch((e) => {
-      deferred.reject(e);
-    });
-
-    return deferred.promise;
-  };
-
-  // hold dashboard status (opened service, slice, resource)
-  this.selectedService = null;
-  this.selectedSlice = null;
-  this.selectedResource = null;
-})
-.directive('ceilometerDashboard', function(lodash){
-  return {
-    restrict: 'E',
-    scope: {},
-    bindToController: true,
-    controllerAs: 'vm',
-    templateUrl: 'templates/ceilometer-dashboard.tpl.html',
-    controller: function(Ceilometer){
-
-      this.showStats = false;
-
-      // this open the accordion
-      this.accordion = {
-        open: {}
-      };
-
-      /**
-      * Open the active panel base on the service stored values
-      */
-      this.openPanels = () => {
-        if(Ceilometer.selectedService){
-          this.accordion.open[Ceilometer.selectedService] = true;
-          if(Ceilometer.selectedSlice){
-            this.loadSliceMeter(Ceilometer.selectedSlice, Ceilometer.selectedService);
-            this.selectedSlice = Ceilometer.selectedSlice;
-            if(Ceilometer.selectedResource){
-              this.selectedResource = Ceilometer.selectedResource;
-            }
-          }
-        }
-      }
-
-      /**
-      * Load the list of service and slices
-      */
-
-      this.loadMappings = () => {
-        this.loader = true;
-        Ceilometer.getMappings()
-        .then((services) => {
-
-          // rename thing in UI
-          services.map((service) => {
-            if(service.service === 'service_ONOS_vBNG'){
-              service.service = 'ONOS_FABRIC';
-            }
-            if(service.service === 'service_ONOS_vOLT'){
-              service.service = 'ONOS_CORD';
-            }
-
-            service.slices.map(s => {
-              if(s.slice === 'mysite_onos_volt'){
-                s.slice = 'ONOS_CORD';
-              }
-              if(s.slice === 'mysite_onos_vbng'){
-                s.slice = 'ONOS_FABRIC';
-              }
-              if(s.slice === 'mysite_vbng'){
-                s.slice = 'mysite_vRouter';
-              }
-            });
-
-            return service;
-          });
-          // end rename thing in UI
-          
-          this.services = services;
-          this.openPanels();
-        })
-        .catch(err => {
-          this.error = (err.data && err.data.detail) ? err.data.detail : 'An Error occurred. Please try again later.';
-        })
-        .finally(() => {
-          this.loader = false;
-        });
-      };
-
-      this.loadMappings();
-
-      /**
-      * Load the list of a single slice
-      */
-     
-      this.loadSliceMeter = (slice, service_name) => {
-
-        Ceilometer.selectedSlice = null;
-        Ceilometer.selectedService = null;
-        Ceilometer.selectedResources = null;
-
-        // visualization info
-        this.loader = true;
-        this.error = null;
-        this.ceilometerError = null;
-
-        Ceilometer.getMeters({tenant: slice.project_id})
-        .then((sliceMeters) => {
-          this.selectedSlice = slice.slice;
-          this.selectedTenant = slice.project_id;
-
-          // store the status
-          Ceilometer.selectedSlice = slice;
-          Ceilometer.selectedService = service_name;
-
-          // rename things in UI
-          sliceMeters.map(m => {
-            m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
-            m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
-            m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
-            return m;
-          });
-          // end rename things in UI
-
-          this.selectedResources = lodash.groupBy(sliceMeters, 'resource_name');
-
-          // hacky
-          if(Ceilometer.selectedResource){
-            this.selectedMeters = this.selectedResources[Ceilometer.selectedResource];
-          }
-        })
-        .catch(err => {
-
-          // this means that ceilometer is not yet ready
-          if(err.status === 503){
-            return this.ceilometerError = err.data.detail.specific_error;
-          }
-
-          this.error = (err.data && err.data.detail.specific_error) ? err.data.detail.specific_error : 'An Error occurred. Please try again later.';
-        })
-        .finally(() => {
-          this.loader = false;
-        });
-      };
-
-      /**
-      * Select Meters for a resource
-      *
-      * @param Array meters The list of selected resources
-      * @returns void
-      */
-      this.selectedMeters = null;
-      this.selectMeters = (meters, resource) => {
-        this.selectedMeters = meters;
-
-        Ceilometer.selectedResource = resource;
-        this.selectedResource = resource;
-      }
-
-    }
-  };
-})
-.directive('ceilometerSamples', function(lodash, $stateParams){
-  return {
-    restrict: 'E',
-    scope: {},
-    bindToController: true,
-    controllerAs: 'vm',
-    templateUrl: 'templates/ceilometer-samples.tpl.html',
-    controller: function(Ceilometer) {
-
-      // console.log(Ceilometer.selectResource);
-
-      this.chartColors = [
-        '#286090',
-        '#F7464A',
-        '#46BFBD',
-        '#FDB45C',
-        '#97BBCD',
-        '#4D5360',
-        '#8c4f9f'
-      ];
-
-      this.chart = {
-        series: [],
-        labels: [],
-        data: []
-      }
-
-      Chart.defaults.global.colours = this.chartColors;
-      
-      this.chartType = 'line';
-
-      if($stateParams.name && $stateParams.tenant){
-        this.name = $stateParams.name;
-        this.tenant = $stateParams.tenant;
-        // TODO rename tenant in project_id
-      }
-      else{
-        throw new Error('Missing Name and Tenant Params!');
-      }
-
-      /**
-      * Goes trough the array and format date to be used as labels
-      *
-      * @param Array data
-      * @returns Array a list of labels
-      */
-
-      this.getLabels = (data) => {
-        return data.reduce((list, item) => {
-          let date = new Date(item.timestamp);
-          list.push(`${date.getHours()}:${(date.getMinutes()<10?'0':'') + date.getMinutes()}:${date.getSeconds()}`);
-          return list;
-        }, []);
-      };
-
-      /**
-      * Goes trough the array and return a flat array of values
-      *
-      * @param Array data
-      * @returns Array a list of values
-      */
-
-      this.getData = (data) => {
-        return data.reduce((list, item) => {
-          list.push(item.volume);
-          return list;
-        }, []);
-      }
-
-      /**
-      * Add a samples to the chart
-      *
-      * @param string resource_id
-      */
-      this.chartMeters = [];
-      this.addMeterToChart = (project_id) => {
-        this.chart['labels'] = this.getLabels(lodash.sortBy(this.samplesList[project_id], 'timestamp'));
-        this.chart['series'].push(project_id);
-        this.chart['data'].push(this.getData(lodash.sortBy(this.samplesList[project_id], 'timestamp')));
-        this.chartMeters.push(this.samplesList[project_id][0]); //use the 0 as are all samples for the same resource and I need the name
-        lodash.remove(this.sampleLabels, {id: project_id});
-      }
-
-      this.removeFromChart = (meter) => {
-        this.chart.data.splice(this.chart.series.indexOf(meter.project_id), 1);
-        this.chart.series.splice(this.chart.series.indexOf(meter.project_id), 1);
-        this.chartMeters.splice(lodash.findIndex(this.chartMeters, {project_id: meter.project_id}), 1);
-        this.sampleLabels.push({
-          id: meter.project_id,
-          name: meter.resource_name || meter.project_id
-        })
-      };
-
-      /**
-      * Format samples to create a list of labels and ids
-      */
-     
-      this.formatSamplesLabels = (samples) => {
-
-        return lodash.uniq(samples, 'project_id')
-        .reduce((labels, item) => {
-          labels.push({
-            id: item.project_id,
-            name: item.resource_name || item.project_id
-          });
-
-          return labels;
-        }, []);
-      }
-
-
-      /**
-      * Load the samples and format data
-      */
-
-      this.showSamples = () => {
-        this.loader = true;
-        // Ceilometer.getSamples(this.name, this.tenant) //fetch one
-        Ceilometer.getSamples(this.name) //fetch all
-        .then(res => {
-
-          // rename things in UI
-          res.map(m => {
-            m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
-            m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
-            m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
-            return m;
-          });
-          // end rename things in UI
-
-          // setup data for visualization
-          this.samplesList = lodash.groupBy(res, 'project_id');
-          this.sampleLabels = this.formatSamplesLabels(res);
-          
-          // add current meter to chart
-          this.addMeterToChart(this.tenant);
-
-        })
-        .catch(err => {
-          this.error = err.data.detail;
-        })
-        .finally(() => {
-          this.loader = false;
-        });
-      };
-
-      this.showSamples();
-    }
-  }
-})
-  // NOTE reading this on demand for a single
-.directive('ceilometerStats', function(){
-  return {
-    restrict: 'E',
-    scope: {
-      name: '=name',
-      tenant: '=tenant'
-    },
-    bindToController: true,
-    controllerAs: 'vm',
-    templateUrl: 'templates/ceilometer-stats.tpl.html',
-    controller: function($scope, Ceilometer) {
-
-      this.getStats = (tenant) => {
-        this.loader = true;
-        Ceilometer.getStats({tenant: tenant})
-        .then(res => {
-          res.map(m => {
-            m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
-            m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
-            m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
-            return m;
-          });
-          this.stats = res;
-        })
-        .catch(err => {
-          this.error = err.data;
-        })
-        .finally(() => {
-          this.loader = false;
-        });
-      };
-
-      $scope.$watch(() => this.name, (val) => {
-        if(val){
-          this.getStats(this.tenant);
-        }
-      });
-    }
-  }
-});
\ No newline at end of file
+});
diff --git a/views/ngXosViews/ceilometerDashboard/src/js/rest.js b/views/ngXosViews/ceilometerDashboard/src/js/rest.js
new file mode 100644
index 0000000..24737c3
--- /dev/null
+++ b/views/ngXosViews/ceilometerDashboard/src/js/rest.js
@@ -0,0 +1,79 @@
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard')
+    .service('Ceilometer', function($http, $q){
+
+      this.getMappings = () => {
+        let deferred = $q.defer();
+
+        $http.get('/xoslib/xos-slice-service-mapping/')
+          .then((res) => {
+            deferred.resolve(res.data)
+          })
+          .catch((e) => {
+            deferred.reject(e);
+          });
+
+        return deferred.promise;
+      };
+
+      this.getMeters = (params) => {
+        let deferred = $q.defer();
+
+        $http.get('/xoslib/meters/', {cache: true, params: params})
+          // $http.get('../meters_mock.json', {cache: true})
+          .then((res) => {
+            deferred.resolve(res.data)
+          })
+          .catch((e) => {
+            deferred.reject(e);
+          });
+
+        return deferred.promise;
+      };
+
+      this.getSamples = (name, tenant) => {
+        let deferred = $q.defer();
+
+        $http.get(`/xoslib/metersamples/`, {params: {meter: name, tenant: tenant}})
+          .then((res) => {
+            deferred.resolve(res.data)
+          })
+          .catch((e) => {
+            deferred.reject(e);
+          });
+
+        return deferred.promise;
+      };
+
+      this.getStats = (options) => {
+        let deferred = $q.defer();
+
+        $http.get('/xoslib/meterstatistics/', {cache: true, params: options})
+          // $http.get('../stats_mock.son', {cache: true})
+          .then((res) => {
+            deferred.resolve(res.data);
+          })
+          .catch((e) => {
+            deferred.reject(e);
+          });
+
+        return deferred.promise;
+      };
+
+      // hold dashboard status (opened service, slice, resource)
+      this.selectedService = null;
+      this.selectedSlice = null;
+      this.selectedResource = null;
+    });
+})();
+
diff --git a/views/ngXosViews/ceilometerDashboard/src/js/samples.directive.js b/views/ngXosViews/ceilometerDashboard/src/js/samples.directive.js
new file mode 100644
index 0000000..42b08e5
--- /dev/null
+++ b/views/ngXosViews/ceilometerDashboard/src/js/samples.directive.js
@@ -0,0 +1,164 @@
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard')
+  .directive('ceilometerSamples', function(lodash, $stateParams){
+    return {
+      restrict: 'E',
+      scope: {},
+      bindToController: true,
+      controllerAs: 'vm',
+      templateUrl: 'templates/ceilometer-samples.tpl.html',
+      controller: function(Ceilometer) {
+
+        // console.log(Ceilometer.selectResource);
+
+        this.chartColors = [
+          '#286090',
+          '#F7464A',
+          '#46BFBD',
+          '#FDB45C',
+          '#97BBCD',
+          '#4D5360',
+          '#8c4f9f'
+        ];
+
+        this.chart = {
+          series: [],
+          labels: [],
+          data: []
+        }
+
+        Chart.defaults.global.colours = this.chartColors;
+
+        this.chartType = 'line';
+
+        if($stateParams.name && $stateParams.tenant){
+          this.name = $stateParams.name;
+          this.tenant = $stateParams.tenant;
+          // TODO rename tenant in resource_id
+        }
+        else{
+          throw new Error('Missing Name and Tenant Params!');
+        }
+
+        /**
+         * Goes trough the array and format date to be used as labels
+         *
+         * @param Array data
+         * @returns Array a list of labels
+         */
+
+        this.getLabels = (data) => {
+          return data.reduce((list, item) => {
+            let date = new Date(item.timestamp);
+            list.push(`${date.getHours()}:${(date.getMinutes()<10?'0':'') + date.getMinutes()}:${date.getSeconds()}`);
+            return list;
+          }, []);
+        };
+
+        /**
+         * Goes trough the array and return a flat array of values
+         *
+         * @param Array data
+         * @returns Array a list of values
+         */
+
+        this.getData = (data) => {
+          return data.reduce((list, item) => {
+            list.push(item.volume);
+            return list;
+          }, []);
+        }
+
+        /**
+         * Add a samples to the chart
+         *
+         * @param string resource_id
+         */
+        this.chartMeters = [];
+        this.addMeterToChart = (resource_id) => {
+          this.chart['labels'] = this.getLabels(lodash.sortBy(this.samplesList[resource_id], 'timestamp'));
+          this.chart['series'].push(resource_id);
+          this.chart['data'].push(this.getData(lodash.sortBy(this.samplesList[resource_id], 'timestamp')));
+          this.chartMeters.push(this.samplesList[resource_id][0]); //use the 0 as are all samples for the same resource and I need the name
+          lodash.remove(this.sampleLabels, {id: resource_id});
+        }
+
+        this.removeFromChart = (meter) => {
+          this.chart.data.splice(this.chart.series.indexOf(meter.resource_id), 1);
+          this.chart.series.splice(this.chart.series.indexOf(meter.resource_id), 1);
+          this.chartMeters.splice(lodash.findIndex(this.chartMeters, {resource_id: meter.resource_id}), 1);
+          this.sampleLabels.push({
+            id: meter.resource_id,
+            name: meter.resource_name || meter.resource_id
+          })
+        };
+
+        /**
+         * Format samples to create a list of labels and ids
+         */
+
+        this.formatSamplesLabels = (samples) => {
+
+          return lodash.uniq(samples, 'resource_id')
+            .reduce((labels, item) => {
+              labels.push({
+                id: item.resource_id,
+                name: item.resource_name || item.resource_id
+              });
+
+              return labels;
+            }, []);
+        }
+
+
+        /**
+         * Load the samples and format data
+         */
+
+        this.showSamples = () => {
+          this.loader = true;
+          // Ceilometer.getSamples(this.name, this.tenant) //fetch one
+          Ceilometer.getSamples(this.name) //fetch all
+            .then(res => {
+
+              // rename things in UI
+              res.map(m => {
+                m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
+                m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
+                m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
+                return m;
+              });
+              // end rename things in UI
+
+              // setup data for visualization
+              this.samplesList = lodash.groupBy(res, 'resource_id');
+              this.sampleLabels = this.formatSamplesLabels(res);
+
+              // add current meter to chart
+              this.addMeterToChart(this.tenant);
+
+            })
+            .catch(err => {
+              this.error = err.data.detail;
+            })
+            .finally(() => {
+              this.loader = false;
+            });
+        };
+
+        this.showSamples();
+      }
+    }
+  });
+})();
+
diff --git a/views/ngXosViews/ceilometerDashboard/src/js/stats.directive.js b/views/ngXosViews/ceilometerDashboard/src/js/stats.directive.js
new file mode 100644
index 0000000..7f0b1f8
--- /dev/null
+++ b/views/ngXosViews/ceilometerDashboard/src/js/stats.directive.js
@@ -0,0 +1,54 @@
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard')
+    .directive('ceilometerStats', function(){
+      return {
+        restrict: 'E',
+        scope: {
+          name: '=name',
+          tenant: '=tenant'
+        },
+        bindToController: true,
+        controllerAs: 'vm',
+        templateUrl: 'templates/ceilometer-stats.tpl.html',
+        controller: function($scope, Ceilometer) {
+
+          this.getStats = (tenant) => {
+            this.loader = true;
+            Ceilometer.getStats({tenant: tenant})
+              .then(res => {
+                res.map(m => {
+                  m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
+                  m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
+                  m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
+                  return m;
+                });
+                this.stats = res;
+              })
+              .catch(err => {
+                this.error = err.data;
+              })
+              .finally(() => {
+                this.loader = false;
+              });
+          };
+
+          $scope.$watch(() => this.name, (val) => {
+            if(val){
+              this.getStats(this.tenant);
+            }
+          });
+        }
+      }
+    });
+})();
+
diff --git a/views/ngXosViews/ceilometerDashboard/src/templates/ceilometer-dashboard.tpl.html b/views/ngXosViews/ceilometerDashboard/src/templates/ceilometer-dashboard.tpl.html
index a7a3b9e..2805dbd 100644
--- a/views/ngXosViews/ceilometerDashboard/src/templates/ceilometer-dashboard.tpl.html
+++ b/views/ngXosViews/ceilometerDashboard/src/templates/ceilometer-dashboard.tpl.html
@@ -99,7 +99,8 @@
                     {{meter.unit}}
                   </div>
                   <div class="col-xs-3">
-                    <a ui-sref="samples({name: meter.name, tenant: meter.project_id})" class="btn btn-primary">
+                    <!-- tenant: meter.resource_id -->
+                    <a ui-sref="samples({name: meter.name, tenant: meter.resource_id})" class="btn btn-primary">
                       <i class="glyphicon glyphicon-search"></i>
                     </a>
                   </div>
diff --git a/views/ngXosViews/contentProvider/karma.conf.js b/views/ngXosViews/contentProvider/karma.conf.js
index 83d3f63..b4d5d33 100644
--- a/views/ngXosViews/contentProvider/karma.conf.js
+++ b/views/ngXosViews/contentProvider/karma.conf.js
@@ -26,8 +26,9 @@
 
     // list of files / patterns to load in the browser
     files: bowerComponents.concat([
-      '../../static/js/xosApi.js',
-      '../../static/js/vendor/ngXosHelpers.js',
+      '../../../xos/core/xoslib/static/js/vendor/ngXosVendor.js',
+      '../../../xos/core/xoslib/static/js/vendor/ngXosHelpers.js',
+      '../../../xos/core/xoslib/static/js/xosApi.js',
       'src/js/**/*.js',
       'spec/**/*.mock.js',
       'spec/**/*.test.js',
diff --git a/views/ngXosViews/contentProvider/package.json b/views/ngXosViews/contentProvider/package.json
index 80d34f9..ee09c4c 100644
--- a/views/ngXosViews/contentProvider/package.json
+++ b/views/ngXosViews/contentProvider/package.json
@@ -21,25 +21,34 @@
   "devDependencies": {
     "browser-sync": "^2.9.11",
     "del": "^2.0.2",
+    "eslint": "^1.8.0",
+    "eslint-plugin-angular": "linkmesrl/eslint-plugin-angular",
     "gulp": "^3.9.0",
     "gulp-angular-filesort": "^1.1.1",
     "gulp-angular-templatecache": "^1.8.0",
     "gulp-babel": "^5.3.0",
     "gulp-concat": "^2.6.0",
+    "gulp-eslint": "^1.0.0",
     "gulp-inject": "^3.0.0",
     "gulp-minify-html": "^1.0.4",
+    "gulp-ng-annotate": "^1.1.0",
     "gulp-rename": "^1.2.2",
     "gulp-replace": "^0.5.4",
     "gulp-uglify": "^1.4.2",
     "http-proxy": "^1.12.0",
+    "jasmine-core": "^2.4.1",
+    "karma": "^0.13.22",
+    "karma-babel-preprocessor": "~5.2.2",
+    "karma-coverage": "^0.5.3",
+    "karma-jasmine": "~0.3.6",
+    "karma-mocha-reporter": "~1.1.1",
+    "karma-ng-html2js-preprocessor": "^0.2.0",
+    "karma-phantomjs-launcher": "~0.2.1",
+    "lodash": "^3.10.1",
+    "phantomjs": "^2.1.3",
     "proxy-middleware": "^0.15.0",
     "run-sequence": "^1.1.4",
     "wiredep": "^3.0.0-beta",
-    "wrench": "^1.5.8",
-    "gulp-ng-annotate": "^1.1.0",
-    "lodash": "^3.10.1",
-    "eslint": "^1.8.0",
-    "eslint-plugin-angular": "linkmesrl/eslint-plugin-angular",
-    "gulp-eslint": "^1.0.0"
+    "wrench": "^1.5.8"
   }
 }
diff --git a/views/ngXosViews/contentProvider/spec/sample.test.js b/views/ngXosViews/contentProvider/spec/sample.test.js
deleted file mode 100644
index 177bc7d..0000000
--- a/views/ngXosViews/contentProvider/spec/sample.test.js
+++ /dev/null
@@ -1,37 +0,0 @@
-'use strict';
-
-describe('The User List', () => {
-  
-  var scope, element, isolatedScope, httpBackend;
-
-  beforeEach(module('xos.contentProvider'));
-  beforeEach(module('templates'));
-
-  beforeEach(inject(function($httpBackend, $compile, $rootScope){
-    
-    httpBackend = $httpBackend;
-    // Setting up mock request
-    $httpBackend.expectGET('/xos/users/?no_hyperlinks=1').respond([
-      {
-        email: 'matteo.scandolo@link-me.it',
-        firstname: 'Matteo',
-        lastname: 'Scandolo' 
-      }
-    ]);
-  
-    scope = $rootScope.$new();
-    element = angular.element('<users-list></users-list>');
-    $compile(element)(scope);
-    scope.$digest();
-    isolatedScope = element.isolateScope().vm;
-  }));
-
-  it('should load 1 users', () => {
-    httpBackend.flush();
-    expect(isolatedScope.users.length).toBe(1);
-    expect(isolatedScope.users[0].email).toEqual('matteo.scandolo@link-me.it');
-    expect(isolatedScope.users[0].firstname).toEqual('Matteo');
-    expect(isolatedScope.users[0].lastname).toEqual('Scandolo');
-  });
-
-});
\ No newline at end of file
diff --git a/xos/configurations/acord/Makefile b/xos/configurations/acord/Makefile
index 6d5a04f..b5b93fa 100644
--- a/xos/configurations/acord/Makefile
+++ b/xos/configurations/acord/Makefile
@@ -83,7 +83,7 @@
 	make -C ../../../containers/synchronizer
 
 devstack_images:
-	bash -c "source ../setup/admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || ! mkdir -p /opt/stack/images || ! wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.qcow2 -P /opt/stack/images || glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /opt/stack/images/ceilometer-trusty-server-multi-nic.qcow2 --container-format bare"
+	bash -c "source ../setup/admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || ! mkdir -p /opt/stack/images || ! wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.compressed.qcow2 -P /opt/stack/images || glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /opt/stack/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 --container-format bare"
 
 cloudlab_ceilometer_custom_images:
-	bash -c "source ../setup/admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || ! mkdir -p /tmp/images || ! wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.qcow2 -P /tmp/images || glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /tmp/images/ceilometer-trusty-server-multi-nic.qcow2 --container-format bare"
+	bash -c "source ../setup/admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || if test -f /proj/xos-PG0/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 ; then glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /proj/xos-PG0/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 --container-format bare ; else mkdir -p /tmp/images && wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.compressed.qcow2 -P /tmp/images && glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /tmp/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 --container-format bare ; fi "
diff --git a/xos/configurations/common/devstack/local.conf b/xos/configurations/common/devstack/local.conf
index 632ed1b..ea70675 100644
--- a/xos/configurations/common/devstack/local.conf
+++ b/xos/configurations/common/devstack/local.conf
@@ -3,7 +3,7 @@
 
 DOWNLOAD_DEFAULT_IMAGES=false
 IMAGE_URLS="http://www.planet-lab.org/cord/trusty-server-multi-nic.img,"
-IMAGE_URLS+="http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.qcow2"
+#IMAGE_URLS+="http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.compressed.qcow2"
 LIBVIRT_FIREWALL_DRIVER=nova.virt.firewall.NoopFirewallDriver
 # Append the git branch name if you wish to download ceilometer from a specific branch
 enable_plugin ceilometer https://git.openstack.org/openstack/ceilometer 
diff --git a/xos/configurations/cord-pod/Makefile b/xos/configurations/cord-pod/Makefile
index 592f579..2d869a4 100644
--- a/xos/configurations/cord-pod/Makefile
+++ b/xos/configurations/cord-pod/Makefile
@@ -43,7 +43,7 @@
 	bash -c "source ./admin-openrc.sh; nova list --all-tenants; neutron net-list"
 
 ceilometer_custom_images:
-	bash -c "source ./admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || ! mkdir -p ./images || ! wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.qcow2 -P ./images || glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file ./images/ceilometer-trusty-server-multi-nic.qcow2 --container-format bare"
+	bash -c "source ./admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || ! mkdir -p ./images || ! wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.compressed.qcow2 -P ./images || glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file ./images/ceilometer-trusty-server-multi-nic.compressed.qcow2 --container-format bare"
 
 .PHONY: local_containers
 local_containers:
diff --git a/xos/configurations/cord/Makefile b/xos/configurations/cord/Makefile
index 9fee5f8..1e53e79 100644
--- a/xos/configurations/cord/Makefile
+++ b/xos/configurations/cord/Makefile
@@ -96,4 +96,4 @@
 	sudo pip install httpie --upgrade
 
 cloudlab_ceilometer_custom_images:
-	bash -c "source ../setup/admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || ! mkdir -p /tmp/images || ! wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.qcow2 -P /tmp/images || glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /tmp/images/ceilometer-trusty-server-multi-nic.qcow2 --container-format bare"
+	bash -c "source ../setup/admin-openrc.sh; glance image-show ceilometer-trusty-server-multi-nic || if test -f /proj/xos-PG0/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 ; then glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /proj/xos-PG0/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 --container-format bare ; else mkdir -p /tmp/images && wget http://www.vicci.org/cord/ceilometer-trusty-server-multi-nic.compressed.qcow2 -P /tmp/images && glance image-create --name ceilometer-trusty-server-multi-nic --disk-format qcow2 --file /tmp/images/ceilometer-trusty-server-multi-nic.compressed.qcow2 --container-format bare ; fi "
diff --git a/xos/core/admin.py b/xos/core/admin.py
index 8ca8ff8..5e153ba 100644
--- a/xos/core/admin.py
+++ b/xos/core/admin.py
@@ -1416,7 +1416,8 @@
 
     def render_change_form(self, request, context, add=False, change=False, form_url='', obj=None):
         deployment_nodes = []
-        for node in Node.objects.all():
+#        for node in Node.objects.all():
+        for node in Node.objects.order_by("name"):
             deployment_nodes.append( (node.site_deployment.deployment.id, node.id, node.name) )
 
         deployment_flavors = []
diff --git a/xos/core/models/__init__.py b/xos/core/models/__init__.py
index f203ba3..6b5826a 100644
--- a/xos/core/models/__init__.py
+++ b/xos/core/models/__init__.py
@@ -5,7 +5,7 @@
 from .service import ServiceAttribute, TenantAttribute, ServiceRole
 from .tag import Tag
 from .role import Role
-from .site import Site, Deployment, DeploymentRole, DeploymentPrivilege, Controller, ControllerRole, ControllerSite, SiteDeployment
+from .site import Site, Deployment, DeploymentRole, DeploymentPrivilege, Controller, ControllerRole, ControllerSite, SiteDeployment,Diag
 from .dashboard import DashboardView, ControllerDashboardView
 from .user import User, UserDashboardView
 from .serviceclass import ServiceClass
diff --git a/xos/core/models/site.py b/xos/core/models/site.py
index b98c40a..77b96ac 100644
--- a/xos/core/models/site.py
+++ b/xos/core/models/site.py
@@ -312,9 +312,19 @@
     tenant_id = StrippedCharField(null=True, blank=True, max_length=200, db_index=True, help_text="Keystone tenant id")
 
     def delete(self, *args, **kwds):
-        pdb.set_trace()
         super(ControllerSite, self).delete(*args, **kwds)
 
     
     class Meta:
         unique_together = ('site', 'controller') 
+
+class Diag(PlCoreBase):
+    name = StrippedCharField(max_length=200, help_text="Name of the synchronizer")
+    
+    @property
+    def enacted(self):
+        return None
+
+    @enacted.setter
+    def enacted(self, value):
+        pass # Ignore sets, Diag objects are always pending.
diff --git a/xos/core/static/observer_status.js b/xos/core/static/observer_status.js
index c6cc570..57ecf08 100644
--- a/xos/core/static/observer_status.js
+++ b/xos/core/static/observer_status.js
@@ -7,12 +7,11 @@
              success: function(newData) {
                   console.log(newData);
                   if (newData.health==":-)") {
-                      tooltip = 'last observer run time = ' + Math.floor(newData.last_duration) + ' seconds';
+                      tooltip = 'last synchronizer run time = ' + Math.floor(newData.last_duration) + ' seconds';
                       icon = "/static/img/green-cloud.gif";
                   } else {
-                      tooltip = "observer is offline";
-                      // icon = "/static/img/red-cloud.gif";
-                      icon = "/static/img/green-cloud.gif";
+                      tooltip = "synchronizer is offline";
+                      icon = "/static/img/red-cloud.gif";
                   }
 
                   html = '<span style="margin-left: 16px; cursor: pointer;" title="' + tooltip + '"><img src="' + icon +
diff --git a/xos/core/views/observer.py b/xos/core/views/observer.py
index 3aabc4a..77f1d1b 100644
--- a/xos/core/views/observer.py
+++ b/xos/core/views/observer.py
@@ -1,16 +1,23 @@
 from django.http import HttpResponse
 from core.models import *
+from xos.config import Config
 import json
 import os
 import time
 
 def Observer(request):
-    if not os.path.exists('/tmp/observer_last_run'):
+    try:
+        observer_name = Config().observer_name
+    except AttributeError:
+        observer_name = ''
+
+    diag = Diag.objects.filter(name=observer_name).first()
+    if not diag:
         return HttpResponse(json.dumps({"health": ":-X", "time": time.time(), "comp": 0}))
 
     t = time.time()
-    status_str = open('/tmp/observer_last_run','r').read()
-    d = json.loads(status_str)
+    
+    d = json.loads(diag.backend_register)
     comp = d['last_run'] + d['last_duration']*2 + 300
     if comp>t:
         d['health'] = ':-)'
diff --git a/xos/core/xoslib/static/js/vendor/ngXosHelpers.js b/xos/core/xoslib/static/js/vendor/ngXosHelpers.js
index 82a141e..69cbbf4 100644
--- a/xos/core/xoslib/static/js/vendor/ngXosHelpers.js
+++ b/xos/core/xoslib/static/js/vendor/ngXosHelpers.js
@@ -1 +1 @@
-!function(){"use strict";function e(e,n,o){e.interceptors.push("SetCSRFToken"),n.startSymbol("{$"),n.endSymbol("$}"),o.defaults.stripTrailingSlashes=!1}e.$inject=["$httpProvider","$interpolateProvider","$resourceProvider"],angular.module("bugSnag",[]).factory("$exceptionHandler",function(){return function(e,n){Bugsnag.notifyException(e,{diagnostics:{cause:n}})}}),angular.module("xos.helpers",["ngCookies","xos.xos","xos.hpcapi","xos.xoslib","bugSnag"]).config(e)}(),function(){"use strict";function e(){return{request:function(e){return-1===e.url.indexOf(".html")&&(e.url+="?no_hyperlinks=1"),e}}}angular.module("xos.helpers").factory("NoHyperlinks",e)}(),function(){"use strict";function e(e){return{request:function(n){return"GET"!==n.method&&(n.headers["X-CSRFToken"]=e.get("xoscsrftoken")),n}}}e.$inject=["$cookies"],angular.module("xos.helpers").factory("SetCSRFToken",e)}(),function(){"use strict";function e(e){return t||(t=new e({domain:""})),t}function n(e){return r||(r=new e({domain:""})),r}function o(e){return i||(i=new e({domain:""})),i}e.$inject=["xos"],n.$inject=["xoslib"],o.$inject=["hpcapi"],angular.module("xos.helpers").service("XosApi",e).service("XoslibApi",n).service("HpcApi",o);var t,r,i}();
\ No newline at end of file
+!function(){"use strict";function e(e,n,o){e.interceptors.push("SetCSRFToken"),n.startSymbol("{$"),n.endSymbol("$}"),o.defaults.stripTrailingSlashes=!1}e.$inject=["$httpProvider","$interpolateProvider","$resourceProvider"],angular.module("bugSnag",[]).factory("$exceptionHandler",function(){return function(e,n){window.Bugsnag?Bugsnag.notifyException(e,{diagnostics:{cause:n}}):console.error(e,n,e.stack)}}),angular.module("xos.helpers",["ngCookies","xos.xos","xos.hpcapi","xos.xoslib","bugSnag"]).config(e)}(),function(){"use strict";function e(){return{request:function(e){return-1===e.url.indexOf(".html")&&(e.url+="?no_hyperlinks=1"),e}}}angular.module("xos.helpers").factory("NoHyperlinks",e)}(),function(){"use strict";function e(e){return{request:function(n){return"GET"!==n.method&&(n.headers["X-CSRFToken"]=e.get("xoscsrftoken")),n}}}e.$inject=["$cookies"],angular.module("xos.helpers").factory("SetCSRFToken",e)}(),function(){"use strict";function e(e){return r||(r=new e({domain:""})),r}function n(e){return t||(t=new e({domain:""})),t}function o(e){return i||(i=new e({domain:""})),i}e.$inject=["xos"],n.$inject=["xoslib"],o.$inject=["hpcapi"],angular.module("xos.helpers").service("XosApi",e).service("XoslibApi",n).service("HpcApi",o);var r,t,i}();
\ No newline at end of file
diff --git a/xos/core/xoslib/static/js/xosCeilometerDashboard.js b/xos/core/xoslib/static/js/xosCeilometerDashboard.js
index 0b54c01..9503596 100644
--- a/xos/core/xoslib/static/js/xosCeilometerDashboard.js
+++ b/xos/core/xoslib/static/js/xosCeilometerDashboard.js
@@ -1 +1,460 @@
-"use strict";angular.module("xos.ceilometerDashboard",["ngResource","ngCookies","ngLodash","ui.router","xos.helpers","ngAnimate","chart.js","ui.bootstrap.accordion"]).config(["$stateProvider","$urlRouterProvider",function(e,t){e.state("ceilometerDashboard",{url:"/",template:"<ceilometer-dashboard></ceilometer-dashboard>"}).state("samples",{url:"/:name/:tenant/samples",template:"<ceilometer-samples></ceilometer-samples>"}),t.otherwise("/")}]).config(["$httpProvider",function(e){e.interceptors.push("NoHyperlinks")}]).run(["$rootScope",function(e){e.stateName="ceilometerDashboard",e.$on("$stateChangeStart",function(t,n){e.stateName=n.name})}]).service("Ceilometer",["$http","$q",function(e,t){this.getMappings=function(){var n=t.defer();return e.get("/xoslib/xos-slice-service-mapping/").then(function(e){n.resolve(e.data)})["catch"](function(e){n.reject(e)}),n.promise},this.getMeters=function(n){var s=t.defer();return e.get("/xoslib/meters/",{cache:!0,params:n}).then(function(e){s.resolve(e.data)})["catch"](function(e){s.reject(e)}),s.promise},this.getSamples=function(n,s){var r=t.defer();return e.get("/xoslib/metersamples/",{params:{meter:n,tenant:s}}).then(function(e){r.resolve(e.data)})["catch"](function(e){r.reject(e)}),r.promise},this.getStats=function(n){var s=t.defer();return e.get("/xoslib/meterstatistics/",{cache:!0,params:n}).then(function(e){s.resolve(e.data)})["catch"](function(e){s.reject(e)}),s.promise},this.selectedService=null,this.selectedSlice=null,this.selectedResource=null}]).directive("ceilometerDashboard",["lodash",function(e){return{restrict:"E",scope:{},bindToController:!0,controllerAs:"vm",templateUrl:"templates/ceilometer-dashboard.tpl.html",controller:["Ceilometer",function(t){var n=this;this.showStats=!1,this.accordion={open:{}},this.openPanels=function(){t.selectedService&&(n.accordion.open[t.selectedService]=!0,t.selectedSlice&&(n.loadSliceMeter(t.selectedSlice,t.selectedService),n.selectedSlice=t.selectedSlice,t.selectedResource&&(n.selectedResource=t.selectedResource)))},this.loadMappings=function(){n.loader=!0,t.getMappings().then(function(e){e.map(function(e){return"service_ONOS_vBNG"===e.service&&(e.service="ONOS_FABRIC"),"service_ONOS_vOLT"===e.service&&(e.service="ONOS_CORD"),e.slices.map(function(e){"mysite_onos_volt"===e.slice&&(e.slice="ONOS_CORD"),"mysite_onos_vbng"===e.slice&&(e.slice="ONOS_FABRIC"),"mysite_vbng"===e.slice&&(e.slice="mysite_vRouter")}),e}),n.services=e,n.openPanels()})["catch"](function(e){n.error=e.data&&e.data.detail?e.data.detail:"An Error occurred. Please try again later."})["finally"](function(){n.loader=!1})},this.loadMappings(),this.loadSliceMeter=function(s,r){t.selectedSlice=null,t.selectedService=null,t.selectedResources=null,n.loader=!0,n.error=null,n.ceilometerError=null,t.getMeters({tenant:s.project_id}).then(function(a){n.selectedSlice=s.slice,n.selectedTenant=s.project_id,t.selectedSlice=s,t.selectedService=r,a.map(function(e){return e.resource_name=e.resource_name.replace("mysite_onos_vbng","ONOS_FABRIC"),e.resource_name=e.resource_name.replace("mysite_onos_volt","ONOS_CORD"),e.resource_name=e.resource_name.replace("mysite_vbng","mysite_vRouter"),e}),n.selectedResources=e.groupBy(a,"resource_name"),t.selectedResource&&(n.selectedMeters=n.selectedResources[t.selectedResource])})["catch"](function(e){return 503===e.status?n.ceilometerError=e.data.detail.specific_error:void(n.error=e.data&&e.data.detail.specific_error?e.data.detail.specific_error:"An Error occurred. Please try again later.")})["finally"](function(){n.loader=!1})},this.selectedMeters=null,this.selectMeters=function(e,s){n.selectedMeters=e,t.selectedResource=s,n.selectedResource=s}}]}}]).directive("ceilometerSamples",["lodash","$stateParams",function(e,t){return{restrict:"E",scope:{},bindToController:!0,controllerAs:"vm",templateUrl:"templates/ceilometer-samples.tpl.html",controller:["Ceilometer",function(n){var s=this;if(this.chartColors=["#286090","#F7464A","#46BFBD","#FDB45C","#97BBCD","#4D5360","#8c4f9f"],this.chart={series:[],labels:[],data:[]},Chart.defaults.global.colours=this.chartColors,this.chartType="line",!t.name||!t.tenant)throw new Error("Missing Name and Tenant Params!");this.name=t.name,this.tenant=t.tenant,this.getLabels=function(e){return e.reduce(function(e,t){var n=new Date(t.timestamp);return e.push(n.getHours()+":"+((n.getMinutes()<10?"0":"")+n.getMinutes())+":"+n.getSeconds()),e},[])},this.getData=function(e){return e.reduce(function(e,t){return e.push(t.volume),e},[])},this.chartMeters=[],this.addMeterToChart=function(t){s.chart.labels=s.getLabels(e.sortBy(s.samplesList[t],"timestamp")),s.chart.series.push(t),s.chart.data.push(s.getData(e.sortBy(s.samplesList[t],"timestamp"))),s.chartMeters.push(s.samplesList[t][0]),e.remove(s.sampleLabels,{id:t})},this.removeFromChart=function(t){s.chart.data.splice(s.chart.series.indexOf(t.project_id),1),s.chart.series.splice(s.chart.series.indexOf(t.project_id),1),s.chartMeters.splice(e.findIndex(s.chartMeters,{project_id:t.project_id}),1),s.sampleLabels.push({id:t.project_id,name:t.resource_name||t.project_id})},this.formatSamplesLabels=function(t){return e.uniq(t,"project_id").reduce(function(e,t){return e.push({id:t.project_id,name:t.resource_name||t.project_id}),e},[])},this.showSamples=function(){s.loader=!0,n.getSamples(s.name).then(function(t){t.map(function(e){return e.resource_name=e.resource_name.replace("mysite_onos_vbng","ONOS_FABRIC"),e.resource_name=e.resource_name.replace("mysite_onos_volt","ONOS_CORD"),e.resource_name=e.resource_name.replace("mysite_vbng","mysite_vRouter"),e}),s.samplesList=e.groupBy(t,"project_id"),s.sampleLabels=s.formatSamplesLabels(t),s.addMeterToChart(s.tenant)})["catch"](function(e){s.error=e.data.detail})["finally"](function(){s.loader=!1})},this.showSamples()}]}}]).directive("ceilometerStats",function(){return{restrict:"E",scope:{name:"=name",tenant:"=tenant"},bindToController:!0,controllerAs:"vm",templateUrl:"templates/ceilometer-stats.tpl.html",controller:["$scope","Ceilometer",function(e,t){var n=this;this.getStats=function(e){n.loader=!0,t.getStats({tenant:e}).then(function(e){e.map(function(e){return e.resource_name=e.resource_name.replace("mysite_onos_vbng","ONOS_FABRIC"),e.resource_name=e.resource_name.replace("mysite_onos_volt","ONOS_CORD"),e.resource_name=e.resource_name.replace("mysite_vbng","mysite_vRouter"),e}),n.stats=e})["catch"](function(e){n.error=e.data})["finally"](function(){n.loader=!1})},e.$watch(function(){return n.name},function(e){e&&n.getStats(n.tenant)})}]}}),angular.module("xos.ceilometerDashboard").run(["$templateCache",function(e){e.put("templates/accordion-group.html",'<div class="panel {{panelClass || \'panel-default\'}}">\n  <div class="panel-heading" ng-keypress="toggleOpen($event)">\n    <h5>\n      <a href tabindex="0" class="accordion-toggle" ng-click="toggleOpen()" uib-accordion-transclude="heading"><span ng-class="{\'text-muted\': isDisabled}">{{heading}}</span></a>\n    </h5>\n  </div>\n  <div class="panel-collapse collapse" uib-collapse="!isOpen">\n	  <div class="panel-body" ng-transclude></div>\n  </div>\n</div>\n'),e.put("templates/accordion.html",'<div class="panel-group" ng-transclude></div>'),e.put("templates/ceilometer-dashboard.tpl.html",'<div class="row">\n  <div class="col-sm-10">\n    <h3>XOS Monitoring Statistics</h3>\n  </div>\n  <div class="col-xs-2 text-right">\n    <a href="" class="btn btn-default" \n      ng-show="vm.selectedSlice && !vm.showStats"\n      ng-click="vm.showStats = true">\n      <i class="glyphicon glyphicon-transfer"></i>\n    </a>\n    <a href="" class="btn btn-default" \n      ng-show="vm.selectedSlice && vm.showStats"\n      ng-click="vm.showStats = false">\n      <i class="glyphicon glyphicon-transfer"></i>\n    </a>\n  </div>\n</div>\n\n<div class="row" ng-show="vm.loader">\n  <div class="col-xs-12">\n    <div class="loader">Loading</div>\n  </div>\n</div>\n\n<section ng-hide="vm.loader" ng-class="{animate: !vm.loader}">\n  <div class="row">\n    <div class="col-sm-3 service-list">\n        <h4>XOS Service: </h4>\n        <uib-accordion close-others="true" template-url="templates/accordion.html">\n          <uib-accordion-group\n            ng-repeat="service in vm.services | orderBy:\'-service\'"\n            template-url="templates/accordion-group.html"\n            is-open="vm.accordion.open[service.service]"\n            heading="{{service.service}}">\n            <h5>Slices:</h5>\n            <a ng-repeat="slice in service.slices" \n              ng-class="{active: slice.slice === vm.selectedSlice}"\n              ng-click="vm.loadSliceMeter(slice, service.service)"\n              href="#" class="list-group-item" >\n              {{slice.slice}} <i class="glyphicon glyphicon-chevron-right pull-right"></i>\n            </a>\n          </uib-accordion-group>\n        </uib-accordion>\n    </div>\n    <section class="side-container col-sm-9">\n      <div class="row">\n        <!-- STATS -->\n        <article ng-hide="!vm.showStats" class="stats animate-slide-left">\n          <div class="col-xs-12">\n            <div class="list-group">\n              <div class="list-group-item">\n                <h4>Stats</h4>\n              </div>\n              <div class="list-group-item">\n                <ceilometer-stats ng-if="vm.selectedSlice" name="vm.selectedSlice" tenant="vm.selectedTenant"></ceilometer-stats>\n              </div>\n            </div>\n          </div>\n        </article>\n        <!-- METERS -->\n        <article ng-hide="vm.showStats" class="meters animate-slide-left">\n          <div class="alert alert-danger" ng-show="vm.ceilometerError">\n            {{vm.ceilometerError}}\n          </div>\n          <div class="col-sm-4 animate-slide-left" ng-hide="!vm.selectedSlice">\n            <div class="list-group">\n              <div class="list-group-item">\n                <h4>Resources</h4>\n              </div>\n              <a href="#" \n                ng-click="vm.selectMeters(meters, resource)" \n                class="list-group-item" \n                ng-repeat="(resource, meters) in vm.selectedResources" \n                ng-class="{active: resource === vm.selectedResource}">\n                {{resource}} <i class="glyphicon glyphicon-chevron-right pull-right"></i>\n              </a>\n            </div>\n          </div>\n          <div class="col-sm-8 animate-slide-left" ng-hide="!vm.selectedMeters">\n            <div class="list-group">\n              <div class="list-group-item">\n                <h4>Meters</h4>\n              </div>\n              <div class="list-group-item">\n                <div class="row">\n                  <div class="col-xs-6">\n                    <label>Name:</label>\n                  </div>\n                  <div class="col-xs-3">\n                    <label>Unit:</label>\n                  </div>\n                  <div class="col-xs-3"></div>\n                </div>\n                <div class="row" ng-repeat="meter in vm.selectedMeters" style="margin-bottom: 10px;">\n                  <div class="col-xs-6">\n                    {{meter.name}}\n                  </div>\n                  <div class="col-xs-3">\n                    {{meter.unit}}\n                  </div>\n                  <div class="col-xs-3">\n                    <a ui-sref="samples({name: meter.name, tenant: meter.project_id})" class="btn btn-primary">\n                      <i class="glyphicon glyphicon-search"></i>\n                    </a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </article>\n      </div>\n    </section>\n  </div>\n</section>\n<section ng-if="!vm.loader && vm.error">\n  <div class="alert alert-danger">\n    {{vm.error}}\n  </div>\n</section>\n'),e.put("templates/ceilometer-samples.tpl.html",'<!-- <pre>{{ vm | json}}</pre> -->\n\n<div class="row">\n  <div class="col-xs-10">\n    <h1>{{vm.name | uppercase}}</h1>\n  </div>\n  <div class="col-xs-2">\n    <a ui-sref="ceilometerDashboard" class="btn btn-primary pull-right">\n      <i class="glyphicon glyphicon-arrow-left"></i> Back to list\n    </a>\n  </div>\n</div>\n<div class="row" ng-show="vm.loader">\n  <div class="col-xs-12">\n    <div class="loader">Loading</div>\n  </div>\n</div>\n<section ng-if="!vm.loader && !vm.error">\n  <div class="row">\n    <form class="form-inline col-xs-8" ng-submit="vm.addMeterToChart(vm.addMeterValue)">\n      <select ng-model="vm.addMeterValue" class="form-control" ng-options="resource.id as resource.name for resource in vm.sampleLabels"></select>\n      <button class="btn btn-success"> \n        <i class="glyphicon glyphicon-plus"></i> Add\n      </button>\n    </form>\n    <div class="col-xs-4 text-right">\n      <a ng-click="vm.chartType = \'line\'" class="btn" ng-class="{\'btn-default\': vm.chartType != \'bar\', \'btn-primary\': vm.chartType == \'line\'}">Lines</a>\n      <a ng-click="vm.chartType = \'bar\'" class="btn" ng-class="{\'btn-default\': vm.chartType != \'line\', \'btn-primary\': vm.chartType == \'bar\'}">Bars</a>\n    </div>\n  </div>\n  <div class="row" ng-if="!vm.loader">\n    <div class="col-xs-12">\n      <canvas ng-if="vm.chartType === \'line\'" id="line" class="chart chart-line" chart-data="vm.chart.data" chart-options="{datasetFill: false}"\n        chart-labels="vm.chart.labels" chart-legend="false" chart-series="vm.chart.series">\n      </canvas>\n      <canvas ng-if="vm.chartType === \'bar\'" id="bar" class="chart chart-bar" chart-data="vm.chart.data"\n        chart-labels="vm.chart.labels" chart-legend="false" chart-series="vm.chart.series">\n      </canvas>\n      <!-- <pre>{{vm.chartMeters | json}}</pre> -->\n    </div>\n  </div>\n  <div class="row" ng-if="!vm.loader">\n    <div class="col-xs-12">\n      <a ng-click="vm.removeFromChart(meter)" class="btn btn-chart" ng-style="{\'background-color\': vm.chartColors[$index]}" ng-repeat="meter in vm.chartMeters">\n        {{meter.resource_name || meter.resource_id}}\n      </a>\n    </div>\n  </div>\n</section>\n<section ng-if="!vm.loader && vm.error">\n  <div class="alert alert-danger">\n    {{vm.error}}\n  </div>\n</section>'),e.put("templates/ceilometer-stats.tpl.html",'<div ng-show="vm.loader" class="loader">Loading</div>\n\n<section ng-if="!vm.loader && !vm.error">\n\n  <div class="alert alert-danger" ng-if="vm.stats.length == 0">\n    No result\n  </div>  \n\n  <table class="table" ng-if="vm.stats.length > 0">\n    <tr>\n      <th>\n        <a ng-click="(order == \'category\') ? order = \'-category\' : order = \'category\'">Type:</a>\n      </th>\n      <th>\n        <a ng-click="(order == \'resource_name\') ? order = \'-resource_name\' : order = \'resource_name\'">Resource:</a>\n      </th>\n      <th>\n        <a ng-click="(order == \'meter\') ? order = \'-meter\' : order = \'meter\'">Meter:</a>\n      </th>\n      <th>\n        Unit:\n      </th>\n      <th>\n        Value:\n      </th>\n    </tr>\n    <!-- <tr>\n      <td>\n        <input type="text" ng-model="query.category">\n      </td>\n      <td>\n        <input type="text" ng-model="query.resource_name">\n      </td>\n      <td>\n        <input type="text" ng-model="query.meter">\n      </td>\n      <td>\n        <input type="text" ng-model="query.unit">\n      </td>\n      <td>\n        <input type="text" ng-model="query.value">\n      </td>\n    </tr> -->\n    <tr ng-repeat="item in vm.stats | orderBy:order">\n      <td>{{item.category}}</td>\n      <td>{{item.resource_name}}</td>\n      <td>{{item.meter}}</td>\n      <td>{{item.unit}}</td>\n      <td>{{item.value}}</td>\n    </tr>\n  </table>\n</section>\n\n<section ng-if="!vm.loader && vm.error">\n  <div class="alert alert-danger">\n    {{vm.error}}\n  </div>\n</section>\n')}]),angular.module("xos.ceilometerDashboard").run(["$location",function(e){e.path("/")}]),angular.bootstrap(angular.element("#xosCeilometerDashboard"),["xos.ceilometerDashboard"]);
\ No newline at end of file
+'use strict';
+
+angular.module('xos.ceilometerDashboard', ['ngResource', 'ngCookies', 'ngLodash', 'ui.router', 'xos.helpers', 'ngAnimate', 'chart.js', 'ui.bootstrap.accordion']).config(["$stateProvider", "$urlRouterProvider", function ($stateProvider, $urlRouterProvider) {
+  $stateProvider.state('ceilometerDashboard', {
+    url: '/',
+    template: '<ceilometer-dashboard></ceilometer-dashboard>'
+  }).state('samples', {
+    url: '/:name/:tenant/samples',
+    template: '<ceilometer-samples></ceilometer-samples>'
+  });
+  $urlRouterProvider.otherwise('/');
+}]).config(["$httpProvider", function ($httpProvider) {
+  $httpProvider.interceptors.push('NoHyperlinks');
+}]).run(["$rootScope", function ($rootScope) {
+  $rootScope.stateName = 'ceilometerDashboard';
+  $rootScope.$on('$stateChangeStart', function (event, toState) {
+    $rootScope.stateName = toState.name;
+  });
+}]);
+angular.module("xos.ceilometerDashboard").run(["$templateCache", function($templateCache) {$templateCache.put("templates/accordion-group.html","<div class=\"panel {{panelClass || \'panel-default\'}}\">\n  <div class=\"panel-heading\" ng-keypress=\"toggleOpen($event)\">\n    <h5>\n      <a href tabindex=\"0\" class=\"accordion-toggle\" ng-click=\"toggleOpen()\" uib-accordion-transclude=\"heading\"><span ng-class=\"{\'text-muted\': isDisabled}\">{{heading}}</span></a>\n    </h5>\n  </div>\n  <div class=\"panel-collapse collapse\" uib-collapse=\"!isOpen\">\n	  <div class=\"panel-body\" ng-transclude></div>\n  </div>\n</div>\n");
+$templateCache.put("templates/accordion.html","<div class=\"panel-group\" ng-transclude></div>");
+$templateCache.put("templates/ceilometer-dashboard.tpl.html","<div class=\"row\">\n  <div class=\"col-sm-10\">\n    <h3>XOS Monitoring Statistics</h3>\n  </div>\n  <div class=\"col-xs-2 text-right\">\n    <a href=\"\" class=\"btn btn-default\" \n      ng-show=\"vm.selectedSlice && !vm.showStats\"\n      ng-click=\"vm.showStats = true\">\n      <i class=\"glyphicon glyphicon-transfer\"></i>\n    </a>\n    <a href=\"\" class=\"btn btn-default\" \n      ng-show=\"vm.selectedSlice && vm.showStats\"\n      ng-click=\"vm.showStats = false\">\n      <i class=\"glyphicon glyphicon-transfer\"></i>\n    </a>\n  </div>\n</div>\n\n<div class=\"row\" ng-show=\"vm.loader\">\n  <div class=\"col-xs-12\">\n    <div class=\"loader\">Loading</div>\n  </div>\n</div>\n\n<section ng-hide=\"vm.loader\" ng-class=\"{animate: !vm.loader}\">\n  <div class=\"row\">\n    <div class=\"col-sm-3 service-list\">\n        <h4>XOS Service: </h4>\n        <uib-accordion close-others=\"true\" template-url=\"templates/accordion.html\">\n          <uib-accordion-group\n            ng-repeat=\"service in vm.services | orderBy:\'-service\'\"\n            template-url=\"templates/accordion-group.html\"\n            is-open=\"vm.accordion.open[service.service]\"\n            heading=\"{{service.service}}\">\n            <h5>Slices:</h5>\n            <a ng-repeat=\"slice in service.slices\" \n              ng-class=\"{active: slice.slice === vm.selectedSlice}\"\n              ng-click=\"vm.loadSliceMeter(slice, service.service)\"\n              href=\"#\" class=\"list-group-item\" >\n              {{slice.slice}} <i class=\"glyphicon glyphicon-chevron-right pull-right\"></i>\n            </a>\n          </uib-accordion-group>\n        </uib-accordion>\n    </div>\n    <section class=\"side-container col-sm-9\">\n      <div class=\"row\">\n        <!-- STATS -->\n        <article ng-hide=\"!vm.showStats\" class=\"stats animate-slide-left\">\n          <div class=\"col-xs-12\">\n            <div class=\"list-group\">\n              <div class=\"list-group-item\">\n                <h4>Stats</h4>\n              </div>\n              <div class=\"list-group-item\">\n                <ceilometer-stats ng-if=\"vm.selectedSlice\" name=\"vm.selectedSlice\" tenant=\"vm.selectedTenant\"></ceilometer-stats>\n              </div>\n            </div>\n          </div>\n        </article>\n        <!-- METERS -->\n        <article ng-hide=\"vm.showStats\" class=\"meters animate-slide-left\">\n          <div class=\"alert alert-danger\" ng-show=\"vm.ceilometerError\">\n            {{vm.ceilometerError}}\n          </div>\n          <div class=\"col-sm-4 animate-slide-left\" ng-hide=\"!vm.selectedSlice\">\n            <div class=\"list-group\">\n              <div class=\"list-group-item\">\n                <h4>Resources</h4>\n              </div>\n              <a href=\"#\" \n                ng-click=\"vm.selectMeters(meters, resource)\" \n                class=\"list-group-item\" \n                ng-repeat=\"(resource, meters) in vm.selectedResources\" \n                ng-class=\"{active: resource === vm.selectedResource}\">\n                {{resource}} <i class=\"glyphicon glyphicon-chevron-right pull-right\"></i>\n              </a>\n            </div>\n          </div>\n          <div class=\"col-sm-8 animate-slide-left\" ng-hide=\"!vm.selectedMeters\">\n            <div class=\"list-group\">\n              <div class=\"list-group-item\">\n                <h4>Meters</h4>\n              </div>\n              <div class=\"list-group-item\">\n                <div class=\"row\">\n                  <div class=\"col-xs-6\">\n                    <label>Name:</label>\n                  </div>\n                  <div class=\"col-xs-3\">\n                    <label>Unit:</label>\n                  </div>\n                  <div class=\"col-xs-3\"></div>\n                </div>\n                <div class=\"row\" ng-repeat=\"meter in vm.selectedMeters\" style=\"margin-bottom: 10px;\">\n                  <div class=\"col-xs-6\">\n                    {{meter.name}}\n                  </div>\n                  <div class=\"col-xs-3\">\n                    {{meter.unit}}\n                  </div>\n                  <div class=\"col-xs-3\">\n                    <!-- tenant: meter.resource_id -->\n                    <a ui-sref=\"samples({name: meter.name, tenant: meter.resource_id})\" class=\"btn btn-primary\">\n                      <i class=\"glyphicon glyphicon-search\"></i>\n                    </a>\n                  </div>\n                </div>\n              </div>\n            </div>\n          </div>\n        </article>\n      </div>\n    </section>\n  </div>\n</section>\n<section ng-if=\"!vm.loader && vm.error\">\n  <div class=\"alert alert-danger\">\n    {{vm.error}}\n  </div>\n</section>\n");
+$templateCache.put("templates/ceilometer-samples.tpl.html","<!-- <pre>{{ vm | json}}</pre> -->\n\n<div class=\"row\">\n  <div class=\"col-xs-10\">\n    <h1>{{vm.name | uppercase}}</h1>\n  </div>\n  <div class=\"col-xs-2\">\n    <a ui-sref=\"ceilometerDashboard\" class=\"btn btn-primary pull-right\">\n      <i class=\"glyphicon glyphicon-arrow-left\"></i> Back to list\n    </a>\n  </div>\n</div>\n<div class=\"row\" ng-show=\"vm.loader\">\n  <div class=\"col-xs-12\">\n    <div class=\"loader\">Loading</div>\n  </div>\n</div>\n<section ng-if=\"!vm.loader && !vm.error\">\n  <div class=\"row\">\n    <form class=\"form-inline col-xs-8\" ng-submit=\"vm.addMeterToChart(vm.addMeterValue)\">\n      <select ng-model=\"vm.addMeterValue\" class=\"form-control\" ng-options=\"resource.id as resource.name for resource in vm.sampleLabels\"></select>\n      <button class=\"btn btn-success\"> \n        <i class=\"glyphicon glyphicon-plus\"></i> Add\n      </button>\n    </form>\n    <div class=\"col-xs-4 text-right\">\n      <a ng-click=\"vm.chartType = \'line\'\" class=\"btn\" ng-class=\"{\'btn-default\': vm.chartType != \'bar\', \'btn-primary\': vm.chartType == \'line\'}\">Lines</a>\n      <a ng-click=\"vm.chartType = \'bar\'\" class=\"btn\" ng-class=\"{\'btn-default\': vm.chartType != \'line\', \'btn-primary\': vm.chartType == \'bar\'}\">Bars</a>\n    </div>\n  </div>\n  <div class=\"row\" ng-if=\"!vm.loader\">\n    <div class=\"col-xs-12\">\n      <canvas ng-if=\"vm.chartType === \'line\'\" id=\"line\" class=\"chart chart-line\" chart-data=\"vm.chart.data\" chart-options=\"{datasetFill: false}\"\n        chart-labels=\"vm.chart.labels\" chart-legend=\"false\" chart-series=\"vm.chart.series\">\n      </canvas>\n      <canvas ng-if=\"vm.chartType === \'bar\'\" id=\"bar\" class=\"chart chart-bar\" chart-data=\"vm.chart.data\"\n        chart-labels=\"vm.chart.labels\" chart-legend=\"false\" chart-series=\"vm.chart.series\">\n      </canvas>\n      <!-- <pre>{{vm.chartMeters | json}}</pre> -->\n    </div>\n  </div>\n  <div class=\"row\" ng-if=\"!vm.loader\">\n    <div class=\"col-xs-12\">\n      <a ng-click=\"vm.removeFromChart(meter)\" class=\"btn btn-chart\" ng-style=\"{\'background-color\': vm.chartColors[$index]}\" ng-repeat=\"meter in vm.chartMeters\">\n        {{meter.resource_name || meter.resource_id}}\n      </a>\n    </div>\n  </div>\n</section>\n<section ng-if=\"!vm.loader && vm.error\">\n  <div class=\"alert alert-danger\">\n    {{vm.error}}\n  </div>\n</section>");
+$templateCache.put("templates/ceilometer-stats.tpl.html","<div ng-show=\"vm.loader\" class=\"loader\">Loading</div>\n\n<section ng-if=\"!vm.loader && !vm.error\">\n\n  <div class=\"alert alert-danger\" ng-if=\"vm.stats.length == 0\">\n    No result\n  </div>  \n\n  <table class=\"table\" ng-if=\"vm.stats.length > 0\">\n    <tr>\n      <th>\n        <a ng-click=\"(order == \'category\') ? order = \'-category\' : order = \'category\'\">Type:</a>\n      </th>\n      <th>\n        <a ng-click=\"(order == \'resource_name\') ? order = \'-resource_name\' : order = \'resource_name\'\">Resource:</a>\n      </th>\n      <th>\n        <a ng-click=\"(order == \'meter\') ? order = \'-meter\' : order = \'meter\'\">Meter:</a>\n      </th>\n      <th>\n        Unit:\n      </th>\n      <th>\n        Value:\n      </th>\n    </tr>\n    <!-- <tr>\n      <td>\n        <input type=\"text\" ng-model=\"query.category\">\n      </td>\n      <td>\n        <input type=\"text\" ng-model=\"query.resource_name\">\n      </td>\n      <td>\n        <input type=\"text\" ng-model=\"query.meter\">\n      </td>\n      <td>\n        <input type=\"text\" ng-model=\"query.unit\">\n      </td>\n      <td>\n        <input type=\"text\" ng-model=\"query.value\">\n      </td>\n    </tr> -->\n    <tr ng-repeat=\"item in vm.stats | orderBy:order\">\n      <td>{{item.category}}</td>\n      <td>{{item.resource_name}}</td>\n      <td>{{item.meter}}</td>\n      <td>{{item.unit}}</td>\n      <td>{{item.value}}</td>\n    </tr>\n  </table>\n</section>\n\n<section ng-if=\"!vm.loader && vm.error\">\n  <div class=\"alert alert-danger\">\n    {{vm.error}}\n  </div>\n</section>\n");}]);
+angular.module('xos.ceilometerDashboard').run(["$location", function($location){$location.path('/')}]);
+angular.element(document).ready(function() {angular.bootstrap(angular.element('#xosCeilometerDashboard'), ['xos.ceilometerDashboard']);});
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+'use strict';
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard').directive('ceilometerStats', function () {
+    return {
+      restrict: 'E',
+      scope: {
+        name: '=name',
+        tenant: '=tenant'
+      },
+      bindToController: true,
+      controllerAs: 'vm',
+      templateUrl: 'templates/ceilometer-stats.tpl.html',
+      controller: ["$scope", "Ceilometer", function controller($scope, Ceilometer) {
+        var _this = this;
+
+        this.getStats = function (tenant) {
+          _this.loader = true;
+          Ceilometer.getStats({ tenant: tenant }).then(function (res) {
+            res.map(function (m) {
+              m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
+              m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
+              m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
+              return m;
+            });
+            _this.stats = res;
+          })['catch'](function (err) {
+            _this.error = err.data;
+          })['finally'](function () {
+            _this.loader = false;
+          });
+        };
+
+        $scope.$watch(function () {
+          return _this.name;
+        }, function (val) {
+          if (val) {
+            _this.getStats(_this.tenant);
+          }
+        });
+      }]
+    };
+  });
+})();
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+'use strict';
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard').directive('ceilometerSamples', ["lodash", "$stateParams", function (lodash, $stateParams) {
+    return {
+      restrict: 'E',
+      scope: {},
+      bindToController: true,
+      controllerAs: 'vm',
+      templateUrl: 'templates/ceilometer-samples.tpl.html',
+      controller: ["Ceilometer", function controller(Ceilometer) {
+        var _this = this;
+
+        // console.log(Ceilometer.selectResource);
+
+        this.chartColors = ['#286090', '#F7464A', '#46BFBD', '#FDB45C', '#97BBCD', '#4D5360', '#8c4f9f'];
+
+        this.chart = {
+          series: [],
+          labels: [],
+          data: []
+        };
+
+        Chart.defaults.global.colours = this.chartColors;
+
+        this.chartType = 'line';
+
+        if ($stateParams.name && $stateParams.tenant) {
+          this.name = $stateParams.name;
+          this.tenant = $stateParams.tenant;
+          // TODO rename tenant in resource_id
+        } else {
+            throw new Error('Missing Name and Tenant Params!');
+          }
+
+        /**
+         * Goes trough the array and format date to be used as labels
+         *
+         * @param Array data
+         * @returns Array a list of labels
+         */
+
+        this.getLabels = function (data) {
+          return data.reduce(function (list, item) {
+            var date = new Date(item.timestamp);
+            list.push(date.getHours() + ':' + ((date.getMinutes() < 10 ? '0' : '') + date.getMinutes()) + ':' + date.getSeconds());
+            return list;
+          }, []);
+        };
+
+        /**
+         * Goes trough the array and return a flat array of values
+         *
+         * @param Array data
+         * @returns Array a list of values
+         */
+
+        this.getData = function (data) {
+          return data.reduce(function (list, item) {
+            list.push(item.volume);
+            return list;
+          }, []);
+        };
+
+        /**
+         * Add a samples to the chart
+         *
+         * @param string resource_id
+         */
+        this.chartMeters = [];
+        this.addMeterToChart = function (resource_id) {
+          _this.chart['labels'] = _this.getLabels(lodash.sortBy(_this.samplesList[resource_id], 'timestamp'));
+          _this.chart['series'].push(resource_id);
+          _this.chart['data'].push(_this.getData(lodash.sortBy(_this.samplesList[resource_id], 'timestamp')));
+          _this.chartMeters.push(_this.samplesList[resource_id][0]); //use the 0 as are all samples for the same resource and I need the name
+          lodash.remove(_this.sampleLabels, { id: resource_id });
+        };
+
+        this.removeFromChart = function (meter) {
+          _this.chart.data.splice(_this.chart.series.indexOf(meter.resource_id), 1);
+          _this.chart.series.splice(_this.chart.series.indexOf(meter.resource_id), 1);
+          _this.chartMeters.splice(lodash.findIndex(_this.chartMeters, { resource_id: meter.resource_id }), 1);
+          _this.sampleLabels.push({
+            id: meter.resource_id,
+            name: meter.resource_name || meter.resource_id
+          });
+        };
+
+        /**
+         * Format samples to create a list of labels and ids
+         */
+
+        this.formatSamplesLabels = function (samples) {
+
+          return lodash.uniq(samples, 'resource_id').reduce(function (labels, item) {
+            labels.push({
+              id: item.resource_id,
+              name: item.resource_name || item.resource_id
+            });
+
+            return labels;
+          }, []);
+        };
+
+        /**
+         * Load the samples and format data
+         */
+
+        this.showSamples = function () {
+          _this.loader = true;
+          // Ceilometer.getSamples(this.name, this.tenant) //fetch one
+          Ceilometer.getSamples(_this.name) //fetch all
+          .then(function (res) {
+
+            // rename things in UI
+            res.map(function (m) {
+              m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
+              m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
+              m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
+              return m;
+            });
+            // end rename things in UI
+
+            // setup data for visualization
+            _this.samplesList = lodash.groupBy(res, 'resource_id');
+            _this.sampleLabels = _this.formatSamplesLabels(res);
+
+            // add current meter to chart
+            _this.addMeterToChart(_this.tenant);
+          })['catch'](function (err) {
+            _this.error = err.data.detail;
+          })['finally'](function () {
+            _this.loader = false;
+          });
+        };
+
+        this.showSamples();
+      }]
+    };
+  }]);
+})();
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+'use strict';
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard').service('Ceilometer', ["$http", "$q", function ($http, $q) {
+
+    this.getMappings = function () {
+      var deferred = $q.defer();
+
+      $http.get('/xoslib/xos-slice-service-mapping/').then(function (res) {
+        deferred.resolve(res.data);
+      })['catch'](function (e) {
+        deferred.reject(e);
+      });
+
+      return deferred.promise;
+    };
+
+    this.getMeters = function (params) {
+      var deferred = $q.defer();
+
+      $http.get('/xoslib/meters/', { cache: true, params: params })
+      // $http.get('../meters_mock.json', {cache: true})
+      .then(function (res) {
+        deferred.resolve(res.data);
+      })['catch'](function (e) {
+        deferred.reject(e);
+      });
+
+      return deferred.promise;
+    };
+
+    this.getSamples = function (name, tenant) {
+      var deferred = $q.defer();
+
+      $http.get('/xoslib/metersamples/', { params: { meter: name, tenant: tenant } }).then(function (res) {
+        deferred.resolve(res.data);
+      })['catch'](function (e) {
+        deferred.reject(e);
+      });
+
+      return deferred.promise;
+    };
+
+    this.getStats = function (options) {
+      var deferred = $q.defer();
+
+      $http.get('/xoslib/meterstatistics/', { cache: true, params: options })
+      // $http.get('../stats_mock.son', {cache: true})
+      .then(function (res) {
+        deferred.resolve(res.data);
+      })['catch'](function (e) {
+        deferred.reject(e);
+      });
+
+      return deferred.promise;
+    };
+
+    // hold dashboard status (opened service, slice, resource)
+    this.selectedService = null;
+    this.selectedSlice = null;
+    this.selectedResource = null;
+  }]);
+})();
+/**
+ * © OpenCORD
+ *
+ * Visit http://guide.xosproject.org/devguide/addview/ for more information
+ *
+ * Created by teone on 3/21/16.
+ */
+
+'use strict';
+
+(function () {
+  'use strict';
+
+  angular.module('xos.ceilometerDashboard').directive('ceilometerDashboard', ["lodash", function (lodash) {
+    return {
+      restrict: 'E',
+      scope: {},
+      bindToController: true,
+      controllerAs: 'vm',
+      templateUrl: 'templates/ceilometer-dashboard.tpl.html',
+      controller: ["Ceilometer", function controller(Ceilometer) {
+        var _this = this;
+
+        this.showStats = false;
+
+        // this open the accordion
+        this.accordion = {
+          open: {}
+        };
+
+        /**
+         * Open the active panel base on the service stored values
+         */
+        this.openPanels = function () {
+          if (Ceilometer.selectedService) {
+            _this.accordion.open[Ceilometer.selectedService] = true;
+            if (Ceilometer.selectedSlice) {
+              _this.loadSliceMeter(Ceilometer.selectedSlice, Ceilometer.selectedService);
+              _this.selectedSlice = Ceilometer.selectedSlice;
+              if (Ceilometer.selectedResource) {
+                _this.selectedResource = Ceilometer.selectedResource;
+              }
+            }
+          }
+        };
+
+        /**
+         * Load the list of service and slices
+         */
+        this.loadMappings = function () {
+          _this.loader = true;
+          Ceilometer.getMappings().then(function (services) {
+
+            // rename thing in UI
+            services.map(function (service) {
+              if (service.service === 'service_ONOS_vBNG') {
+                service.service = 'ONOS_FABRIC';
+              }
+              if (service.service === 'service_ONOS_vOLT') {
+                service.service = 'ONOS_CORD';
+              }
+
+              service.slices.map(function (s) {
+                if (s.slice === 'mysite_onos_volt') {
+                  s.slice = 'ONOS_CORD';
+                }
+                if (s.slice === 'mysite_onos_vbng') {
+                  s.slice = 'ONOS_FABRIC';
+                }
+                if (s.slice === 'mysite_vbng') {
+                  s.slice = 'mysite_vRouter';
+                }
+              });
+
+              return service;
+            });
+            // end rename thing in UI
+
+            _this.services = services;
+            _this.openPanels();
+          })['catch'](function (err) {
+            _this.error = err.data && err.data.detail ? err.data.detail : 'An Error occurred. Please try again later.';
+          })['finally'](function () {
+            _this.loader = false;
+          });
+        };
+
+        this.loadMappings();
+
+        /**
+         * Load the list of a single slice
+         */
+        this.loadSliceMeter = function (slice, service_name) {
+
+          Ceilometer.selectedSlice = null;
+          Ceilometer.selectedService = null;
+          Ceilometer.selectedResources = null;
+
+          // visualization info
+          _this.loader = true;
+          _this.error = null;
+          _this.ceilometerError = null;
+
+          Ceilometer.getMeters({ tenant: slice.project_id }).then(function (sliceMeters) {
+            _this.selectedSlice = slice.slice;
+            _this.selectedTenant = slice.project_id;
+
+            // store the status
+            Ceilometer.selectedSlice = slice;
+            Ceilometer.selectedService = service_name;
+
+            // rename things in UI
+            sliceMeters.map(function (m) {
+              m.resource_name = m.resource_name.replace('mysite_onos_vbng', 'ONOS_FABRIC');
+              m.resource_name = m.resource_name.replace('mysite_onos_volt', 'ONOS_CORD');
+              m.resource_name = m.resource_name.replace('mysite_vbng', 'mysite_vRouter');
+              return m;
+            });
+            // end rename things in UI
+
+            _this.selectedResources = lodash.groupBy(sliceMeters, 'resource_name');
+
+            // hacky
+            if (Ceilometer.selectedResource) {
+              _this.selectedMeters = _this.selectedResources[Ceilometer.selectedResource];
+            }
+          })['catch'](function (err) {
+
+            // this means that ceilometer is not yet ready
+            if (err.status === 503) {
+              return _this.ceilometerError = err.data.detail.specific_error;
+            }
+
+            _this.ceilometerError = err.data && err.data.detail && err.data.detail.specific_error ? err.data.detail.specific_error : 'An Error occurred. Please try again later.';
+          })['finally'](function () {
+            _this.loader = false;
+          });
+        };
+
+        /**
+         * Select Meters for a resource
+         *
+         * @param Array meters The list of selected resources
+         * @returns void
+         */
+        this.selectedMeters = null;
+        this.selectMeters = function (meters, resource) {
+          _this.selectedMeters = meters;
+
+          Ceilometer.selectedResource = resource;
+          _this.selectedResource = resource;
+        };
+      }]
+    };
+  }]);
+})();
\ No newline at end of file
diff --git a/xos/synchronizers/base/event_loop.py b/xos/synchronizers/base/event_loop.py
index c1b9cda..f224380 100644
--- a/xos/synchronizers/base/event_loop.py
+++ b/xos/synchronizers/base/event_loop.py
@@ -520,7 +520,15 @@
                         self.save_run_times()
 
                         loop_end = time.time()
-                        open('/tmp/%sobserver_last_run'%self.observer_name,'w').write(json.dumps({'last_run': loop_end, 'last_duration':loop_end - loop_start}))
+
+                        diag = Diag.objects.filter(name=Config().observer_name).first()
+                        if (diag):
+                            br_str = diag.backend_register
+                            br = json.loads(br_str)
+                            br['last_run'] = loop_end
+                            br['last_duration'] = loop_end - loop_start
+                            diag.backend_register = json.dumps(br)
+                            diag.save() 
                 except Exception, e:
                         logger.error('Core error. This seems like a misconfiguration or bug: %r. This error will not be relayed to the user!' % e)
                         logger.log_exc("Exception in observer run loop")
diff --git a/xos/synchronizers/base/syncstep.py b/xos/synchronizers/base/syncstep.py
index 54c4b89..e6b8d55 100644
--- a/xos/synchronizers/base/syncstep.py
+++ b/xos/synchronizers/base/syncstep.py
@@ -227,8 +227,9 @@
                         self.delete_record(o)
                         o.delete(purge=True)
                     else:
+                        new_enacted = datetime.now() # Is this the same timezone? XXX
                         self.sync_record(o)
-                        o.enacted = datetime.now() # Is this the same timezone? XXX
+                        o.enacted = new_enacted
                         scratchpad = {'next_run':0, 'exponent':0, 'last_success':time.time()}
                         o.backend_register = json.dumps(scratchpad)
                         o.backend_status = "1 - OK"
diff --git a/xos/synchronizers/model_policy.py b/xos/synchronizers/model_policy.py
index b8fdd5d..d0bbbb1 100644
--- a/xos/synchronizers/model_policy.py
+++ b/xos/synchronizers/model_policy.py
@@ -52,7 +52,7 @@
     return
 
 
-@atomic
+#@atomic
 def execute_model_policy(instance, deleted):
     # Automatic dirtying
     if (instance in bad_instances):