How to request the graph data in ceilometer through Angularjs as Launch Instance?

asked 2015-06-23 22:24:54 -0600

neelabhsingh gravatar image

updated 2015-06-23 22:31:52 -0600

Launch instance is openstack-horizon is made in angularjs similarly I want to added angularjs for graph in ceilometer, please see the following figure. image description

For testing purpose I add following code in stabs.html dir: /horizon/openstack_dashboard/dashboards/admin/metering/templates/metering/stats.html

<div ng-controller="myCtrl">
    First Name: <input type="text" ng-model="firstName"><br>
    First Name: {{ firstName }}
</div>

And corresponding controller I defined in encloud-ceilometer.js new file

(function () {
  'use strict';
  var module = angular.module('hz.dashboard.ceilometer', [ 'ngSanitize' ]);
  module.controller('myCtrl', function($scope) {
    $scope.firstName = "John";
  });  
})();

encloud-ceilometer.js is new file added by me,like launch-instance.js. To add this file in openstack-horizon, I made the following changes, I following the same procedure as for launch instance.

1. I created the folder encloudangular inside the horion/openstack_dashboard/static/dashboard/encloudangular/encloud-ceilometer.js

2. Inside the encloudangular I create the file encloud.ceilometer.js

3. In _10_project.py(dir: horizon/openstack_dashboard/enabled/) file, To include the encloud.ceilometer.js, I added the following line 

#Ceilomenter is added by EncloudEn to make angularversion of ceilometer
CEILOMETER='dashboard/encloudangular/'

In the same file _10_project.py, inside ADD_JS_FILES, include the encloud.ceilometer.js

ADD_JS_FILES = [
    CEILOMETER + 'encloud-ceilometer.js',

4. Now include the new moduel 'hz.dashboard.ceilometer' in 
dashaboard.module.js( dir: horizon/openstack_dashboard/static/dashboard/
dashboard.module.js

_10_project.py

ADD_ANGULAR_MODULES = ['hz.dashboard']

LAUNCH_INST = 'dashboard/launch-instance/'
CEILOMETER='dashboard/encloudangular/'

dashboard.module.js

(function () {
 'use strict';
  var module = angular.module('hz.dashboard', [
    'hz.dashboard.launch-instance',
    'hz.dashboard.ceilometer',
    'hz.dashboard.workflow'
  ]);
  module.constant('dashboardBasePath', '/static/dashboard/');
})();

In dashboard.module.js I have added module hz.dashboard.ceilometer which I have create in encloud-ceilomter

But still I am not able to connect stats.html through 'hz.dashboard.ceilometer', Please help me on this. For testing purpose instacs.html, I am following this like

Please see the First Name Below the graph, image description

Directory of Launch Instance and EncloudCeilometer.
image description

edit retag flag offensive close merge delete