feature #3748: Add capacity template panel

src/sunstone/public/app/tabs/vms-tab.js

@@ -9,11 +9,13 @@ define(function(require) {
 
   var _dialogs = [
     require('./vms-tab/dialogs/deploy'),
-    require('./vms-tab/dialogs/migrate')
+    require('./vms-tab/dialogs/migrate'),
+    require('./vms-tab/dialogs/resize')
   ];
 
   var _panels = [
     require('./vms-tab/panels/info'),
+    require('./vms-tab/panels/capacity'),
   //  require('./vms-tab/panels/template')
   ];
 

src/sunstone/public/app/tabs/vms-tab/panels/capacity.js

@@ -0,0 +1,108 @@
+define(function(require) {
+  /*
+    DEPENDENCIES
+   */
+  
+  var Locale = require('utils/locale');
+  var Config = require('sunstone-config');
+  var Sunstone = require('sunstone');
+  var OpenNebulaVM = require('opennebula/vm');
+  var Notifier = require('utils/notifier');
+  var Graphs = require('utils/graphs');
+
+  /*
+    TEMPLATES
+   */
+  
+  var TemplateInfo = require('hbs!./capacity/html');
+
+  /*
+    CONSTANTS
+   */
+  
+  var TAB_ID = require('../tabId');
+  var PANEL_ID = require('./capacity/panelId');
+  var RESIZE_DIALOG_ID = require('../dialogs/resize/dialogId');
+  var RESOURCE = "VM"
+  var XML_ROOT = "VM"
+  // If VM is not INIT, PENDING, HOLD, FAILED, POWEROFF, UNDEPLOYED,
+  var RESIZE_STATES = ["0", "1", "2", "7", "8", "9"];
+
+  /*
+    CONSTRUCTOR
+   */
+
+  function Panel(info) {
+    this.panelId = PANEL_ID;
+    this.title = Locale.tr("Capacity");
+    this.icon = "fa-laptop";
+
+    this.element = info[XML_ROOT];
+
+    return this;
+  };
+
+  Panel.PANEL_ID = PANEL_ID;
+  Panel.prototype.html = _html;
+  Panel.prototype.setup = _setup;
+  Panel.prototype.onShow = _onShow;
+
+  return Panel;
+
+  /*
+    FUNCTION DEFINITIONS
+   */
+
+  function _html() {
+    var resizeStateEnabled = (RESIZE_STATES.indexOf(this.element.STATE) > -1)
+
+    return TemplateInfo({
+      'element': this.element,
+      'resizeStateEnabled': resizeStateEnabled
+    });
+  }
+
+  function _setup(context) {
+    var that = this;
+    if (Config.isTabActionEnabled("vms-tab", "VM.resize")) {
+      context.on('click', '#resize_capacity', function() {
+        var dialog = Sunstone.getDialog(RESIZE_DIALOG_ID);
+        dialog.setElement(that.element);
+        dialog.show();
+        return false;
+      });
+    }
+  }
+
+  function _onShow(context) {
+    OpenNebulaVM.monitor({
+      data: {
+        id: this.element.ID, 
+        monitor: {
+          monitor_resources : "CPU,MEMORY"
+        }
+      },
+      success: function(req, response) {
+        var vmGraphs = [
+          {
+            monitor_resources : "CPU",
+            labels : Locale.tr("Real CPU"),
+            humanize_figures : false,
+            div_graph : $(".vm_cpu_graph")
+          },
+          {
+            monitor_resources : "MEMORY",
+            labels : Locale.tr("Real MEM"),
+            humanize_figures : true,
+            div_graph : $(".vm_memory_graph")
+          }
+        ];
+
+        for (var i = 0; i < vmGraphs.length; i++) {
+          Graphs.plot(response, vmGraphs[i]);
+        }
+      },
+      error: Notifier.onError
+    });
+  }
+});

src/sunstone/public/app/tabs/vms-tab/panels/capacity/html.hbs

@@ -0,0 +1,60 @@
+<div class="row">
+  <div class="large-9 columns">
+    <table class="info_table dataTable extended_table">
+      <thead>
+        <tr>
+          <th>{{tr "CPU"}}</th>
+          <th>{{tr "VCPU"}}</th>
+          <th>{{tr "MEMORY"}}</th>
+          <th>{{tr "Cost / CPU"}}</th>
+          <th>{{tr "Cost / MByte"}}</th>
+          <th></th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td id="cpu_info">{{valOrDefault element.TEMPLATE.CPU '-'}}</td>
+          <td id="vcpu_info">{{valOrDefault element.TEMPLATE.VCPU '-'}}</td>
+          <td id="memory_info">{{humanizeSize "MB" element.TEMPLATE.MEMORY}}</td>
+          <td id="cpu_cost_info">{{valOrDefault element.TEMPLATE.CPU_COST '-'}}</td>
+          <td id="memory_cost_info" >{{valOrDefault element.TEMPLATE.MEMORY_COST '-'}}</td>
+          <td>
+          {{#isTabActionEnabled "vms-tab" "VM.resize"}}
+          {{#if resizeStateEnabled}}
+            <button id="resize_capacity" class="button tiny success right radius" >{{tr "Resize"}}</button>
+          {{else}}
+            <button id="resize_capacity" class="button tiny success right radius" disabled="disabled">{{tr "Resize"}}</button>
+          {{/if}}
+          {{/isTabActionEnabled}}
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</div>
+<div class="row">
+  <div class="large-6 columns">
+    <div class="row text-center">
+      <div class="large-12 columns">
+        <h3 class="subheader">
+          <small>{{tr "REAL CPU"}}</small>
+        </h3>
+      </div>
+    </div>
+    <div class="row">
+      <div class="large-12 columns">
+        <div class="large-12 columns centered graph vm_cpu_graph" style="height: 100px;"></div>
+      </div>
+    </div>
+  </div>
+  <div class="large-6 columns">
+    <div class="row text-center">
+      <h3 class="subheader">
+        <small>{{tr "REAL MEMORY"}}</small>
+      </h3>
+    </div>
+    <div class="row">
+      <div class="large-12 columns centered graph vm_memory_graph" style="height: 100px;"></div>
+    </div>
+  </div>
+</div>

src/sunstone/public/app/tabs/vms-tab/panels/capacity/panelId.js

@@ -0,0 +1,3 @@
+define(function(require){
+  return 'vm_capacity_tab';
+});