You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cloudstack.apache.org by se...@apache.org on 2013/07/18 18:34:52 UTC
[17/39] Format JS
http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/affinity.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/affinity.js b/ui/scripts/ui-custom/affinity.js
index 1a23ff7..e4a87dd 100644
--- a/ui/scripts/ui-custom/affinity.js
+++ b/ui/scripts/ui-custom/affinity.js
@@ -15,159 +15,160 @@
// specific language governing permissions and limitations
// under the License.
(function(cloudStack, $) {
- cloudStack.uiCustom.affinity = function(args) {
- var listView = args.listView;
- var action = args.action;
- var tierSelect = args.tierSelect;
-
- return function(args) {
- var context = args.context;
- var $instanceRow = args.$instanceRow;
-
- var vmList = function(args) {
- // Create a listing of instances, based on limited information
- // from main instances list view
- var $listView;
- var instances = $.extend(true, {}, args.listView, {
- context: context,
- uiCustom: true
- });
-
- instances.listView.actions = {
- select: {
- label: _l('label.select.instance'),
- type: 'checkbox',
- action: {
- uiCustom: function(args) {
- var $item = args.$item;
- var $input = $item.find('td.actions input:visible');
-
- if ($input.attr('type') == 'checkbox') {
- if ($input.is(':checked'))
- $item.addClass('multi-edit-selected');
- else
- $item.removeClass('multi-edit-selected');
- } else {
- $item.siblings().removeClass('multi-edit-selected');
- $item.addClass('multi-edit-selected');
- }
- }
- }
- }
- };
+ cloudStack.uiCustom.affinity = function(args) {
+ var listView = args.listView;
+ var action = args.action;
+ var tierSelect = args.tierSelect;
+
+ return function(args) {
+ var context = args.context;
+ var $instanceRow = args.$instanceRow;
+
+ var vmList = function(args) {
+ // Create a listing of instances, based on limited information
+ // from main instances list view
+ var $listView;
+ var instances = $.extend(true, {}, args.listView, {
+ context: context,
+ uiCustom: true
+ });
- $listView = $('<div>').listView(instances);
-
- // Change action label
- $listView.find('th.actions').html(_l('label.select'));
-
- return $listView;
- };
-
- var $dataList = vmList({
- listView: listView
- }).dialog({
- dialogClass: 'multi-edit-add-list panel',
- width: 825,
- title: _l('label.affinity.groups'),
- buttons: [
- {
- text: _l('label.apply'),
- 'class': 'ok',
- click: function() {
- if ($dataList.find('.tier-select select').val() == -1) {
- cloudStack.dialog.notice({ message: ('Please select a tier')});
- return false;
- }
-
- var complete = args.complete;
- var start = args.start;
-
- start();
- $dataList.fadeOut(function() {
- action({
- tierID: $dataList.find('.tier-select select').val(),
- _subselect: $dataList.find('tr.multi-edit-selected .subselect select').val(),
- context: $.extend(true, {}, context, {
- affinityGroups: $dataList.find('tbody tr').map(function(index, elem) {
- var itemData = $(elem).data('json-obj');
- itemData._isSelected = false;
-
- if ($(elem).hasClass('multi-edit-selected')) {
- itemData._isSelected = true;
- }
-
- return itemData;
- })
- }),
- response: {
- success: function(args) {
- complete({
- _custom: args._custom,
- $item: $instanceRow
- });
- },
- error: function(args) {
- cloudStack.dialog.notice({ message: args });
+ instances.listView.actions = {
+ select: {
+ label: _l('label.select.instance'),
+ type: 'checkbox',
+ action: {
+ uiCustom: function(args) {
+ var $item = args.$item;
+ var $input = $item.find('td.actions input:visible');
+
+ if ($input.attr('type') == 'checkbox') {
+ if ($input.is(':checked'))
+ $item.addClass('multi-edit-selected');
+ else
+ $item.removeClass('multi-edit-selected');
+ } else {
+ $item.siblings().removeClass('multi-edit-selected');
+ $item.addClass('multi-edit-selected');
+ }
+ }
+ }
+ }
+ };
+
+ $listView = $('<div>').listView(instances);
+
+ // Change action label
+ $listView.find('th.actions').html(_l('label.select'));
+
+ return $listView;
+ };
+
+ var $dataList = vmList({
+ listView: listView
+ }).dialog({
+ dialogClass: 'multi-edit-add-list panel',
+ width: 825,
+ title: _l('label.affinity.groups'),
+ buttons: [{
+ text: _l('label.apply'),
+ 'class': 'ok',
+ click: function() {
+ if ($dataList.find('.tier-select select').val() == -1) {
+ cloudStack.dialog.notice({
+ message: ('Please select a tier')
+ });
+ return false;
+ }
+
+ var complete = args.complete;
+ var start = args.start;
+
+ start();
+ $dataList.fadeOut(function() {
+ action({
+ tierID: $dataList.find('.tier-select select').val(),
+ _subselect: $dataList.find('tr.multi-edit-selected .subselect select').val(),
+ context: $.extend(true, {}, context, {
+ affinityGroups: $dataList.find('tbody tr').map(function(index, elem) {
+ var itemData = $(elem).data('json-obj');
+ itemData._isSelected = false;
+
+ if ($(elem).hasClass('multi-edit-selected')) {
+ itemData._isSelected = true;
+ }
+
+ return itemData;
+ })
+ }),
+ response: {
+ success: function(args) {
+ complete({
+ _custom: args._custom,
+ $item: $instanceRow
+ });
+ },
+ error: function(args) {
+ cloudStack.dialog.notice({
+ message: args
+ });
+ }
+ }
+ });
+ $dataList.remove();
+ });
+
+ $('div.overlay').fadeOut(function() {
+ $('div.overlay').remove();
+ $(':ui-dialog').dialog('destroy');
+ });
+ }
+ }, {
+ text: _l('label.cancel'),
+ 'class': 'cancel',
+ click: function() {
+ $dataList.fadeOut(function() {
+ $dataList.remove();
+ });
+ $('div.overlay').fadeOut(function() {
+ $('div.overlay').remove();
+ $(':ui-dialog').dialog('destroy');
+ });
+ }
+ }]
+ }).parent('.ui-dialog').overlay();
+
+ // Add tier select dialog
+ if (tierSelect) {
+ var $toolbar = $dataList.find('.toolbar');
+ var $tierSelect = $('<div>').addClass('filters tier-select').prependTo($toolbar);
+ var $tierSelectLabel = $('<label>').html('Select tier').appendTo($tierSelect);
+ var $tierSelectInput = $('<select>').appendTo($tierSelect);
+
+ // Get tier data
+ tierSelect({
+ context: context,
+ $tierSelect: $tierSelect,
+ response: {
+ success: function(args) {
+ var data = args.data;
+
+ $(data).map(function(index, item) {
+ var $option = $('<option>');
+
+ $option.attr('value', item.id);
+ $option.html(item.description);
+ $option.appendTo($tierSelectInput);
+ });
+ },
+ error: function(message) {
+ cloudStack.dialog.notice({
+ message: message ? message : 'Could not retrieve VPC tiers'
+ });
+ }
}
- }
});
- $dataList.remove();
- });
-
- $('div.overlay').fadeOut(function() {
- $('div.overlay').remove();
- $(':ui-dialog').dialog('destroy');
- });
- }
- },
- {
- text: _l('label.cancel'),
- 'class': 'cancel',
- click: function() {
- $dataList.fadeOut(function() {
- $dataList.remove();
- });
- $('div.overlay').fadeOut(function() {
- $('div.overlay').remove();
- $(':ui-dialog').dialog('destroy');
- });
}
- }
- ]
- }).parent('.ui-dialog').overlay();
-
- // Add tier select dialog
- if (tierSelect) {
- var $toolbar = $dataList.find('.toolbar');
- var $tierSelect = $('<div>').addClass('filters tier-select').prependTo($toolbar);
- var $tierSelectLabel = $('<label>').html('Select tier').appendTo($tierSelect);
- var $tierSelectInput = $('<select>').appendTo($tierSelect);
-
- // Get tier data
- tierSelect({
- context: context,
- $tierSelect: $tierSelect,
- response: {
- success: function(args) {
- var data = args.data;
-
- $(data).map(function(index, item) {
- var $option = $('<option>');
-
- $option.attr('value', item.id);
- $option.html(item.description);
- $option.appendTo($tierSelectInput);
- });
- },
- error: function(message) {
- cloudStack.dialog.notice({
- message: message ? message : 'Could not retrieve VPC tiers'
- });
- }
- }
- });
- }
+ };
};
- };
}(cloudStack, jQuery));
http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/autoscaler.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/autoscaler.js b/ui/scripts/ui-custom/autoscaler.js
index 119b672..6a36b88 100644
--- a/ui/scripts/ui-custom/autoscaler.js
+++ b/ui/scripts/ui-custom/autoscaler.js
@@ -16,386 +16,403 @@
// under the License.
(function($, cloudStack) {
- cloudStack.uiCustom.autoscaler = function(args) {
- // Place outer args here as local variables
- // i.e, -- var dataProvider = args.dataProvider
- var forms = $.extend(true, {}, args.forms);
- var topfields = forms.topFields;
- var bottomfields = forms.bottomFields;
- var scaleuppolicy = forms.scaleUpPolicy;
- var scaledownpolicy = forms.scaleDownPolicy;
- var dataProvider = cloudStack.autoscaler.dataProvider;
- var actions = cloudStack.autoscaler.autoscaleActions;
- var actionFilter = cloudStack.autoscaler.actionFilter;
-
- return function(args) {
- var context = args.data ?
- $.extend(true, {}, args.context, {
- lbRules: [args.data]
- }) : args.context;
- var formData = args.formData;
- var $autoscalerDialog = $('<div>').addClass('autoscaler');
- var $topFields = $('<div>').addClass('field-group top-fields');
- var $bottomFields = $('<div>').addClass('field-group bottom-fields');
- var $scaleUpPolicy = $('<div>').addClass('scale-up-policy');
- var $slideScaleUp = $('<div></div>').addClass('expand');
- var $hideScaleUp = $('<div></div>').addClass('hide');
- var $scaleUpLabel= $('<div>Show</div>').addClass('slide-label');
- var $scaleUpHideLabel=$('<div>Hide</div>').addClass('slide-label');
- var $scaleDownHideLabel=$('<div>Hide</div>').addClass('slide-label');
- var $scaleDownLabel=$('<div>Show</div>').addClass('slide-label');
- var $slideScaleDown = $('<div></div>').addClass('expand');
- var $hideScaleDown = $('<div></div>').addClass('hide');
- var $scaleUpDivider = $('<hr></hr>').addClass('policy-divider');
- var $scaleDownDivider = $('<hr></hr>').addClass('policy-divider');
- var $bottomFieldDivider = $('<hr></hr>').addClass('policy-divider');
- var $scaleDownPolicy = $('<div>').addClass('scale-down-policy');
- var $scaleUpPolicyTitle = $('<div>').addClass('scale-up-policy-title')
- .html("Scale Up Policy");
- var $scaleDownPolicyTitle = $('<div>').addClass('scale-down-policy-title')
- .html("Scale Down Policy");
- var topFieldForm, $topFieldForm,
- bottomFieldForm, $bottomFieldForm,
- scaleUpPolicyTitleForm, $scaleUpPolicyTitleForm,
- scaleDownPolicyTitleForm, $scaleDownPolicyTitleForm,
- scaleUpPolicyForm, scaleDownPolicyForm;
-
- var renderActions = function(args) {
- var targetActionFilter = args.actionFilter ? args.actionFilter : actionFilter;
- var data = args.data;
- var context = args.context;
- var $actions = $('<div>').addClass('detail-group');
- var $actionsTable = $('<table>').append('<tr>');
- var $detailActions = $('<td>').addClass('detail-actions');
- var $buttons = $('<div>').addClass('buttons');
- var visibleActions = targetActionFilter ?
- targetActionFilter({
- context: $.extend(true, {}, context, {
- originalAutoscaleData: data ? [data] : null
- })
- }) :
- $.map(actions, function(value, key) { return key; });
-
- $detailActions.append($buttons);
- $actionsTable.find('tr').append($detailActions);
- $actions.append($actionsTable);
-
- $(visibleActions).map(function(index, actionID) {
- var action = actions[actionID];
- var label = _l(action.label);
- var $action = $('<div>').addClass('action').addClass(actionID);
- var $icon = $('<a>')
- .attr({ href: '#', title: label })
- .append($('<span>').addClass('icon'));
-
- if (visibleActions.length == 1) $action.addClass('single');
- else if (!index) $action.addClass('first');
- else if (index == visibleActions.length - 1) $action.addClass('last');
-
- // Perform action event
- $action.click(function() {
- var $loading = $('<div>').addClass('loading-overlay').appendTo($autoscalerDialog);
- var success = function(args) {
- $loading.remove();
- cloudStack.dialog.notice({
- message: _l('label.task.completed') + ': ' + label
- });
-
- // Reload actions
- if(data != null) { //data is originalAutoscaleData in \ui\scripts\autoscaler.js
- data['afterActionIsComplete'] = args.data;
- }
-
- var $newActions = renderActions({
- data: data ? $.extend(data, args.data) : args.data,
- actionFilter: args.actionFilter,
- context: context
- });
-
- $actions.after($newActions);
- $actions.remove();
+ cloudStack.uiCustom.autoscaler = function(args) {
+ // Place outer args here as local variables
+ // i.e, -- var dataProvider = args.dataProvider
+ var forms = $.extend(true, {}, args.forms);
+ var topfields = forms.topFields;
+ var bottomfields = forms.bottomFields;
+ var scaleuppolicy = forms.scaleUpPolicy;
+ var scaledownpolicy = forms.scaleDownPolicy;
+ var dataProvider = cloudStack.autoscaler.dataProvider;
+ var actions = cloudStack.autoscaler.autoscaleActions;
+ var actionFilter = cloudStack.autoscaler.actionFilter;
+
+ return function(args) {
+ var context = args.data ?
+ $.extend(true, {}, args.context, {
+ lbRules: [args.data]
+ }) : args.context;
+ var formData = args.formData;
+ var $autoscalerDialog = $('<div>').addClass('autoscaler');
+ var $topFields = $('<div>').addClass('field-group top-fields');
+ var $bottomFields = $('<div>').addClass('field-group bottom-fields');
+ var $scaleUpPolicy = $('<div>').addClass('scale-up-policy');
+ var $slideScaleUp = $('<div></div>').addClass('expand');
+ var $hideScaleUp = $('<div></div>').addClass('hide');
+ var $scaleUpLabel = $('<div>Show</div>').addClass('slide-label');
+ var $scaleUpHideLabel = $('<div>Hide</div>').addClass('slide-label');
+ var $scaleDownHideLabel = $('<div>Hide</div>').addClass('slide-label');
+ var $scaleDownLabel = $('<div>Show</div>').addClass('slide-label');
+ var $slideScaleDown = $('<div></div>').addClass('expand');
+ var $hideScaleDown = $('<div></div>').addClass('hide');
+ var $scaleUpDivider = $('<hr></hr>').addClass('policy-divider');
+ var $scaleDownDivider = $('<hr></hr>').addClass('policy-divider');
+ var $bottomFieldDivider = $('<hr></hr>').addClass('policy-divider');
+ var $scaleDownPolicy = $('<div>').addClass('scale-down-policy');
+ var $scaleUpPolicyTitle = $('<div>').addClass('scale-up-policy-title')
+ .html("Scale Up Policy");
+ var $scaleDownPolicyTitle = $('<div>').addClass('scale-down-policy-title')
+ .html("Scale Down Policy");
+ var topFieldForm, $topFieldForm,
+ bottomFieldForm, $bottomFieldForm,
+ scaleUpPolicyTitleForm, $scaleUpPolicyTitleForm,
+ scaleDownPolicyTitleForm, $scaleDownPolicyTitleForm,
+ scaleUpPolicyForm, scaleDownPolicyForm;
+
+ var renderActions = function(args) {
+ var targetActionFilter = args.actionFilter ? args.actionFilter : actionFilter;
+ var data = args.data;
+ var context = args.context;
+ var $actions = $('<div>').addClass('detail-group');
+ var $actionsTable = $('<table>').append('<tr>');
+ var $detailActions = $('<td>').addClass('detail-actions');
+ var $buttons = $('<div>').addClass('buttons');
+ var visibleActions = targetActionFilter ?
+ targetActionFilter({
+ context: $.extend(true, {}, context, {
+ originalAutoscaleData: data ? [data] : null
+ })
+ }) :
+ $.map(actions, function(value, key) {
+ return key;
+ });
+
+ $detailActions.append($buttons);
+ $actionsTable.find('tr').append($detailActions);
+ $actions.append($actionsTable);
+
+ $(visibleActions).map(function(index, actionID) {
+ var action = actions[actionID];
+ var label = _l(action.label);
+ var $action = $('<div>').addClass('action').addClass(actionID);
+ var $icon = $('<a>')
+ .attr({
+ href: '#',
+ title: label
+ })
+ .append($('<span>').addClass('icon'));
+
+ if (visibleActions.length == 1) $action.addClass('single');
+ else if (!index) $action.addClass('first');
+ else if (index == visibleActions.length - 1) $action.addClass('last');
+
+ // Perform action event
+ $action.click(function() {
+ var $loading = $('<div>').addClass('loading-overlay').appendTo($autoscalerDialog);
+ var success = function(args) {
+ $loading.remove();
+ cloudStack.dialog.notice({
+ message: _l('label.task.completed') + ': ' + label
+ });
+
+ // Reload actions
+ if (data != null) { //data is originalAutoscaleData in \ui\scripts\autoscaler.js
+ data['afterActionIsComplete'] = args.data;
+ }
+
+ var $newActions = renderActions({
+ data: data ? $.extend(data, args.data) : args.data,
+ actionFilter: args.actionFilter,
+ context: context
+ });
+
+ $actions.after($newActions);
+ $actions.remove();
+ };
+ var error = function(message) {
+ $loading.remove();
+ cloudStack.dialog.notice({
+ message: message
+ });
+ };
+
+ action.action({
+ context: {
+ originalAutoscaleData: args.data
+ },
+ response: {
+ success: function(args) {
+ var notification = $.extend(args.notification, {
+ _custom: args._custom,
+ desc: label
+ });
+
+ cloudStack.ui.notifications.add(
+ notification,
+ success, {},
+ error, {}
+ );
+ },
+ error: error
+ }
+ });
+ });
+
+ $action.append($icon);
+ $action.appendTo($buttons);
+ });
+
+ if (!visibleActions || !visibleActions.length) $actions.hide();
+
+ return $actions;
};
- var error = function(message) {
- $loading.remove();
- cloudStack.dialog.notice({ message: message });
+
+ var renderDialogContent = function(args) {
+ var data = args.data ? args.data : {};
+
+ // Setup default values, in case where existing data is present
+ var setDefaultFields = function(fieldID, field) {
+ var fieldData = data[fieldID];
+
+ if (fieldData && !field.isBoolean) {
+ field.defaultValue = fieldData;
+ } else {
+ field.isChecked = fieldData;
+ }
+ };
+ $.each(topfields, setDefaultFields);
+ $.each(bottomfields, setDefaultFields);
+
+ $.extend(context, {
+ originalAutoscaleData: args.data
+ });
+
+ // Create and append top fields
+ // -- uses create form to generate fields
+ topFieldForm = cloudStack.dialog.createForm({
+ context: context,
+ noDialog: true, // Don't render a dialog, just return $formContainer
+ form: {
+ title: '',
+ fields: topfields
+ }
+ });
+ $topFieldForm = topFieldForm.$formContainer;
+ $topFieldForm.appendTo($topFields);
+
+ scaleUpPolicyTitleForm = cloudStack.dialog.createForm({
+ context: context,
+ noDialog: true,
+ form: {
+ title: '',
+ fields: {
+ scaleUpDuration: {
+ label: 'Duration(in sec)',
+ validation: {
+ required: true
+ }
+ }
+ }
+ }
+ });
+ $scaleUpPolicyTitleForm = scaleUpPolicyTitleForm.$formContainer;
+ $scaleUpPolicyTitleForm.appendTo($scaleUpPolicyTitle);
+
+
+ scaleDownPolicyTitleForm = cloudStack.dialog.createForm({
+ context: context,
+ noDialog: true,
+ form: {
+ title: '',
+ fields: {
+ scaleDownDuration: {
+ label: 'Duration(in sec)',
+ validation: {
+ required: true
+ }
+ }
+ }
+ }
+ });
+ $scaleDownPolicyTitleForm = scaleDownPolicyTitleForm.$formContainer;
+ $scaleDownPolicyTitleForm.appendTo($scaleDownPolicyTitle);
+
+ // Make multi-edits
+ //
+ // Scale up policy
+ if (data.scaleUpPolicy && $.isArray(data.scaleUpPolicy.conditions)) {
+ $autoscalerDialog.data('autoscaler-scale-up-data',
+ data.scaleUpPolicy.conditions);
+ }
+
+ if (data.scaleUpPolicy && data.scaleUpPolicy.duration) {
+ $scaleUpPolicyTitleForm.find('input[name=scaleUpDuration]').val(
+ data.scaleUpPolicy.duration
+ );
+ }
+
+ scaleuppolicy.context = context;
+ scaleUpPolicyForm = $scaleUpPolicy.multiEdit(scaleuppolicy);
+
+ // Scale down policy
+ if (data.scaleDownPolicy && $.isArray(data.scaleDownPolicy.conditions)) {
+ $autoscalerDialog.data('autoscaler-scale-down-data',
+ data.scaleDownPolicy.conditions);
+ }
+
+ if (data.scaleDownPolicy && data.scaleDownPolicy.duration) {
+ $scaleDownPolicyTitleForm.find('input[name=scaleDownDuration]').val(
+ data.scaleDownPolicy.duration
+ );
+ }
+
+ scaledownpolicy.context = context;
+ scaleDownPolicyForm = $scaleDownPolicy.multiEdit(scaledownpolicy);
+
+ // Create and append bottom fields
+ bottomFieldForm = cloudStack.dialog.createForm({
+ context: context,
+ noDialog: true, // Don't render a dialog, just return $formContainer
+ form: {
+ title: '',
+ fields: bottomfields
+ }
+ });
+ $bottomFieldForm = bottomFieldForm.$formContainer;
+ $bottomFieldForm.appendTo($bottomFields);
+
+ // Append main div elements
+ $autoscalerDialog.append(
+ $topFields,
+ $scaleUpPolicyTitle,
+ $scaleUpPolicy,
+ $scaleDownPolicyTitle,
+ $scaleDownPolicy,
+ $bottomFields
+ );
+
+ // Render dialog
+ //$autoscalerDialog.find('.form-item[rel=templateNames] label').hide();
+ /* Duration Fields*/
+ //$('div.ui-dialog div.autoscaler').find('div.scale-up-policy-title').append("<br></br>").append($inputLabel = $('<label>').html('Duration').attr({left:'200'})).append($('<input>').attr({ name: 'username' }));
+ //$('div.ui-dialog div.autoscaler').find('div.scale-down-policy-title').append("<br></br>").append($inputLabel = $('<label>').html('Duration').attr({left:'200'})).append($('<input>').attr({ name: 'username' }));
+
+ /*Dividers*/
+ $autoscalerDialog.find('div.scale-up-policy-title').prepend($scaleUpDivider);
+ $autoscalerDialog.find('div.scale-down-policy-title').prepend($scaleDownDivider);
+ $autoscalerDialog.find('div.field-group.bottom-fields').prepend($bottomFieldDivider);
+
+ /* Hide effects for multi-edit table*/
+ $autoscalerDialog.find('div.scale-up-policy').prepend($hideScaleUp);
+ $autoscalerDialog.find('div.scale-down-policy ').prepend($hideScaleDown);
+ $autoscalerDialog.find('div.scale-up-policy').prepend($scaleUpHideLabel);
+ $autoscalerDialog.find('div.scale-down-policy').prepend($scaleDownHideLabel);
+
+ /*Toggling the labels and data-item table - SCALE UP POLICY*/
+ $autoscalerDialog.find('div.scale-up-policy div.hide').click(function() {
+ $autoscalerDialog.find('div.scale-up-policy div.multi-edit div.data-item').slideToggle();
+ $scaleUpLabel = $autoscalerDialog.find('div.scale-up-policy div.slide-label').replaceWith($scaleUpLabel);
+ });
+
+ /*Toggling the images */
+ $('div.ui-dialog div.autoscaler div.scale-up-policy div.hide').click(function() {
+ $(this).toggleClass('expand hide');
+ });
+
+ $('div.ui-dialog div.autoscaler div.scale-down-policy div.hide').click(function() {
+ $(this).toggleClass('expand hide');
+ });
+
+ /*Toggling the labels and data-item table - SCALE DOWN POLICY*/
+ $('div.ui-dialog div.autoscaler div.scale-down-policy div.hide').click(function() {
+ $('div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.data-item').slideToggle();
+ $scaleDownLabel = $('div.ui-dialog div.autoscaler div.scale-down-policy div.slide-label').replaceWith($scaleDownLabel);
+ });
+
+ $('div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.expand').click(function() {
+ $('div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.data-item').slideToggle();
+ });
+
+ $autoscalerDialog.dialog('option', 'position', 'center');
+ $autoscalerDialog.dialog('option', 'height', 'auto');
+
+ // Setup actions
+ renderActions(args).prependTo($autoscalerDialog);
};
- action.action({
- context: {
- originalAutoscaleData: args.data
- },
- response: {
- success: function(args) {
- var notification = $.extend(args.notification, {
- _custom: args._custom,
- desc: label
- });
-
- cloudStack.ui.notifications.add(
- notification,
- success, {},
- error, {}
- );
+ var $loading = $('<div>').addClass('loading-overlay').appendTo($autoscalerDialog);
+ $autoscalerDialog.dialog({
+ title: 'AutoScale Configuration Wizard',
+ width: 825,
+ height: 600,
+ draggable: true,
+ closeonEscape: false,
+ overflow: 'auto',
+ open: function() {
+ $("button").each(function() {
+ $(this).attr("style", "left: 600px; position: relative; margin-right: 5px; ");
+ });
},
- error: error
- }
- });
- });
-
- $action.append($icon);
- $action.appendTo($buttons);
- });
-
- if (!visibleActions || !visibleActions.length) $actions.hide();
-
- return $actions;
- };
-
- var renderDialogContent = function(args) {
- var data = args.data ? args.data : {};
-
- // Setup default values, in case where existing data is present
- var setDefaultFields = function(fieldID, field) {
- var fieldData = data[fieldID];
-
- if (fieldData && !field.isBoolean) {
- field.defaultValue = fieldData;
- } else {
- field.isChecked = fieldData;
- }
- };
- $.each(topfields, setDefaultFields);
- $.each(bottomfields, setDefaultFields);
-
- $.extend(context, {
- originalAutoscaleData: args.data
- });
-
- // Create and append top fields
- // -- uses create form to generate fields
- topFieldForm = cloudStack.dialog.createForm({
- context: context,
- noDialog: true, // Don't render a dialog, just return $formContainer
- form: {
- title: '',
- fields: topfields
- }
- });
- $topFieldForm = topFieldForm.$formContainer;
- $topFieldForm.appendTo($topFields);
-
- scaleUpPolicyTitleForm = cloudStack.dialog.createForm({
- context: context,
- noDialog: true,
- form: {
- title: '',
- fields: {
- scaleUpDuration: { label: 'Duration(in sec)', validation: { required: true } }
- }
- }
- });
- $scaleUpPolicyTitleForm = scaleUpPolicyTitleForm.$formContainer;
- $scaleUpPolicyTitleForm.appendTo($scaleUpPolicyTitle);
-
-
- scaleDownPolicyTitleForm = cloudStack.dialog.createForm({
- context: context,
- noDialog: true,
- form: {
- title: '',
- fields: {
- scaleDownDuration: { label: 'Duration(in sec)', validation: { required: true } }
- }
- }
- });
- $scaleDownPolicyTitleForm = scaleDownPolicyTitleForm.$formContainer;
- $scaleDownPolicyTitleForm.appendTo($scaleDownPolicyTitle);
-
- // Make multi-edits
- //
- // Scale up policy
- if (data.scaleUpPolicy && $.isArray(data.scaleUpPolicy.conditions)) {
- $autoscalerDialog.data('autoscaler-scale-up-data',
- data.scaleUpPolicy.conditions);
- }
-
- if (data.scaleUpPolicy && data.scaleUpPolicy.duration) {
- $scaleUpPolicyTitleForm.find('input[name=scaleUpDuration]').val(
- data.scaleUpPolicy.duration
- );
- }
-
- scaleuppolicy.context = context;
- scaleUpPolicyForm = $scaleUpPolicy.multiEdit(scaleuppolicy);
-
- // Scale down policy
- if (data.scaleDownPolicy && $.isArray(data.scaleDownPolicy.conditions)) {
- $autoscalerDialog.data('autoscaler-scale-down-data',
- data.scaleDownPolicy.conditions);
- }
-
- if (data.scaleDownPolicy && data.scaleDownPolicy.duration) {
- $scaleDownPolicyTitleForm.find('input[name=scaleDownDuration]').val(
- data.scaleDownPolicy.duration
- );
- }
-
- scaledownpolicy.context = context;
- scaleDownPolicyForm = $scaleDownPolicy.multiEdit(scaledownpolicy);
-
- // Create and append bottom fields
- bottomFieldForm = cloudStack.dialog.createForm({
- context: context,
- noDialog: true, // Don't render a dialog, just return $formContainer
- form: {
- title: '',
- fields: bottomfields
- }
- });
- $bottomFieldForm = bottomFieldForm.$formContainer;
- $bottomFieldForm.appendTo($bottomFields);
-
- // Append main div elements
- $autoscalerDialog.append(
- $topFields,
- $scaleUpPolicyTitle,
- $scaleUpPolicy,
- $scaleDownPolicyTitle,
- $scaleDownPolicy,
- $bottomFields
- );
-
- // Render dialog
- //$autoscalerDialog.find('.form-item[rel=templateNames] label').hide();
- /* Duration Fields*/
- //$('div.ui-dialog div.autoscaler').find('div.scale-up-policy-title').append("<br></br>").append($inputLabel = $('<label>').html('Duration').attr({left:'200'})).append($('<input>').attr({ name: 'username' }));
- //$('div.ui-dialog div.autoscaler').find('div.scale-down-policy-title').append("<br></br>").append($inputLabel = $('<label>').html('Duration').attr({left:'200'})).append($('<input>').attr({ name: 'username' }));
-
- /*Dividers*/
- $autoscalerDialog.find('div.scale-up-policy-title').prepend($scaleUpDivider);
- $autoscalerDialog.find('div.scale-down-policy-title').prepend($scaleDownDivider);
- $autoscalerDialog.find('div.field-group.bottom-fields').prepend($bottomFieldDivider);
-
- /* Hide effects for multi-edit table*/
- $autoscalerDialog.find('div.scale-up-policy').prepend($hideScaleUp);
- $autoscalerDialog.find('div.scale-down-policy ').prepend($hideScaleDown);
- $autoscalerDialog.find('div.scale-up-policy').prepend($scaleUpHideLabel);
- $autoscalerDialog.find('div.scale-down-policy').prepend($scaleDownHideLabel);
-
- /*Toggling the labels and data-item table - SCALE UP POLICY*/
- $autoscalerDialog.find('div.scale-up-policy div.hide').click(function() {
- $autoscalerDialog.find('div.scale-up-policy div.multi-edit div.data-item').slideToggle();
- $scaleUpLabel = $autoscalerDialog.find('div.scale-up-policy div.slide-label').replaceWith($scaleUpLabel);
- });
-
- /*Toggling the images */
- $('div.ui-dialog div.autoscaler div.scale-up-policy div.hide').click(function() {
- $(this).toggleClass('expand hide');
- });
-
- $('div.ui-dialog div.autoscaler div.scale-down-policy div.hide').click(function() {
- $(this).toggleClass('expand hide');
- });
-
- /*Toggling the labels and data-item table - SCALE DOWN POLICY*/
- $('div.ui-dialog div.autoscaler div.scale-down-policy div.hide').click(function() {
- $('div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.data-item').slideToggle();
- $scaleDownLabel = $('div.ui-dialog div.autoscaler div.scale-down-policy div.slide-label').replaceWith($scaleDownLabel);
- });
-
- $('div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.expand').click(function() { $('div.ui-dialog div.autoscaler div.scale-down-policy div.multi-edit div.data div.data-item').slideToggle(); });
-
- $autoscalerDialog.dialog('option', 'position', 'center');
- $autoscalerDialog.dialog('option', 'height', 'auto');
-
- // Setup actions
- renderActions(args).prependTo($autoscalerDialog);
- };
-
- var $loading = $('<div>').addClass('loading-overlay').appendTo($autoscalerDialog);
- $autoscalerDialog.dialog({
- title: 'AutoScale Configuration Wizard',
- width: 825,
- height: 600,
- draggable: true,
- closeonEscape: false,
- overflow:'auto',
- open:function() {
- $("button").each(function(){
- $(this).attr("style", "left: 600px; position: relative; margin-right: 5px; ");
- });
- },
- buttons: [
- {
- text: _l('label.cancel'),
- 'class': 'cancel',
- click: function() {
- $autoscalerDialog.dialog('destroy');
- $('.overlay').remove();
- }
- },
- {
- text: _l('Apply'),
- 'class': 'ok',
- click: function() {
- var data = cloudStack.serializeForm($('.ui-dialog .autoscaler form'));
-
- // Pass VPC data
- if (formData.tier) {
- data.tier = formData.tier;
- }
-
- $loading.appendTo($autoscalerDialog);
- cloudStack.autoscaler.actions.apply({
- formData: formData,
+ buttons: [{
+ text: _l('label.cancel'),
+ 'class': 'cancel',
+ click: function() {
+ $autoscalerDialog.dialog('destroy');
+ $('.overlay').remove();
+ }
+ }, {
+ text: _l('Apply'),
+ 'class': 'ok',
+ click: function() {
+ var data = cloudStack.serializeForm($('.ui-dialog .autoscaler form'));
+
+ // Pass VPC data
+ if (formData.tier) {
+ data.tier = formData.tier;
+ }
+
+ $loading.appendTo($autoscalerDialog);
+ cloudStack.autoscaler.actions.apply({
+ formData: formData,
+ context: context,
+ data: data,
+ response: {
+ success: function() {
+ $loading.remove();
+ $autoscalerDialog.dialog('destroy');
+ $autoscalerDialog.closest(':ui-dialog').remove();
+ $('.overlay').remove();
+ cloudStack.dialog.notice({
+ message: 'Autoscale configured successfully.'
+ });
+ },
+ error: function(message) {
+ cloudStack.dialog.notice({
+ message: message
+ });
+ $loading.remove();
+ }
+ }
+ });
+ }
+ }]
+ }).closest('.ui-dialog').overlay();
+
+ dataProvider({
context: context,
- data: data,
response: {
- success: function() {
- $loading.remove();
- $autoscalerDialog.dialog('destroy');
- $autoscalerDialog.closest(':ui-dialog').remove();
- $('.overlay').remove();
- cloudStack.dialog.notice({
- message: 'Autoscale configured successfully.'
- });
- },
- error: function(message) {
- cloudStack.dialog.notice({ message: message });
- $loading.remove();
- }
+ success: function(args) {
+ $loading.remove();
+ renderDialogContent(args);
+
+ if (args.data == null) { //from a new LB rule
+ $autoscalerDialog.find('select[name=serviceOfferingId]').removeAttr('disabled');
+ $autoscalerDialog.find('select[name=securityGroups]').removeAttr('disabled');
+ $autoscalerDialog.find('select[name=diskOfferingId]').removeAttr('disabled');
+ } else { //from an existing LB rule
+ $autoscalerDialog.find('select[name=serviceOfferingId]').attr('disabled', true);
+ $autoscalerDialog.find('select[name=securityGroups]').attr('disabled', true);
+ $autoscalerDialog.find('select[name=diskOfferingId]').attr('disabled', true);
+
+ if (args.data.isAdvanced != null) {
+ $autoscalerDialog.find('input[type=checkbox]').trigger('click');
+ $autoscalerDialog.find('input[type=checkbox]').attr('checked', 'checked');
+ }
+ }
+ }
}
- });
- }
- }
- ]
- }).closest('.ui-dialog').overlay();
-
- dataProvider({
- context: context,
- response: {
- success: function(args) {
- $loading.remove();
- renderDialogContent(args);
-
- if (args.data == null) { //from a new LB rule
- $autoscalerDialog.find('select[name=serviceOfferingId]').removeAttr('disabled');
- $autoscalerDialog.find('select[name=securityGroups]').removeAttr('disabled');
- $autoscalerDialog.find('select[name=diskOfferingId]').removeAttr('disabled');
- }
- else { //from an existing LB rule
- $autoscalerDialog.find('select[name=serviceOfferingId]').attr('disabled', true);
- $autoscalerDialog.find('select[name=securityGroups]').attr('disabled', true);
- $autoscalerDialog.find('select[name=diskOfferingId]').attr('disabled', true);
-
- if(args.data.isAdvanced != null) {
- $autoscalerDialog.find('input[type=checkbox]').trigger('click');
- $autoscalerDialog.find('input[type=checkbox]').attr('checked', 'checked');
- }
- }
- }
- }
- });
+ });
+ };
};
- };
}(jQuery, cloudStack));
http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/dashboard.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/dashboard.js b/ui/scripts/ui-custom/dashboard.js
index 6d92318..7ee2eb7 100644
--- a/ui/scripts/ui-custom/dashboard.js
+++ b/ui/scripts/ui-custom/dashboard.js
@@ -15,178 +15,191 @@
// specific language governing permissions and limitations
// under the License.
(function($, cloudStack) {
- cloudStack.uiCustom.dashboard = function() {
- /**
- * Retrieve chart data
- */
- var getData = function() {
- // Populate data
- $dashboard.find('[data-item]').hide();
- cloudStack.sections.dashboard[dashboardType].dataProvider({
- response: {
- success: function(args) {
- var $browser = $dashboard.closest('#browser .container');
- var data = args.data;
-
- // Iterate over data; populate corresponding DOM elements
- $.each(data, function(key, value) {
- var $elem = $dashboard.find('[data-item=' + key + ']');
-
- // This assumes an array of data
- if ($elem.is('ul')) {
- $elem.show();
- var $liTmpl = $elem.find('li').remove();
- $(value).each(function() {
- var item = this;
- var $li = $liTmpl.clone().appendTo($elem).hide();
-
- if ($li.is('.zone-stats li')) {
- $li.click(function() {
- $browser.cloudBrowser('addPanel', {
- title: _l('label.zone.details'),
- parent: $dashboard.closest('.panel'),
- maximizeIfSelected: true,
- complete: function($newPanel) {
- $newPanel.detailView($.extend(true, {},
- cloudStack.sections.dashboard.admin.zoneDetailView,
- {
- $browser: $browser,
- context: $.extend(true, {}, cloudStack.context, {
- physicalResources: [{ id: item.zoneID }]
- })
+ cloudStack.uiCustom.dashboard = function() {
+ /**
+ * Retrieve chart data
+ */
+ var getData = function() {
+ // Populate data
+ $dashboard.find('[data-item]').hide();
+ cloudStack.sections.dashboard[dashboardType].dataProvider({
+ response: {
+ success: function(args) {
+ var $browser = $dashboard.closest('#browser .container');
+ var data = args.data;
+
+ // Iterate over data; populate corresponding DOM elements
+ $.each(data, function(key, value) {
+ var $elem = $dashboard.find('[data-item=' + key + ']');
+
+ // This assumes an array of data
+ if ($elem.is('ul')) {
+ $elem.show();
+ var $liTmpl = $elem.find('li').remove();
+ $(value).each(function() {
+ var item = this;
+ var $li = $liTmpl.clone().appendTo($elem).hide();
+
+ if ($li.is('.zone-stats li')) {
+ $li.click(function() {
+ $browser.cloudBrowser('addPanel', {
+ title: _l('label.zone.details'),
+ parent: $dashboard.closest('.panel'),
+ maximizeIfSelected: true,
+ complete: function($newPanel) {
+ $newPanel.detailView($.extend(true, {},
+ cloudStack.sections.dashboard.admin.zoneDetailView, {
+ $browser: $browser,
+ context: $.extend(true, {}, cloudStack.context, {
+ physicalResources: [{
+ id: item.zoneID
+ }]
+ })
}
- ));
- }
- });
- });
- }
-
- $.each(item, function(arrayKey, arrayValue) {
- if (!arrayValue) arrayValue = '';
-
- var $arrayElem = $li.find('[data-list-item=' + arrayKey + ']');
-
- $arrayElem.each(function() {
- var $arrayElem = $(this);
-
- if ($arrayElem.hasClass('pie-chart')) {
- // Generate pie chart
- // -- values above 80 have a red color
- setTimeout(function() {
- pieChart($arrayElem, [
- { data: [[1, 100 - arrayValue]], color: '#54697e' },
- { data: [[1, arrayValue]], color: arrayValue < 80 ? 'orange' : 'red' }
- ]);
+ ));
+ }
+ });
+ });
+ }
+
+ $.each(item, function(arrayKey, arrayValue) {
+ if (!arrayValue) arrayValue = '';
+
+ var $arrayElem = $li.find('[data-list-item=' + arrayKey + ']');
+
+ $arrayElem.each(function() {
+ var $arrayElem = $(this);
+
+ if ($arrayElem.hasClass('pie-chart')) {
+ // Generate pie chart
+ // -- values above 80 have a red color
+ setTimeout(function() {
+ pieChart($arrayElem, [{
+ data: [
+ [1, 100 - arrayValue]
+ ],
+ color: '#54697e'
+ }, {
+ data: [
+ [1, arrayValue]
+ ],
+ color: arrayValue < 80 ? 'orange' : 'red'
+ }]);
+ });
+ } else {
+ if ($li.attr('concat-value')) {
+ var val = $(_l(arrayValue).toString().split(', ')).map(function() {
+ var val = _s(this.toString());
+ var concatValue = parseInt($li.attr('concat-value'));
+
+ return val.length >= concatValue ?
+ val.substring(0, concatValue).concat('...') : val;
+ }).toArray().join('<br />');
+
+ $arrayElem.html(val);
+ } else {
+ $arrayElem.html(_s(_l(arrayValue)));
+ }
+
+ $arrayElem.attr('title', _l(arrayValue).toString().replace('<br/>', ', '));
+ }
+ });
+ });
+
+ $li.attr({
+ title: _s(_l(item.description))
+ });
+
+ $li.fadeIn();
+ });
+ } else {
+ $elem.each(function() {
+ var $item = $(this);
+ if ($item.hasClass('chart-line')) {
+ $item.show().animate({
+ width: value + '%'
+ });
+ } else {
+ $item.hide().html(_s(value)).fadeIn();
+ }
+ });
+ }
});
- } else {
- if ($li.attr('concat-value')) {
- var val = $(_l(arrayValue).toString().split(', ')).map(function() {
- var val = _s(this.toString());
- var concatValue = parseInt($li.attr('concat-value'));
-
- return val.length >= concatValue ?
- val.substring(0, concatValue).concat('...') : val;
- }).toArray().join('<br />');
-
- $arrayElem.html(val);
- } else {
- $arrayElem.html(_s(_l(arrayValue)));
- }
-
- $arrayElem.attr('title', _l(arrayValue).toString().replace('<br/>', ', '));
- }
- });
- });
-
- $li.attr({ title: _s(_l(item.description)) });
-
- $li.fadeIn();
- });
- } else {
- $elem.each(function() {
- var $item = $(this);
- if ($item.hasClass('chart-line')) {
- $item.show().animate({ width: value + '%' });
- } else {
- $item.hide().html(_s(value)).fadeIn();
- }
- });
- }
+ }
+ }
});
- }
- }
- });
- };
-
- /**
- * Render circular pie chart, without labels
- */
- var pieChart = function($container, data) {
- $container.css({ width: 70, height: 66 });
- $.plot($container, data, {
- width: 100,
- height: 100,
- series: {
- pie: {
- innerRadius: 0.7,
- show: true,
- label: {
- show: false
- }
- }
- },
- legend: {
- show: false
- }
- });
- };
-
- // Determine if user or admin dashboard should be shown
- var dashboardType = cloudStack.sections.dashboard.adminCheck({
- context: cloudStack.context
- }) ? 'admin' : 'user';
-
- // Get dashboard layout
- var $dashboard = $('#template').find('div.dashboard.' + dashboardType).clone();
-
- // Update text
- $dashboard.find('.button.view-all').html(_l('label.view.all'));
- $dashboard.find('.dashboard-container.sub.alerts.first .top .title span').html(_l('label.general.alerts'));
- $dashboard.find('.dashboard-container.sub.alerts.last .top .title span').html(_l('label.host.alerts'));
- $dashboard.find('.dashboard-container.head .top .title span').html(_l('label.system.capacity'));
-
- // View all action
- $dashboard.find('.view-all').click(function() {
- var $browser = $('#browser .container');
-
- if ($(this).hasClass('network')) $('#navigation li.network').click();
- else {
- $browser.cloudBrowser('addPanel', {
- title: $dashboard.hasClass('admin') ? 'Alerts' : 'Events',
- maximizeIfSelected: true,
- complete: function($newPanel) {
- $newPanel.listView({
- $browser: $browser,
- context: cloudStack.context,
- listView: $dashboard.hasClass('admin') ?
- cloudStack.sections.events.sections.alerts.listView :
- cloudStack.sections.events.sections.events.listView // Users cannot see events
+ };
+
+ /**
+ * Render circular pie chart, without labels
+ */
+ var pieChart = function($container, data) {
+ $container.css({
+ width: 70,
+ height: 66
+ });
+ $.plot($container, data, {
+ width: 100,
+ height: 100,
+ series: {
+ pie: {
+ innerRadius: 0.7,
+ show: true,
+ label: {
+ show: false
+ }
+ }
+ },
+ legend: {
+ show: false
+ }
});
- }
+ };
+
+ // Determine if user or admin dashboard should be shown
+ var dashboardType = cloudStack.sections.dashboard.adminCheck({
+ context: cloudStack.context
+ }) ? 'admin' : 'user';
+
+ // Get dashboard layout
+ var $dashboard = $('#template').find('div.dashboard.' + dashboardType).clone();
+
+ // Update text
+ $dashboard.find('.button.view-all').html(_l('label.view.all'));
+ $dashboard.find('.dashboard-container.sub.alerts.first .top .title span').html(_l('label.general.alerts'));
+ $dashboard.find('.dashboard-container.sub.alerts.last .top .title span').html(_l('label.host.alerts'));
+ $dashboard.find('.dashboard-container.head .top .title span').html(_l('label.system.capacity'));
+
+ // View all action
+ $dashboard.find('.view-all').click(function() {
+ var $browser = $('#browser .container');
+
+ if ($(this).hasClass('network')) $('#navigation li.network').click();
+ else {
+ $browser.cloudBrowser('addPanel', {
+ title: $dashboard.hasClass('admin') ? 'Alerts' : 'Events',
+ maximizeIfSelected: true,
+ complete: function($newPanel) {
+ $newPanel.listView({
+ $browser: $browser,
+ context: cloudStack.context,
+ listView: $dashboard.hasClass('admin') ? cloudStack.sections.events.sections.alerts.listView : cloudStack.sections.events.sections.events.listView // Users cannot see events
+ });
+ }
+ });
+ };
});
- };
- });
- //Fetch Latest action
- $dashboard.find('.fetch-latest').click(function() {
- window.fetchLatestflag = 1;
- var $browser = $('#browser .container');
+ //Fetch Latest action
+ $dashboard.find('.fetch-latest').click(function() {
+ window.fetchLatestflag = 1;
+ var $browser = $('#browser .container');
- if ($(this).hasClass('fetch-latest')) $('#navigation li.dashboard').click();
- });
+ if ($(this).hasClass('fetch-latest')) $('#navigation li.dashboard').click();
+ });
- getData();
+ getData();
- return $dashboard;
- };
+ return $dashboard;
+ };
}(jQuery, cloudStack));
http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/enableStaticNAT.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/enableStaticNAT.js b/ui/scripts/ui-custom/enableStaticNAT.js
index 1b2bf7b..e46ae19 100644
--- a/ui/scripts/ui-custom/enableStaticNAT.js
+++ b/ui/scripts/ui-custom/enableStaticNAT.js
@@ -15,157 +15,160 @@
// specific language governing permissions and limitations
// under the License.
(function(cloudStack, $) {
- cloudStack.uiCustom.enableStaticNAT = function(args) {
- var listView = args.listView;
- var action = args.action;
- var tierSelect = args.tierSelect;
-
- return function(args) {
- var context = args.context;
- var $instanceRow = args.$instanceRow;
-
- var vmList = function(args) {
- // Create a listing of instances, based on limited information
- // from main instances list view
- var $listView;
- var instances = $.extend(true, {}, args.listView, {
- context: context,
- uiCustom: true
- });
-
- instances.listView.actions = {
- select: {
- label: _l('label.select.instance'),
- type: 'radio',
- action: {
- uiCustom: function(args) {
- var $item = args.$item;
- var $input = $item.find('td.actions input:visible');
-
- if ($input.attr('type') == 'checkbox') {
- if ($input.is(':checked'))
- $item.addClass('multi-edit-selected');
- else
- $item.removeClass('multi-edit-selected');
- } else {
- $item.siblings().removeClass('multi-edit-selected');
- $item.addClass('multi-edit-selected');
- }
- }
- }
- }
- };
+ cloudStack.uiCustom.enableStaticNAT = function(args) {
+ var listView = args.listView;
+ var action = args.action;
+ var tierSelect = args.tierSelect;
+
+ return function(args) {
+ var context = args.context;
+ var $instanceRow = args.$instanceRow;
+
+ var vmList = function(args) {
+ // Create a listing of instances, based on limited information
+ // from main instances list view
+ var $listView;
+ var instances = $.extend(true, {}, args.listView, {
+ context: context,
+ uiCustom: true
+ });
- $listView = $('<div>').listView(instances);
-
- // Change action label
- $listView.find('th.actions').html(_l('label.select'));
-
- return $listView;
- };
-
- var $dataList = vmList({
- listView: listView
- }).dialog({
- dialogClass: 'multi-edit-add-list panel',
- width: 825,
- title: _l('label.select.vm.for.static.nat'),
- buttons: [
- {
- text: _l('label.apply'),
- 'class': 'ok',
- click: function() {
- if ($dataList.find('.tier-select select').val() == -1) {
- cloudStack.dialog.notice({ message: ('Please select a tier')});
- return false;
- }
-
- if (!$dataList.find(
- 'input[type=radio]:checked, input[type=checkbox]:checked'
- ).size()) {
- cloudStack.dialog.notice({ message: _l('message.select.instance')});
-
- return false;
- }
-
- var complete = args.complete;
- var start = args.start;
-
- start();
- $dataList.fadeOut(function() {
- action({
- tierID: $dataList.find('.tier-select select').val(),
- _subselect: $dataList.find('tr.multi-edit-selected .subselect select').val(),
- context: $.extend(true, {}, context, {
- instances: [
- $dataList.find('tr.multi-edit-selected').data('json-obj')
- ]
- }),
- response: {
- success: function(args) {
- complete({
- $item: $instanceRow
- });
- },
- error: function(args) {
- cloudStack.dialog.notice({ message: args });
+ instances.listView.actions = {
+ select: {
+ label: _l('label.select.instance'),
+ type: 'radio',
+ action: {
+ uiCustom: function(args) {
+ var $item = args.$item;
+ var $input = $item.find('td.actions input:visible');
+
+ if ($input.attr('type') == 'checkbox') {
+ if ($input.is(':checked'))
+ $item.addClass('multi-edit-selected');
+ else
+ $item.removeClass('multi-edit-selected');
+ } else {
+ $item.siblings().removeClass('multi-edit-selected');
+ $item.addClass('multi-edit-selected');
+ }
+ }
+ }
+ }
+ };
+
+ $listView = $('<div>').listView(instances);
+
+ // Change action label
+ $listView.find('th.actions').html(_l('label.select'));
+
+ return $listView;
+ };
+
+ var $dataList = vmList({
+ listView: listView
+ }).dialog({
+ dialogClass: 'multi-edit-add-list panel',
+ width: 825,
+ title: _l('label.select.vm.for.static.nat'),
+ buttons: [{
+ text: _l('label.apply'),
+ 'class': 'ok',
+ click: function() {
+ if ($dataList.find('.tier-select select').val() == -1) {
+ cloudStack.dialog.notice({
+ message: ('Please select a tier')
+ });
+ return false;
+ }
+
+ if (!$dataList.find(
+ 'input[type=radio]:checked, input[type=checkbox]:checked'
+ ).size()) {
+ cloudStack.dialog.notice({
+ message: _l('message.select.instance')
+ });
+
+ return false;
+ }
+
+ var complete = args.complete;
+ var start = args.start;
+
+ start();
+ $dataList.fadeOut(function() {
+ action({
+ tierID: $dataList.find('.tier-select select').val(),
+ _subselect: $dataList.find('tr.multi-edit-selected .subselect select').val(),
+ context: $.extend(true, {}, context, {
+ instances: [
+ $dataList.find('tr.multi-edit-selected').data('json-obj')
+ ]
+ }),
+ response: {
+ success: function(args) {
+ complete({
+ $item: $instanceRow
+ });
+ },
+ error: function(args) {
+ cloudStack.dialog.notice({
+ message: args
+ });
+ }
+ }
+ });
+ $dataList.remove();
+ });
+
+ $('div.overlay').fadeOut(function() {
+ $('div.overlay').remove();
+ });
+ }
+ }, {
+ text: _l('label.cancel'),
+ 'class': 'cancel',
+ click: function() {
+ $dataList.fadeOut(function() {
+ $dataList.remove();
+ });
+ $('div.overlay').fadeOut(function() {
+ $('div.overlay').remove();
+ });
+ }
+ }]
+ }).parent('.ui-dialog').overlay();
+
+ // Add tier select dialog
+ if (tierSelect) {
+ var $toolbar = $dataList.find('.toolbar');
+ var $tierSelect = $('<div>').addClass('filters tier-select').prependTo($toolbar);
+ var $tierSelectLabel = $('<label>').html('Select tier').appendTo($tierSelect);
+ var $tierSelectInput = $('<select>').appendTo($tierSelect);
+
+ // Get tier data
+ tierSelect({
+ context: context,
+ $tierSelect: $tierSelect,
+ response: {
+ success: function(args) {
+ var data = args.data;
+
+ $(data).map(function(index, item) {
+ var $option = $('<option>');
+
+ $option.attr('value', item.id);
+ $option.html(item.description);
+ $option.appendTo($tierSelectInput);
+ });
+ },
+ error: function(message) {
+ cloudStack.dialog.notice({
+ message: message ? message : 'Could not retrieve VPC tiers'
+ });
+ }
}
- }
});
- $dataList.remove();
- });
-
- $('div.overlay').fadeOut(function() {
- $('div.overlay').remove();
- });
- }
- },
- {
- text: _l('label.cancel'),
- 'class': 'cancel',
- click: function() {
- $dataList.fadeOut(function() {
- $dataList.remove();
- });
- $('div.overlay').fadeOut(function() {
- $('div.overlay').remove();
- });
}
- }
- ]
- }).parent('.ui-dialog').overlay();
-
- // Add tier select dialog
- if (tierSelect) {
- var $toolbar = $dataList.find('.toolbar');
- var $tierSelect = $('<div>').addClass('filters tier-select').prependTo($toolbar);
- var $tierSelectLabel = $('<label>').html('Select tier').appendTo($tierSelect);
- var $tierSelectInput = $('<select>').appendTo($tierSelect);
-
- // Get tier data
- tierSelect({
- context: context,
- $tierSelect: $tierSelect,
- response: {
- success: function(args) {
- var data = args.data;
-
- $(data).map(function(index, item) {
- var $option = $('<option>');
-
- $option.attr('value', item.id);
- $option.html(item.description);
- $option.appendTo($tierSelectInput);
- });
- },
- error: function(message) {
- cloudStack.dialog.notice({
- message: message ? message : 'Could not retrieve VPC tiers'
- });
- }
- }
- });
- }
+ };
};
- };
}(cloudStack, jQuery));
http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/granularSettings.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/granularSettings.js b/ui/scripts/ui-custom/granularSettings.js
index 02d5c1f..06aa82a 100644
--- a/ui/scripts/ui-custom/granularSettings.js
+++ b/ui/scripts/ui-custom/granularSettings.js
@@ -16,31 +16,39 @@
// under the License.
(function($, cloudStack) {
- cloudStack.uiCustom.granularSettings = function(args) {
- var dataProvider = args.dataProvider;
- var actions = args.actions;
-
- return function(args) {
- var context = args.context;
-
- var listView = {
- id: 'settings',
- fields: {
- name: { label: 'label.name' },
- value: { label: 'label.value', editable: true }
- },
- actions: {
- edit: {
- label: 'label.change.value',
- action: actions.edit
- }
- },
- dataProvider: dataProvider
- };
-
- var $listView = $('<div>').listView({ context: context, listView: listView });
-
- return $listView;
- }
- };
+ cloudStack.uiCustom.granularSettings = function(args) {
+ var dataProvider = args.dataProvider;
+ var actions = args.actions;
+
+ return function(args) {
+ var context = args.context;
+
+ var listView = {
+ id: 'settings',
+ fields: {
+ name: {
+ label: 'label.name'
+ },
+ value: {
+ label: 'label.value',
+ editable: true
+ }
+ },
+ actions: {
+ edit: {
+ label: 'label.change.value',
+ action: actions.edit
+ }
+ },
+ dataProvider: dataProvider
+ };
+
+ var $listView = $('<div>').listView({
+ context: context,
+ listView: listView
+ });
+
+ return $listView;
+ }
+ };
}(jQuery, cloudStack));