').addClass('data-body').appendTo($dataTable);
// Setup input table headers
if (reorder) {
$('
').addClass('reorder').appendTo($thead);
- $(' | ').addClass('reorder').appendTo($inputForm);
+ if (!args.doNotShowInputTable){
+ $(' | ').addClass('reorder').appendTo($inputForm);
+ }
$multi.find('.data-body').sortable({
handle: '.action.moveDrag',
@@ -946,6 +953,13 @@
});
}
+ if (args.editOptionsFirst && args.actions && !args.noHeaderActionsColumn) {
+ $thead.append($(' | | ').html(_l('label.actions')).addClass('multi-actions'));
+ if (!args.doNotShowInputTable){
+ $inputForm.append($('
| ').addClass('multi-actions'));
+ }
+ }
+
$.each(args.fields, function(fieldName, field) {
if (!field) return true;
@@ -954,7 +968,10 @@
$th.appendTo($thead);
var $td = $('
').addClass(fieldName);
$td.attr('rel', fieldName);
- $td.appendTo($inputForm);
+
+ if (!args.doNotShowInputTable){
+ $td.appendTo($inputForm);
+ }
var isHidden = $.isFunction(field.isHidden) ?
field.isHidden({ context: context }) : field.isHidden;
@@ -1071,7 +1088,10 @@
).appendTo($td);
}
- if (field.desc) $input.attr('title', field.desc);
+ if (field.desc){
+ $input.attr('title', field.desc);
+ $th.attr('title', _l(field.desc));
+ }
});
// Setup header fields
@@ -1093,134 +1113,137 @@
.prependTo($multi);
}
- if (args.actions && !args.noHeaderActionsColumn) {
+ if (!args.editOptionsFirst && args.actions && !args.noHeaderActionsColumn) {
$thead.append($(' | | ').html(_l('label.actions')).addClass('multi-actions'));
- $inputForm.append($('
| ').addClass('multi-actions'));
+ if (!args.doNotShowInputTable){
+ $inputForm.append($('
| ').addClass('multi-actions'));
+ }
+ }
+ if($addVM){
+ $addVM.bind('click', function() {
+ // Validate form first
+ if (!$multiForm.valid()) {
+ if ($multiForm.find('input.error:visible').size()) {
+ return false;
+ }
+ }
+
+ var $dataList;
+ var addItem = function(itemData) {
+ var data = {};
+
+ $.each(getMultiData($multi), function(key, value) {
+ if (value != '') {
+ data[key] = value;
+ }
+ });
+
+ // Append custom data
+ var $customFields = $multi.find('tbody td').filter(function() {
+ return $(this).data('multi-custom-data');
+ });
+
+ $customFields.each(function() {
+ var $field = $(this);
+ var fieldID = $field.attr('rel');
+ var fieldData = $field.data('multi-custom-data');
+
+ data[fieldID] = fieldData;
+ });
+
+ // Loading appearance
+ var $loading = _medit.loadingItem($multi, _l('label.adding') + '...');
+ $dataBody.prepend($loading);
+
+ // Clear out fields
+ $multi.find('input').each(function() {
+ var $input = $(this);
+
+ if ($input.is(":checkbox")) {
+ $input.attr({
+ checked: false
+ });
+ } else if ($input.data('multi-default-value')) {
+ $input.val($input.data('multi-default-value'));
+ } else {
+ $input.val('');
+ }
+ });
+ $multi.find('tbody td').each(function() {
+ var $item = $(this);
+
+ if ($item.data('multi-custom-data')) {
+ $item.data('multi-custom-data', null);
+ }
+ });
+
+ // Apply action
+ args.add.action({
+ context: context,
+ data: data,
+ itemData: itemData,
+ $multi: $multi,
+ response: {
+ success: function(successArgs) {
+ var notification = successArgs ? successArgs.notification : null;
+ if (notification) {
+ $('.notifications').notifications('add', {
+ section: 'network',
+ desc: notification.label,
+ interval: 3000,
+ _custom: successArgs._custom,
+ poll: function(pollArgs) {
+ var complete = pollArgs.complete;
+ var error = pollArgs.error;
+
+ notification.poll({
+ _custom: pollArgs._custom,
+ complete: function(completeArgs) {
+ complete(args);
+ $loading.remove();
+ getData();
+ },
+
+ error: function(args) {
+ error(args);
+ $loading.remove();
+
+ return cloudStack.dialog.error(args);
+ }
+ });
+ }
+ });
+ } else {
+ $loading.remove();
+ getData();
+ }
+ },
+
+ error: cloudStack.dialog.error(function() {
+ $loading.remove();
+ })
+ }
+ });
+ };
+
+ if (args.noSelect) {
+ // Don't append instance data
+ addItem([]);
+
+ return true;
+ }
+
+ _medit.vmList($multi,
+ args.listView,
+ args.context,
+ multipleAdd, _l('label.add.vms'),
+ addItem);
+
+ return true;
+ });
}
-
- $addVM.bind('click', function() {
- // Validate form first
- if (!$multiForm.valid()) {
- if ($multiForm.find('input.error:visible').size()) {
- return false;
- }
- }
-
- var $dataList;
- var addItem = function(itemData) {
- var data = {};
-
- $.each(getMultiData($multi), function(key, value) {
- if (value != '') {
- data[key] = value;
- }
- });
-
- // Append custom data
- var $customFields = $multi.find('tbody td').filter(function() {
- return $(this).data('multi-custom-data');
- });
-
- $customFields.each(function() {
- var $field = $(this);
- var fieldID = $field.attr('rel');
- var fieldData = $field.data('multi-custom-data');
-
- data[fieldID] = fieldData;
- });
-
- // Loading appearance
- var $loading = _medit.loadingItem($multi, _l('label.adding') + '...');
- $dataBody.prepend($loading);
-
- // Clear out fields
- $multi.find('input').each(function() {
- var $input = $(this);
-
- if ($input.is(":checkbox")) {
- $input.attr({
- checked: false
- });
- } else if ($input.data('multi-default-value')) {
- $input.val($input.data('multi-default-value'));
- } else {
- $input.val('');
- }
- });
- $multi.find('tbody td').each(function() {
- var $item = $(this);
-
- if ($item.data('multi-custom-data')) {
- $item.data('multi-custom-data', null);
- }
- });
-
- // Apply action
- args.add.action({
- context: context,
- data: data,
- itemData: itemData,
- $multi: $multi,
- response: {
- success: function(successArgs) {
- var notification = successArgs ? successArgs.notification : null;
- if (notification) {
- $('.notifications').notifications('add', {
- section: 'network',
- desc: notification.label,
- interval: 3000,
- _custom: successArgs._custom,
- poll: function(pollArgs) {
- var complete = pollArgs.complete;
- var error = pollArgs.error;
-
- notification.poll({
- _custom: pollArgs._custom,
- complete: function(completeArgs) {
- complete(args);
- $loading.remove();
- getData();
- },
-
- error: function(args) {
- error(args);
- $loading.remove();
-
- return cloudStack.dialog.error(args);
- }
- });
- }
- });
- } else {
- $loading.remove();
- getData();
- }
- },
-
- error: cloudStack.dialog.error(function() {
- $loading.remove();
- })
- }
- });
- };
-
- if (args.noSelect) {
- // Don't append instance data
- addItem([]);
-
- return true;
- }
-
- _medit.vmList($multi,
- args.listView,
- args.context,
- multipleAdd, _l('label.add.vms'),
- addItem);
-
- return true;
- });
-
var listView = args.listView;
+ var editOptionsFirst = args.editOptionsFirst;
var getData = function() {
dataProvider({
context: context,
@@ -1247,7 +1270,8 @@
listView: listView,
tags: tags,
reorder: reorder,
- selectPermission: selectPermission
+ selectPermission: selectPermission,
+ editOptionsFirst: editOptionsFirst
}
).appendTo($dataBody);
});
diff --git a/ui/scripts/vpc.js b/ui/scripts/vpc.js
index 14e41af2b23..40c954f5d00 100644
--- a/ui/scripts/vpc.js
+++ b/ui/scripts/vpc.js
@@ -190,63 +190,14 @@
};
};
- var aclMultiEdit = {
- noSelect: true,
-
- reorder: {
- moveDrag: {
- action: function(args) {
- var rule = args.context.multiRule[0];
- var number = 0;
- var prevItem = args.prevItem ? args.prevItem.number : null;
- var nextItem = args.nextItem ? args.nextItem.number : null;
-
- if (!nextItem) { // Last item
- number = prevItem + 100;
- } else {
- if (nextItem - prevItem <= 10) {
- number = nextItem - parseInt(((nextItem - prevItem) / 2));
- } else {
- number = nextItem > 1 ? nextItem - 10 : 1;
- }
- }
-
- $.ajax({
- url: createURL('updateNetworkACLItem'),
- data: {
- id: rule.id,
- number: number
- },
- success: function(json) {
- var pollTimer = setInterval(function() {
- pollAsyncJobResult({
- _custom: {
- jobId: json.createnetworkaclresponse.jobid
- },
- complete: function() {
- clearInterval(pollTimer);
- args.response.success();
- },
- error: function(errorMsg) {
- clearInterval(pollTimer);
- args.response.error(errorMsg);
- }
- });
- }, 1000);
- }
- });
- }
- }
- },
- fields: {
-
+ var aclRuleFields = {
'number': {
- label: 'label.rule.number',
+ label: 'label.rule.number.short',
+ desc: 'label.rule.number',
edit: true,
isEditable: true
},
-
'cidrlist': {
edit: true,
label: 'label.cidr',
@@ -322,6 +273,13 @@
$portFields.hide();
} else if ($(this).val() == 'all') {
$portFields.hide();
+ $portFields.attr('disabled', 'disabled');
+
+ $icmpFields.hide();
+ $icmpFields.attr('disabled', 'disabled');
+
+ $protocolFields.attr('disabled', 'disabled');
+ $protocolFields.hide();
} else {
$otherFields.show();
$icmpFields.hide();
@@ -378,8 +336,14 @@
$otherFields.hide();
$otherFields.parent().find('label.error').hide();
} else if ($(this).val() == 'all') {
- $portFields.attr('disabled', 'disabled');
$portFields.hide();
+ $portFields.attr('disabled', 'disabled');
+
+ $icmpFields.hide();
+ $icmpFields.attr('disabled', 'disabled');
+
+ $protocolFields.hide();
+ $protocolFields.attr('disabled', 'disabled');
} else {
$otherFields.show();
$otherFields.parent().find('label.error').hide();
@@ -420,7 +384,8 @@
},
'protocolnumber': {
- label: 'label.protocol.number',
+ label: 'label.protocol.number.short',
+ desc: 'label.protocol.number',
edit: true,
isEditable: true
},
@@ -436,6 +401,38 @@
isOptional: true,
isEditable: true
},
+ 'icmptype': {
+ edit: true,
+ label: 'ICMP.type',
+ desc: 'Please specify -1 if you want to allow all ICMP types',
+ defaultValue: '-1',
+ isEditable: true
+ },
+ 'icmpcode': {
+ edit: true,
+ label: 'ICMP.code',
+ desc: 'Please specify -1 if you want to allow all ICMP codes',
+ defaultValue: '-1',
+ isEditable: true
+ },
+ 'traffictype': {
+ label: 'label.traffic.type',
+ isEditable: true,
+ select: function(args) {
+ args.response.success({
+ data: [{
+ name: 'Ingress',
+ description: 'Ingress'
+ }, {
+ name: 'Egress',
+ description: 'Egress'
+ }]
+ });
+ }
+ }
+ };
+
+ var aclRuleFieldsForMultiEdit = {
'networkid': {
label: 'label.select.tier',
select: function(args) {
@@ -472,43 +469,60 @@
});
}
},
- 'icmptype': {
- edit: true,
- label: 'ICMP.type',
- isDisabled: true,
- desc: 'Please specify -1 if you want to allow all ICMP types',
- defaultValue: '-1',
- isEditable: true
- },
- 'icmpcode': {
- edit: true,
- label: 'ICMP.code',
- isDisabled: true,
- desc: 'Please specify -1 if you want to allow all ICMP codes',
- defaultValue: '-1',
- isEditable: true
- },
- 'traffictype': {
- label: 'label.traffic.type',
- isEditable: true,
- select: function(args) {
- args.response.success({
- data: [{
- name: 'Ingress',
- description: 'Ingress'
- }, {
- name: 'Egress',
- description: 'Egress'
- }]
+ };
+
+ jQuery.extend(aclRuleFieldsForMultiEdit, aclRuleFields);
+
+ var aclMultiEdit = {
+ doNotShowInputTable: true,
+ editOptionsFirst: true,
+ noSelect: true,
+ reorder: {
+ moveDrag: {
+ action: function(args) {
+ var rule = args.context.multiRule[0];
+ var number = 0;
+ var prevItem = args.prevItem ? args.prevItem.number : null;
+ var nextItem = args.nextItem ? args.nextItem.number : null;
+
+ if (!nextItem) { // Last item
+ number = prevItem + 100;
+ } else {
+ if (nextItem - prevItem <= 10) {
+ number = nextItem - parseInt(((nextItem - prevItem) / 2));
+ } else {
+ number = nextItem > 1 ? nextItem - 10 : 1;
+ }
+ }
+
+ $.ajax({
+ url: createURL('updateNetworkACLItem'),
+ data: {
+ id: rule.id,
+ number: number
+ },
+ success: function(json) {
+ var pollTimer = setInterval(function() {
+ pollAsyncJobResult({
+ _custom: {
+ jobId: json.createnetworkaclresponse.jobid
+ },
+ complete: function() {
+ clearInterval(pollTimer);
+ args.response.success();
+ },
+ error: function(errorMsg) {
+ clearInterval(pollTimer);
+ args.response.error(errorMsg);
+ }
+ });
+ }, 1000);
+ }
});
}
- },
- 'add-rule': {
- label: 'label.add.rule',
- addButton: true
}
},
-
+ fields: aclRuleFieldsForMultiEdit,
tags: cloudStack.api.tags({
resourceType: 'NetworkACL',
contextId: 'multiRule'
@@ -983,32 +997,6 @@
});
}
},
-
- /*
- rules: {
- title: 'label.rules',
- multiple: true,
- fields: [
- {
- sourceport: { label: 'Source Port' },
- instanceport: { label: 'Instance Port' }
- }
- ],
- dataProvider: function(args) {
- $.ajax({
- url: createURL('listLoadBalancers'),
- data: {
- id: args.context.internalLoadBalancers[0].id
- },
- success: function(json) {
- var item = json.listloadbalancersresponse.loadbalancer[0];
- args.response.success({ data: item.loadbalancerrule });
- }
- });
- }
- },
- */
-
assignedVms: {
title: 'label.assigned.vms',
listView: {
@@ -1333,35 +1321,65 @@
$.ajax({
url: createURL('listNetworkACLs&aclid=' + args.context.aclLists[0].id),
success: function(json) {
- var items = json.listnetworkaclsresponse.networkacl.sort(function(a, b) {
- return a.number >= b.number;
- }).map(function(acl) {
- if (parseInt(acl.protocol)) { // protocol number
- acl.protocolnumber = acl.protocol;
- acl.protocol = "protocolnumber";
- }
+ var items = json.listnetworkaclsresponse.networkacl;
- return acl;
- });
+ if(items){
+ items.sort(function(a, b) {
+ return a.number >= b.number;
+ }).map(function(acl) {
+ if (parseInt(acl.protocol)) { // protocol number
+ acl.protocolnumber = acl.protocol;
+ acl.protocol = "protocolnumber";
+ }
+
+ return acl;
+ });
+ }
args.response.success({
data: items
- /* {
- cidrlist: '10.1.1.0/24',
- protocol: 'TCP',
- startport: 22, endport: 22,
- networkid: 0,
- traffictype: 'Egress'
- },
- {
- cidrlist: '10.2.1.0/24',
- protocol: 'UDP',
- startport: 56, endport: 72,
- networkid: 0,
- trafficType: 'Ingress'
- }
- ]*/
});
+ if(jQuery('#details-tab-aclRules').siblings('div.toolbar').children('div.add').size() === 0){
+ var $addAclRuleDivButton = jQuery('
').addClass('button add');
+ var $spanAddAclRuleButtonMessage = jQuery('').html(_l('label.add.ACL'));
+
+ $addAclRuleDivButton.html($spanAddAclRuleButtonMessage);
+ $addAclRuleDivButton.click(function(){
+ cloudStack.dialog.createForm({
+ form: {
+ title: 'label.add.rule',
+ desc: 'Create a new ACL rule',
+ fields: aclRuleFields
+ },
+ after: function(argsLocal) {
+ var data = argsLocal.data;
+ data.aclid = argsLocal.context.aclLists[0].id;
+ if(data.protocol != 'icmp'){
+ data.icmpcode = undefined;
+ data.icmptype = undefined;
+ }
+ if(data.protocol != 'protocolnumber'){
+ data.protocolnumber = undefined;
+ }
+ if(data.protocol === 'all'){
+ data.startport = undefined;
+ data.endport = undefined;
+ }
+ $.ajax({
+ url: createURL('createNetworkACL'),
+ data: argsLocal.data,
+ type: "POST",
+ success: function(json) {
+ jQuery('button.cancel:visible').click();
+ jQuery('div.toolbar:visible div.refresh').click();
+ }
+ });
+ },
+ context: args.context
+ });
+ });
+ jQuery('#details-tab-aclRules').siblings('div.toolbar').append($addAclRuleDivButton);
+ }
}
});
}