diff --git a/src/sunstone/public/app/tabs/vms-tab.js b/src/sunstone/public/app/tabs/vms-tab.js index f83d36ea80..c76a212634 100644 --- a/src/sunstone/public/app/tabs/vms-tab.js +++ b/src/sunstone/public/app/tabs/vms-tab.js @@ -18,6 +18,7 @@ define(function(require) { require('./vms-tab/panels/info'), require('./vms-tab/panels/capacity'), require('./vms-tab/panels/storage'), + require('./vms-tab/panels/network'), // require('./vms-tab/panels/template') ]; diff --git a/src/sunstone/public/app/tabs/vms-tab/panels/network.js b/src/sunstone/public/app/tabs/vms-tab/panels/network.js new file mode 100644 index 0000000000..d5d1f6f701 --- /dev/null +++ b/src/sunstone/public/app/tabs/vms-tab/panels/network.js @@ -0,0 +1,438 @@ +define(function(require) { + /* + DEPENDENCIES + */ + + var Locale = require('utils/locale'); + var Config = require('sunstone-config'); + var Sunstone = require('sunstone'); + var Humanize = require('utils/humanize'); + var Notifier = require('utils/notifier'); + var Graphs = require('utils/graphs'); + var StateActions = require('../utils/state-actions'); + var OpenNebulaVM = require('opennebula/vm'); + + /* + CONSTANTS + */ + + var TAB_ID = require('../tabId'); + var PANEL_ID = require('./network/panelId'); + //var ATTACH_NIC_DIALOG_ID = require('../dialogs/attach-nic/dialogId'); + var RESOURCE = "VM" + var XML_ROOT = "VM" + + /* + CONSTRUCTOR + */ + + function Panel(info) { + this.panelId = PANEL_ID; + this.title = Locale.tr("Network"); + this.icon = "fa-globe"; + + 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 that = this; + var html = '
\ +
\ +
\ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ +
' + Locale.tr("ID") + '' + Locale.tr("Network") + '' + Locale.tr("IP") + '' + Locale.tr("MAC") + '' + Locale.tr("IPv6 ULA") + '' + Locale.tr("IPv6 Global") + '' + Locale.tr("Actions") + '' ; + + if (Config.isTabActionEnabled("vms-tab", "VM.attachnic")) { + if (StateActions.enabledStateAction("VM.attachnic", + that.element.STATE, + that.element.LCM_STATE) && + OpenNebulaVM.isNICAttachSupported(that.element)) { + html += '\ + ' + } else { + html += '\ + ' + } + } + + html += '
\ +
\ +
' ; + + var externalNetworkAttrs = OpenNebulaVM.retrieveExternalNetworkAttrs(that.element); + if (!$.isEmptyObject(externalNetworkAttrs)) { + html += '
' + + '
' + + '' + + '' + + '' + + '' + + '' + + '' + + ''; + + $.each(externalNetworkAttrs, function(key, value) { + html += '' + + '' + + '' + + ''; + }); + + html += '' + + '
' + Locale.tr("Network Monitoring Attributes") + '
' + key + '' + value + '
' + + '
' + + '
'; + } + + // Do not show statistics for not hypervisors that do not gather net data + if (OpenNebulaVM.isNICGraphsSupported(that.element)) { + html += '\ +
\ +
\ +
\ +

' + Locale.tr("NET RX") + '

\ +
\ +
\ +
\ + \ + \ + \ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +

' + Locale.tr("NET TX") + '

\ +
\ +
\ +
\ + \ + \ + \ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +

' + Locale.tr("NET DOWNLOAD SPEED") + '

\ +
\ +
\ +
\ + \ + \ + \ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +

' + Locale.tr("NET UPLOAD SPEED") + '

\ +
\ +
\ +
\ + \ + \ + \ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
\ +
'; + } + + return html; + } + + function _setup(context) { + var that = this; + /* TODO if (Config.isTabActionEnabled("vms-tab", "VM.saveas")) { + setupSaveAsDialog(); + + $('a.saveas').live('click', function(){ + var b = $(this); + var vm_id = b.parents('form').attr('vmid'); + var disk_id = b.parents('tr').attr('disk_id'); + + popUpSaveAsDialog(vm_id, disk_id); + + //b.html(spinner); + return false; + }); + } */ + + /* TODO if (Config.isTabActionEnabled("vms-tab", "VM.disk_snapshot_cancel")) { + $('a.disk_snapshot_cancel').live('click', function(){ + var b = $(this); + var vm_id = b.parents('form').attr('vmid'); + var disk_id = b.parents('tr').attr('disk_id'); + + Sunstone.runAction('VM.disk_snapshot_cancel', vm_id, disk_id); + + return false; + }); + } */ + + var nics = [] + + if ($.isArray(that.element.TEMPLATE.NIC)) + nics = that.element.TEMPLATE.NIC + else if (!$.isEmptyObject(that.element.TEMPLATE.NIC)) + nics = [that.element.TEMPLATE.NIC] + + var nic_dt_data = []; + if (nics.length) { + var nic_dt_data = []; + + for (var i = 0; i < nics.length; i++) { + var nic = nics[i]; + + var actions; + // Attach / Detach + if ( + (// ACTIVE + that.element.STATE == "3") && + (// HOTPLUG_NIC + that.element.LCM_STATE == "25") && + (// + nic.ATTACH == "YES") + ) { + actions = Locale.tr("attach/detach in progress") + } else { + actions = ''; + + if (Config.isTabActionEnabled("vms-tab", "VM.detachnic")) { + if (StateActions.enabledStateAction("VM.detachnic", that.element.STATE, that.element.LCM_STATE)) { + actions += '' + Locale.tr("Detach") + '' + } + } + } + + var secgroups = []; + + var nic_secgroups = {}; + if (nic.SECURITY_GROUPS != undefined) { + $.each(nic.SECURITY_GROUPS.split(","), function() { + nic_secgroups[this] = true; + }); + } + + if (that.element.TEMPLATE.SECURITY_GROUP_RULE != undefined) { + $.each(that.element.TEMPLATE.SECURITY_GROUP_RULE, function() { + if (nic_secgroups[this.SECURITY_GROUP_ID]) { + secgroups.push(this); + } + }); + } + + nic_dt_data.push({ + NIC_ID : nic.NIC_ID, + NETWORK : nic.NETWORK, + IP : (nic.IP ? nic.IP : "--"), + MAC : nic.MAC, + IP6_ULA : (nic.IP6_ULA ? nic.IP6_ULA : "--"), + IP6_GLOBAL : (nic.IP6_GLOBAL ? nic.IP6_GLOBAL : "--"), + ACTIONS : actions, + SECURITY_GROUP_RULES : secgroups + }); + } + } + + var nics_table = $("#tab_network_form .nics_table", context).DataTable({ + "bDeferRender": true, + "data": nic_dt_data, + "columns": [ + { + "class": 'open-control', + "orderable": false, + "data": null, + "defaultContent": '' + }, + {"data": "NIC_ID", "defaultContent": ""}, + {"data": "NETWORK", "defaultContent": ""}, + {"data": "IP", "defaultContent": ""}, + {"data": "MAC", "defaultContent": ""}, + {"data": "IP6_ULA", "defaultContent": ""}, + {"data": "IP6_GLOBAL", "defaultContent": ""}, + {"data": "ACTIONS", "defaultContent": ""}, + {"defaultContent": ""} + ], + + "fnRowCallback": function(nRow, aData, iDisplayIndex, iDisplayIndexFull) { + + if (aData.SECURITY_GROUP_RULES == undefined || + aData.SECURITY_GROUP_RULES.length == 0) { + + $("td.open-control", nRow).html("").removeClass('open-control'); + } + + $(nRow).attr("nic_id", aData.NIC_ID); + } + }); + + $("#tab_network_form .nics_table", context).dataTable().fnSort([[1, 'asc']]); + + // Add event listener for opening and closing each NIC row details + context.off('click', '#tab_network_form .nics_table td.open-control') + context.on('click', '#tab_network_form .nics_table td.open-control', function () { + var row = $(this).closest('table').DataTable().row($(this).closest('tr')); + + if (row.child.isShown()) { + row.child.hide(); + $(this).children("span").addClass('fa-chevron-down'); + $(this).children("span").removeClass('fa-chevron-up'); + } else { + var html = '
\ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + \ + ' ; + + $.each(row.data().SECURITY_GROUP_RULES, function(index, elem) { + var rule_st = sg_rule_to_st(this); + + var new_tr = '\ + \ + \ + \ + \ + \ + \ + \ + ' + + html += new_tr; + }); + + row.child(html).show(); + $(this).children("span").removeClass('fa-chevron-down'); + $(this).children("span").addClass('fa-chevron-up'); + } + }); + + if (Config.isTabActionEnabled("vms-tab", "VM.attachnic")) { + context.off('click', '#attach_nic'); + context.on('click', '#attach_nic', function() { + //TODO var dialog = Sunstone.getDialog(ATTACH_NIC_DIALOG_ID); + //TODO dialog.setElement(that.element); + //TODO dialog.show(); + return false; + }); + } + + if (Config.isTabActionEnabled("vms-tab", "VM.detachdisk")) { + context.off('click', '.detachdisk'); + context.on('click', '.detachdisk', function() { + var nic_id = $(this).parents('tr').attr('nic_id'); + Sunstone.runAction('VM.detachnic', that.element.ID, nic_id); + return false; + }); + } + } + + function _onShow(context) { + var that = this; + if (OpenNebulaVM.isNICGraphsSupported(that.element)) { + OpenNebulaVM.monitor({ + data: { + id: that.element.ID, + monitor: { + monitor_resources : "NET_TX,NET_RX" + } + }, + success: function(req, response) { + var vmGraphs = [ + { + labels : Locale.tr("Network reception"), + monitor_resources : "NET_RX", + humanize_figures : true, + convert_from_bytes : true, + div_graph : $("#vm_net_rx_graph") + }, + { + labels : Locale.tr("Network transmission"), + monitor_resources : "NET_TX", + humanize_figures : true, + convert_from_bytes : true, + div_graph : $("#vm_net_tx_graph") + }, + { + labels : Locale.tr("Network reception speed"), + monitor_resources : "NET_RX", + humanize_figures : true, + convert_from_bytes : true, + y_sufix : "B/s", + derivative : true, + div_graph : $("#vm_net_rx_speed_graph") + }, + { + labels : Locale.tr("Network transmission speed"), + monitor_resources : "NET_TX", + humanize_figures : true, + convert_from_bytes : true, + y_sufix : "B/s", + derivative : true, + div_graph : $("#vm_net_tx_speed_graph") + } + ]; + + for (var i = 0; i < vmGraphs.length; i++) { + Graphs.plot(response, vmGraphs[i]); + } + }, + error: Notifier.onError + }); + } + } +}); diff --git a/src/sunstone/public/app/tabs/vms-tab/panels/network/panelId.js b/src/sunstone/public/app/tabs/vms-tab/panels/network/panelId.js new file mode 100644 index 0000000000..0279adb5d4 --- /dev/null +++ b/src/sunstone/public/app/tabs/vms-tab/panels/network/panelId.js @@ -0,0 +1,3 @@ +define(function(require) { + return 'vm_network_tab'; +});
' + tr("Security Group") + '' + tr("Protocol") + '' + tr("Type") + '' + tr("Range") + '' + tr("Network") + '' + tr("ICMP Type") + '
' + this.SECURITY_GROUP_ID + '' + this.SECURITY_GROUP_NAME + '' + rule_st.PROTOCOL + '' + rule_st.RULE_TYPE + '' + rule_st.RANGE + '' + rule_st.NETWORK + '' + rule_st.ICMP_TYPE + '