cloudstack-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From seb...@apache.org
Subject [17/39] Format JS
Date Thu, 18 Jul 2013 16:34:52 GMT
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));


Mime
View raw message