diff --git a/ui/index.jsp b/ui/index.jsp
index 51d18805545..4a82266f269 100644
--- a/ui/index.jsp
+++ b/ui/index.jsp
@@ -1550,6 +1550,7 @@
+
diff --git a/ui/scripts/lbStickyPolicy.js b/ui/scripts/lbStickyPolicy.js
new file mode 100644
index 00000000000..2ba5d078c6b
--- /dev/null
+++ b/ui/scripts/lbStickyPolicy.js
@@ -0,0 +1,112 @@
+(function($, cloudStack) {
+ cloudStack.lbStickyPolicy = function(args) {
+ return function(args) {
+ var success = args.response.success;
+ var context = args.context;
+ var network = args.context.networks[0];
+
+ var lbService = $.grep(network.service, function(service) {
+ return service.name == 'Lb';
+ })[0];
+ var stickinessCapabilities = JSON.parse(
+ $.grep(lbService.capability, function(capability) {
+ return capability.name == 'SupportedStickinessMethods';
+ })[0].value
+ );
+
+ var baseFields = {
+ name: { label: 'Name', validation: { required: true }, isHidden: true },
+ mode: { label: 'Mode', isHidden: true },
+ length: { label: 'Length', validation: { required: true }, isHidden: true },
+ holdtime: { label: 'Hold Time', validation: { required: true }, isHidden: true },
+ tablesize: { label: 'Table size', isHidden: true },
+ expire: { label: 'Expire', isHidden: true },
+ requestlearn: { label: 'Request-Learn', isBoolean: true, isHidden: true },
+ prefix: { label: 'Prefix', isBoolean: true, isHidden: true },
+ nocache: { label: 'No cache', isBoolean: true, isHidden: true },
+ indirect: { label: 'Indirect', isBoolean: true, isHidden: true },
+ postonly: { label: 'Is post-only', isBoolean: true, isHidden: true },
+ domain: { label: 'Domain', isBoolean: true, isHidden: true }
+ };
+
+ var conditionalFields = {
+ methodname: {
+ label: 'Stickiness method',
+ select: function(args) {
+ var $select = args.$select;
+ var $form = $select.closest('form');
+
+ args.response.success({
+ data: $.map(stickinessCapabilities, function(stickyCapability) {
+ return {
+ id: stickyCapability.methodname,
+ description: stickyCapability.methodname
+ };
+ })
+ }, 500);
+
+ $select.change(function() {
+ var value = $select.val();
+ var showFields = [];
+ var targetMethod = $.grep(stickinessCapabilities, function(stickyCapability) {
+ return stickyCapability.methodname == value;
+ })[0];
+ var visibleParams = $.map(targetMethod.paramlist, function(param) {
+ return param.paramname
+ });
+
+ $select.closest('.form-item').siblings('.form-item').each(function() {
+ var $field = $(this);
+ var id = $field.attr('rel');
+
+ if ($.inArray(id, visibleParams) > -1) {
+ $field.css('display', 'inline-block');
+ } else {
+ $field.hide();
+ }
+ });
+
+ $select.closest(':ui-dialog').dialog('option', 'position', 'center');
+ });
+ }
+ }
+ };
+
+ var fields = $.extend(conditionalFields, baseFields);
+
+ if (args.data) {
+ var populatedFields = $.map(fields, function(field, id) {
+ return id;
+ });
+
+ $(populatedFields).each(function() {
+ var id = this;
+ var field = fields[id];
+ var dataItem = args.data[id];
+
+ if (field.isBoolean) {
+ field.isChecked = dataItem ? true : false;
+ } else {
+ field.defaultValue = dataItem;
+ }
+ });
+ }
+
+ cloudStack.dialog.createForm({
+ form: {
+ title: 'Configure Sticky Policy',
+ desc: 'Please complete the following fields',
+ fields: fields
+ },
+ after: function(args) {
+ var data = cloudStack.serializeForm(args.$form);
+ success({
+ data: $.extend(data, {
+ _buttonLabel: data.methodname.toUpperCase()
+ })
+ });
+ }
+ });
+ };
+ };
+}(jQuery, cloudStack));
diff --git a/ui/scripts/network.js b/ui/scripts/network.js
index 74738404c46..9cd3284d0d4 100644
--- a/ui/scripts/network.js
+++ b/ui/scripts/network.js
@@ -1437,118 +1437,7 @@
label: 'Sticky Policy',
custom: {
buttonLabel: 'Configure',
- action: function(args) {
- var success = args.response.success;
- var fields = {
- methodname: {
- label: 'Stickiness method',
- select: function(args) {
- var $select = args.$select;
- var $form = $select.closest('form');
-
- args.response.success({
- data: [
- {
- id: 'none',
- description: 'None'
- },
- {
- id: 'LbCookie',
- description: 'LB-based'
- },
- {
- id: 'AppCookie',
- description: 'Cookie-based'
- },
- {
- id: 'SourceBased',
- description: 'Source-based'
- }
- ]
- }, 500);
-
- $select.change(function() {
- var value = $select.val();
- var showFields = [];
-
- switch (value) {
- case 'none':
- showFields = [];
- break;
- case 'LbCookie':
- showFields = ['name', 'mode', 'nocache', 'indirect', 'postonly', 'domain'];
- break;
- case 'AppCookie':
- showFields = ['name', 'length', 'holdtime', 'request-learn', 'prefix', 'mode'];
- break;
- case 'SourceBased':
- showFields = ['tablesize', 'expire'];
- break;
- }
-
- $select.closest('.form-item').siblings('.form-item').each(function() {
- var $field = $(this);
- var id = $field.attr('rel');
-
- if ($.inArray(id, showFields) > -1) {
- $field.css('display', 'inline-block');
- } else {
- $field.hide();
- }
- });
-
- $select.closest(':ui-dialog').dialog('option', 'position', 'center');
- });
- }
- },
- name: { label: 'Name', validation: { required: true }, isHidden: true },
- mode: { label: 'Mode', isHidden: true },
- length: { label: 'Length', validation: { required: true }, isHidden: true },
- holdtime: { label: 'Hold Time', validation: { required: true }, isHidden: true },
- tablesize: { label: 'Table size', isHidden: true },
- expire: { label: 'Expire', isHidden: true },
- requestlearn: { label: 'Request-Learn', isBoolean: true, isHidden: true },
- prefix: { label: 'Prefix', isBoolean: true, isHidden: true },
- nocache: { label: 'No cache', isBoolean: true, isHidden: true },
- indirect: { label: 'Indirect', isBoolean: true, isHidden: true },
- postonly: { label: 'Is post-only', isBoolean: true, isHidden: true },
- domain: { label: 'Domain', isBoolean: true, isHidden: true }
- };
-
- if (args.data) {
- var populatedFields = $.map(fields, function(field, id) {
- return id;
- });
-
- $(populatedFields).each(function() {
- var id = this;
- var field = fields[id];
- var dataItem = args.data[id];
-
- if (field.isBoolean) {
- field.isChecked = dataItem ? true : false;
- } else {
- field.defaultValue = dataItem;
- }
- });
- }
-
- cloudStack.dialog.createForm({
- form: {
- title: 'Configure Sticky Policy',
- desc: 'Please complete the following fields',
- fields: fields
- },
- after: function(args) {
- var data = cloudStack.serializeForm(args.$form);
- success({
- data: $.extend(data, {
- _buttonLabel: data.methodname.toUpperCase()
- })
- });
- }
- });
- }
+ action: cloudStack.lbStickyPolicy()
}
},
'add-vm': {
diff --git a/ui/scripts/ui/widgets/detailView.js b/ui/scripts/ui/widgets/detailView.js
index 82ce65728e0..36d81a7f598 100644
--- a/ui/scripts/ui/widgets/detailView.js
+++ b/ui/scripts/ui/widgets/detailView.js
@@ -232,7 +232,7 @@
uiActions.standard($detailView, args, {
noRefresh: true,
complete: function(args) {
- var $browser = $detailView.data('view-args').$browser;
+ var $browser = $('#browser .container');
var $panel = $detailView.closest('.panel');
$browser.cloudBrowser('selectPanel', {