cloudstack-commits mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From seb...@apache.org
Subject [12/39] Format JS
Date Thu, 18 Jul 2013 16:34:47 GMT
http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/projects.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/projects.js b/ui/scripts/ui-custom/projects.js
index f1f9eba..d897ac9 100644
--- a/ui/scripts/ui-custom/projects.js
+++ b/ui/scripts/ui-custom/projects.js
@@ -15,755 +15,781 @@
 // specific language governing permissions and limitations
 // under the License.
 (function(cloudStack, $) {
-  var pageElems = cloudStack.uiCustom.projectsTabs = {
-    /**
-     * User management multi-edit
-     */
-    userManagement: function(args) {
-      var multiEdit = !args.useInvites ?
-            cloudStack.projects.addUserForm :
-            cloudStack.projects.inviteForm;
-
-      var $multi = $('<div>').multiEdit($.extend(true, {}, multiEdit, {
-        context: args.context
-      }));
-
-      if (args.useInvites) {
-        var $fields = $multi.find('form table').find('th, td');
-        var $accountFields = $fields.filter(function() {
-          return $(this).hasClass('account');
-        });
-        var $emailFields = $fields.filter(function() {
-          return $(this).hasClass('email');
-        });
+    var pageElems = cloudStack.uiCustom.projectsTabs = {
+        /**
+         * User management multi-edit
+         */
+        userManagement: function(args) {
+            var multiEdit = !args.useInvites ?
+                cloudStack.projects.addUserForm :
+                cloudStack.projects.inviteForm;
+
+            var $multi = $('<div>').multiEdit($.extend(true, {}, multiEdit, {
+                context: args.context
+            }));
 
-        $multi.prepend(
-          $('<div>').addClass('add-by')
-            .append($('<span>').html(_l('label.add.by') + ':'))
-            .append(
-              $('<div>').addClass('selection')
-                .append(
-                  $('<input>').attr({
-                    type: 'radio',
-                    name: 'add-by',
-                    checked: 'checked'
-                  }).click(function() {
-                    $accountFields.show();
-                    $emailFields.hide();
-                    $emailFields.find('input').val('');
+            if (args.useInvites) {
+                var $fields = $multi.find('form table').find('th, td');
+                var $accountFields = $fields.filter(function() {
+                    return $(this).hasClass('account');
+                });
+                var $emailFields = $fields.filter(function() {
+                    return $(this).hasClass('email');
+                });
 
-                    return true;
-                  }).click()
-                )
-                .append($('<label>').html(_l('label.account')))
-                .append(
-                  $('<input>').attr({
-                    type: 'radio',
-                    name: 'add-by'
-                  }).click(function() {
-                    $accountFields.hide();
-                    $accountFields.find('input').val('');
-                    $emailFields.show();
+                $multi.prepend(
+                    $('<div>').addClass('add-by')
+                    .append($('<span>').html(_l('label.add.by') + ':'))
+                    .append(
+                        $('<div>').addClass('selection')
+                        .append(
+                            $('<input>').attr({
+                                type: 'radio',
+                                name: 'add-by',
+                                checked: 'checked'
+                            }).click(function() {
+                                $accountFields.show();
+                                $emailFields.hide();
+                                $emailFields.find('input').val('');
+
+                                return true;
+                            }).click()
+                        )
+                        .append($('<label>').html(_l('label.account')))
+                        .append(
+                            $('<input>').attr({
+                                type: 'radio',
+                                name: 'add-by'
+                            }).click(function() {
+                                $accountFields.hide();
+                                $accountFields.find('input').val('');
+                                $emailFields.show();
+
+                                return true;
+                            })
+                        )
+                        .append($('<label>').html(_l('label.email')))
+                    )
+                );
+            }
 
-                    return true;
-                  })
-                )
-                .append($('<label>').html(_l('label.email')))
-            )
-        );
-      }
-
-      return $multi;
-    },
-
-    dashboardTabs: {
-      overview: function() {
-        var $dashboard = $('#template').find('.project-dashboard-view').clone();
-        $dashboard.data('tab-title', _l('label.menu.dashboard'));
-
-        var getData = function() {
-          // Populate data
-          $dashboard.find('[data-item]').hide();
-          var $loading = $('<div>').addClass('loading-overlay').prependTo($dashboard);
-          cloudStack.projects.dashboard({
-            response: {
-              success: function(args) {
-                $loading.remove();
-                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();
-
-                      $.each(item, function(arrayKey, arrayValue) {
-                        var $arrayElem = $li.find('[data-list-item=' + arrayKey + ']');
-
-                        $arrayElem.html(_s(arrayValue));
-                      });
-
-                      $li.attr({ title: 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();
-                      }
+            return $multi;
+        },
+
+        dashboardTabs: {
+            overview: function() {
+                var $dashboard = $('#template').find('.project-dashboard-view').clone();
+                $dashboard.data('tab-title', _l('label.menu.dashboard'));
+
+                var getData = function() {
+                    // Populate data
+                    $dashboard.find('[data-item]').hide();
+                    var $loading = $('<div>').addClass('loading-overlay').prependTo($dashboard);
+                    cloudStack.projects.dashboard({
+                        response: {
+                            success: function(args) {
+                                $loading.remove();
+                                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();
+
+                                            $.each(item, function(arrayKey, arrayValue) {
+                                                var $arrayElem = $li.find('[data-list-item=' + arrayKey + ']');
+
+                                                $arrayElem.html(_s(arrayValue));
+                                            });
+
+                                            $li.attr({
+                                                title: 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();
+                                            }
+                                        });
+                                    }
+                                });
+                            }
+                        }
                     });
-                  }
+                };
+
+                getData();
+
+                $dashboard.find('.button.manage-resources').click(function() {
+                    $('.navigation-item.network').click();
                 });
-              }
-            }
-          });
-        };
 
-        getData();
+                $dashboard.find('.info-box.events .button').click(function() {
+                    $('.navigation-item.events').click();
+                });
 
-        $dashboard.find('.button.manage-resources').click(function() {
-          $('.navigation-item.network').click();
-        });
+                return $dashboard;
+            },
 
-        $dashboard.find('.info-box.events .button').click(function() {
-          $('.navigation-item.events').click();
-        });
+            users: function() {
+                return $('<div>').addClass('management').data('tab-title', _l('label.menu.accounts'));
+            },
 
-        return $dashboard;
-      },
-
-      users: function() {
-        return $('<div>').addClass('management').data('tab-title', _l('label.menu.accounts'));
-      },
-
-      invitations: function() {
-        return $('<div>').addClass('management-invite').data('tab-title', _l('label.invitations'));
-      },
-
-      resources: function(options) {
-        if (!options) options = {};
-
-        var $resources = $('<div>').addClass('resources').data('tab-title', _l('label.resources'));
-        var $form = $('<form>');
-        var $submit = $('<input>').attr({
-          type: 'submit'
-        }).val(_l('label.apply'));
-
-        cloudStack.projects.resourceManagement.dataProvider({
-          response: {
-            success: function(args) {
-              $(args.data).each(function() {
-                var resource = this;
-                var $field = $('<div>').addClass('field');
-                var $label = $('<label>').attr({
-                  'for': resource.type
-                }).html(_s(resource.label));
-                var $input = $('<input>').attr({
-                  type: 'text',
-                  name: resource.type,
-                  value: resource.value,
-                  id: resource.type
-                }).addClass('required');
-
-                $field.append($label, $input);
-                $field.appendTo($form);
-              });
-
-              $form.validate();
-              $form.submit(function() {
-                if (!$form.valid) {
-                  return false;
-                }
+            invitations: function() {
+                return $('<div>').addClass('management-invite').data('tab-title', _l('label.invitations'));
+            },
 
-                var $loading = $('<div>').addClass('loading-overlay').appendTo($form);
-
-                cloudStack.projects.resourceManagement.update({
-                  data: cloudStack.serializeForm($form),
-                  response: {
-                    success: function(args) {
-                      $loading.remove();
-                      $('.notifications').notifications('add', {
-                        section: 'dashboard',
-                        desc: 'label.update.project.resources',
-                        interval: 1000,
-                        poll: function(args) {
-                          args.complete();
+            resources: function(options) {
+                if (!options) options = {};
+
+                var $resources = $('<div>').addClass('resources').data('tab-title', _l('label.resources'));
+                var $form = $('<form>');
+                var $submit = $('<input>').attr({
+                    type: 'submit'
+                }).val(_l('label.apply'));
+
+                cloudStack.projects.resourceManagement.dataProvider({
+                    response: {
+                        success: function(args) {
+                            $(args.data).each(function() {
+                                var resource = this;
+                                var $field = $('<div>').addClass('field');
+                                var $label = $('<label>').attr({
+                                    'for': resource.type
+                                }).html(_s(resource.label));
+                                var $input = $('<input>').attr({
+                                    type: 'text',
+                                    name: resource.type,
+                                    value: resource.value,
+                                    id: resource.type
+                                }).addClass('required');
+
+                                $field.append($label, $input);
+                                $field.appendTo($form);
+                            });
+
+                            $form.validate();
+                            $form.submit(function() {
+                                if (!$form.valid) {
+                                    return false;
+                                }
+
+                                var $loading = $('<div>').addClass('loading-overlay').appendTo($form);
+
+                                cloudStack.projects.resourceManagement.update({
+                                    data: cloudStack.serializeForm($form),
+                                    response: {
+                                        success: function(args) {
+                                            $loading.remove();
+                                            $('.notifications').notifications('add', {
+                                                section: 'dashboard',
+                                                desc: 'label.update.project.resources',
+                                                interval: 1000,
+                                                poll: function(args) {
+                                                    args.complete();
+                                                }
+                                            });
+                                        }
+                                    }
+                                }, options.projectID);
+
+                                return false;
+                            });
+
+                            $submit.appendTo($form);
+                            $form.appendTo($resources);
                         }
-                      });
                     }
-                  }
                 }, options.projectID);
 
-                return false;
-              });
+                return $resources;
+            }
+        },
+
+        /**
+         * Projects dashboard
+         */
+        dashboard: function() {
+            var tabs = {
+                dashboard: pageElems.dashboardTabs.overview
+            };
+
+            // Only show management tabs to owner of project
+            if (isAdmin() || isDomainAdmin() || (
+                cloudStack.context.projects &&
+                (cloudStack.context.projects[0].account == cloudStack.context.users[0].account)
+            )) {
+                tabs.users = pageElems.dashboardTabs.users;
+
+                if (g_capabilities.projectinviterequired) {
+                    tabs.invitations = pageElems.dashboardTabs.invitations;
+                }
 
-              $submit.appendTo($form);
-              $form.appendTo($resources);
+                if (isAdmin() || isDomainAdmin()) {
+                    tabs.resources = pageElems.dashboardTabs.resources;
+                }
             }
-          }
-        }, options.projectID);
 
-        return $resources;
-      }
-    },
+            var $tabs = $('<div>').addClass('tab-content').append($('<ul>'));
+            var $toolbar = $('<div>').addClass('toolbar');
+
+            // Make UI tabs
+            $.each(tabs, function(tabName, tab) {
+                var $tab = $('<li>').appendTo($tabs.find('ul:first'));
+                var $tabContent = tab();
+                var $tabLink = $('<a>')
+                    .attr({
+                        href: '#project-view-dashboard-' + tabName
+                    })
+                    .html($tabContent.data('tab-title'))
+                    .appendTo($tab);
+                var $content = $('<div>')
+                    .appendTo($tabs)
+                    .attr({
+                        id: 'project-view-dashboard-' + tabName
+                    })
+                    .append($tabContent);
+            });
+
+            $tabs.find('ul li:first').addClass('first');
+            $tabs.find('ul li:last').addClass('last');
+
+            $tabs.bind('tabsshow', function(event, ui) {
+                var $panel = $(ui.panel);
+                var $management = $panel.find('.management');
+                var $managementInvite = $panel.find('.management-invite');
+
+                if ($management.size()) {
+                    $management.children().remove();
+                    $management.append(pageElems.userManagement({
+                        context: cloudStack.context
+                    }));
 
-    /**
-     * Projects dashboard
-     */
-    dashboard: function() {
-      var tabs = {
-        dashboard: pageElems.dashboardTabs.overview
-      };
-
-      // Only show management tabs to owner of project
-      if (isAdmin() || isDomainAdmin() || (
-        cloudStack.context.projects &&
-          (cloudStack.context.projects[0].account == cloudStack.context.users[0].account)
-      )) {
-        tabs.users = pageElems.dashboardTabs.users;
-
-        if (g_capabilities.projectinviterequired) {
-          tabs.invitations = pageElems.dashboardTabs.invitations;
-        }
+                    return true;
+                }
 
-        if (isAdmin() || isDomainAdmin()) {
-          tabs.resources = pageElems.dashboardTabs.resources;
-        }
-      }
-
-      var $tabs = $('<div>').addClass('tab-content').append($('<ul>'));
-      var $toolbar = $('<div>').addClass('toolbar');
-
-      // Make UI tabs
-      $.each(tabs, function(tabName, tab) {
-        var $tab = $('<li>').appendTo($tabs.find('ul:first'));
-        var $tabContent = tab();
-        var $tabLink = $('<a>')
-              .attr({ href: '#project-view-dashboard-' + tabName })
-              .html($tabContent.data('tab-title'))
-              .appendTo($tab);
-        var $content = $('<div>')
-              .appendTo($tabs)
-              .attr({ id: 'project-view-dashboard-' + tabName })
-              .append($tabContent);
-      });
-
-      $tabs.find('ul li:first').addClass('first');
-      $tabs.find('ul li:last').addClass('last');
-
-      $tabs.bind('tabsshow', function(event, ui) {
-        var $panel = $(ui.panel);
-        var $management = $panel.find('.management');
-        var $managementInvite = $panel.find('.management-invite');
-
-        if ($management.size()) {
-          $management.children().remove();
-          $management.append(pageElems.userManagement({
-            context: cloudStack.context
-          }));
-
-          return true;
-        }
+                if ($managementInvite.size()) {
+                    $managementInvite.children().remove();
+                    $managementInvite.append(pageElems.userManagement({
+                        context: cloudStack.context,
+                        useInvites: true
+                    }));
+                }
 
-        if ($managementInvite.size()) {
-          $managementInvite.children().remove();
-          $managementInvite.append(pageElems.userManagement({
-            context: cloudStack.context,
-            useInvites: true
-          }));
-        }
+                return true;
+            });
 
-        return true;
-      });
+            return $('<div>').addClass('project-dashboard')
+                .append($.merge(
+                    $toolbar,
+                    $tabs.tabs()
+                ));
+        },
+
+        /**
+         * Add new project flow
+         */
+        newProjectForm: function() {
+            var $newProject = $('<div>').addClass('new-project');
+            $newProject.append($('<div>').addClass('title').html(_l('label.create.project')));
+
+            var $form = $('<form>');
+            var $formDesc = $('<div>').addClass('form-desc');
+            var $projectName = $('<div>').addClass('field name')
+                .append($('<label>').attr('for', 'project-name').html(_l('label.project.name')))
+                .append($('<input>').addClass('required disallowSpecialCharacters').attr({
+                    type: 'text',
+                    name: 'project-name',
+                    id: 'project-name'
+                }));
+            var $projectDesc = $('<div>').addClass('field desc')
+                .append($('<label>').attr('for', 'project-desc').html(_l('label.display.text')))
+                .append($('<input>').addClass('disallowSpecialCharacters').attr({
+                    type: 'text',
+                    name: 'project-display-text',
+                    id: 'project-desc'
+                }));
+            var $submit = $('<input>').attr({
+                type: 'submit'
+            }).val(_l('label.create.project'));
+            var $cancel = $('<div>').addClass('button cancel').html(_l('label.cancel'));
+            var $loading = $('<div>').addClass('loading-overlay');
+
+            // Form events/validation
+            $form.validate();
+            $form.submit(function() {
+                if (!$form.valid()) return false;
+
+                $form.prepend($loading);
+
+                cloudStack.projects.add({
+                    context: cloudStack.context,
+                    data: cloudStack.serializeForm($form),
+                    response: {
+                        success: function(args) {
+                            var project = args.data;
+                            var $projectSwitcher = $('div.project-switcher');
+
+                            $(window).trigger('cloudStack.fullRefresh');
+
+                            // dynamically add newly created project into project switcher
+                            $projectSwitcher.find('select').append(
+                                $('<option>').val(project.id).html(project.name)
+                            );
+
+                            $loading.remove();
+
+                            // Confirmation
+                            $form.replaceWith(function() {
+                                var $confirm = $('<div>').addClass('confirm');
+
+                                // Update title with project name
+                                $newProject.find('.title').html(_s(args.data.name));
+
+                                // Show field data
+                                $confirm.append($projectName).find('input').replaceWith( // Name
+                                    $('<span>').addClass('value').html(_s(
+                                        args.data.name
+                                    ))
+                                );
+                                $confirm.append($projectDesc).find('input').replaceWith( // Display text
+                                    $('<span>').addClass('value').html(_s(
+                                        args.data.displayText
+                                    ))
+                                );
+
+                                var $buttons = $('<div>').addClass('buttons');
+                                var $addAccountButton = $('<div>').addClass('button confirm').html(_l('label.add.accounts'));
+
+                                $addAccountButton.click(function() {
+                                    // Show add user form
+                                    $confirm.replaceWith(function() {
+                                        var $userManagement = pageElems.userManagement({
+                                            context: $.extend(true, {}, cloudStack.context, {
+                                                projects: [project]
+                                            }),
+                                            useInvites: cloudStack.projects.requireInvitation()
+                                        });
+                                        var $nextButton = $('<div>').addClass('button confirm next').html(_l('label.next'));
+
+                                        $newProject.find('.title').html(
+                                            cloudStack.projects.requireInvitation() ?
+                                            _l('label.invite.to') + ' ' + _s(args.data.name) :
+                                            _l('label.add.accounts.to') + ' ' + _s(args.data.name)
+                                        );
+                                        $nextButton.appendTo($userManagement).click(function() {
+                                            $newProject.find('.title').html(_l('label.review'));
+                                            $userManagement.replaceWith(function() {
+                                                var $review = $('<div>').addClass('review');
+                                                var $projectData = $('<div>').addClass('project-data');
+
+                                                // Basic project data
+                                                $review.append($projectData);
+                                                $projectData.append($projectName).find('input').replaceWith( // Name
+                                                    $('<span>').addClass('value').html(_s(
+                                                        args.data.name
+                                                    ))
+                                                );
+                                                $projectData.append($projectDesc).find('input').replaceWith( // Display text
+                                                    $('<span>').addClass('value').html(_s(
+                                                        args.data.displayText
+                                                    ))
+                                                );
+
+                                                // User/resouce tabs
+                                                var $tabs = $('<div>').addClass('tabs resources').appendTo($review);
+                                                var $ul = $('<ul>').appendTo($tabs)
+                                                    .append(
+                                                        // Users tab
+                                                        $('<li>').addClass('first').append(
+                                                            $('<a>').attr({
+                                                                href: '#new-project-review-tabs-users'
+                                                            }).html(
+                                                                cloudStack.projects.requireInvitation() ?
+                                                                _l('label.invitations') : _l('label.accounts')
+                                                            )
+                                                        )
+                                                );
+
+                                                if (isAdmin() || isDomainAdmin()) {
+                                                    $ul.append(
+                                                        // Resources tab
+                                                        $('<li>').addClass('last').append(
+                                                            $('<a>').attr({
+                                                                href: '#new-project-review-tabs-resouces'
+                                                            }).html(_l('label.resources'))
+                                                        )
+                                                    );
+                                                }
+
+                                                var $users = $('<div>').attr({
+                                                    id: 'new-project-review-tabs-users'
+                                                }).appendTo($tabs);
+                                                cloudStack.context.projects = [project];
+
+                                                var $resources;
+                                                if (isAdmin() || isDomainAdmin()) {
+                                                    $resouces = $('<div>')
+                                                        .attr({
+                                                            id: 'new-project-review-tabs-resouces'
+                                                        })
+                                                        .appendTo($tabs)
+                                                        .append(pageElems.dashboardTabs.resources);
+                                                }
+
+                                                $tabs.tabs();
+
+                                                $users.listView({
+                                                    listView: {
+                                                        id: 'project-accounts',
+                                                        disableInfiniteScrolling: true,
+                                                        fields: !cloudStack.projects.requireInvitation() ? {
+                                                            username: {
+                                                                label: _l('label.account')
+                                                            }
+                                                        } : {
+                                                            account: {
+                                                                label: _l('label.invited.accounts')
+                                                            }
+                                                        },
+                                                        dataProvider: function(args) {
+                                                            setTimeout(function() {
+                                                                args.response.success({
+                                                                    data: $.map($userManagement.find('.data-item tr'), function(elem) {
+                                                                        // Store previous user data in list table
+                                                                        return !cloudStack.projects.requireInvitation() ? {
+                                                                            username: $(elem).find('td.username span').html()
+                                                                        } : {
+                                                                            account: $(elem).find('td.account span').html()
+                                                                        };
+                                                                    })
+                                                                });
+                                                            }, 0);
+                                                        }
+                                                    }
+                                                });
+
+                                                // Save button
+                                                var $saveButton = $nextButton.clone().appendTo($review);
+                                                $saveButton.html(_l('label.save'));
+                                                $saveButton.click(function() {
+                                                    $('#new-project-review-tabs-resouces').find('form').submit();
+                                                    $('.ui-dialog, .overlay').remove();
+                                                });
+
+                                                $laterButton.click(function() {
+                                                    $(':ui-dialog, .overlay').remove();
+
+                                                    return false;
+                                                });
+
+                                                return $review;
+                                            });
+
+                                            $(':ui-dialog').dialog('option', 'position', 'center');
+                                        });
+                                        $laterButton.html(_l('label.close')).appendTo($userManagement);
+
+                                        return $userManagement;
+                                    });
+
+                                    $(':ui-dialog').dialog('option', 'position', 'center');
+
+                                    return false;
+                                });
 
-      return $('<div>').addClass('project-dashboard')
-        .append($.merge(
-          $toolbar,
-          $tabs.tabs()
-        ));
-    },
+                                var $laterButton = $('<div>').addClass('button later').html(_l('label.remind.later'));
+                                $laterButton.click(function() {
+                                    $(':ui-dialog, .overlay').remove();
 
-    /**
-     * Add new project flow
-     */
-    newProjectForm: function() {
-      var $newProject = $('<div>').addClass('new-project');
-      $newProject.append($('<div>').addClass('title').html(_l('label.create.project')));
-
-      var $form = $('<form>');
-      var $formDesc = $('<div>').addClass('form-desc');
-      var $projectName = $('<div>').addClass('field name')
-            .append($('<label>').attr('for', 'project-name').html(_l('label.project.name')))
-            .append($('<input>').addClass('required disallowSpecialCharacters').attr({
-              type: 'text',
-              name: 'project-name',
-              id: 'project-name'
-            }));
-      var $projectDesc = $('<div>').addClass('field desc')
-            .append($('<label>').attr('for', 'project-desc').html(_l('label.display.text')))
-            .append($('<input>').addClass('disallowSpecialCharacters').attr({
-              type: 'text',
-              name: 'project-display-text',
-              id: 'project-desc'
-            }));
-      var $submit = $('<input>').attr({ type: 'submit' }).val(_l('label.create.project'));
-      var $cancel = $('<div>').addClass('button cancel').html(_l('label.cancel'));
-      var $loading = $('<div>').addClass('loading-overlay');
-
-      // Form events/validation
-      $form.validate();
-      $form.submit(function() {
-        if (!$form.valid()) return false;
-
-        $form.prepend($loading);
-
-        cloudStack.projects.add({
-          context: cloudStack.context,
-          data: cloudStack.serializeForm($form),
-          response: {
-            success: function(args) {
-              var project = args.data;
-              var $projectSwitcher = $('div.project-switcher');
-
-              $(window).trigger('cloudStack.fullRefresh');
-
-              // dynamically add newly created project into project switcher
-              $projectSwitcher.find('select').append(
-                $('<option>').val(project.id).html(project.name)
-              );
-
-              $loading.remove();
-
-              // Confirmation
-              $form.replaceWith(function() {
-                var $confirm = $('<div>').addClass('confirm');
-
-                // Update title with project name
-                $newProject.find('.title').html(_s(args.data.name));
-
-                // Show field data
-                $confirm.append($projectName).find('input').replaceWith( // Name
-                  $('<span>').addClass('value').html(_s(
-                    args.data.name
-                  ))
-                );
-                $confirm.append($projectDesc).find('input').replaceWith( // Display text
-                  $('<span>').addClass('value').html(_s(
-                    args.data.displayText
-                  ))
-                );
+                                    return false;
+                                });
 
-                var $buttons = $('<div>').addClass('buttons');
-                var $addAccountButton = $('<div>').addClass('button confirm').html(_l('label.add.accounts'));
-
-                $addAccountButton.click(function() {
-                  // Show add user form
-                  $confirm.replaceWith(function() {
-                    var $userManagement = pageElems.userManagement({
-                      context: $.extend(true, {}, cloudStack.context, {
-                        projects: [project]
-                      }),
-                      useInvites: cloudStack.projects.requireInvitation()
-                    });
-                    var $nextButton = $('<div>').addClass('button confirm next').html(_l('label.next'));
-
-                    $newProject.find('.title').html(
-                      cloudStack.projects.requireInvitation() ?
-                        _l('label.invite.to') + ' ' + _s(args.data.name) :
-                        _l('label.add.accounts.to') + ' ' + _s(args.data.name)
-                    );
-                    $nextButton.appendTo($userManagement).click(function() {
-                      $newProject.find('.title').html(_l('label.review'));
-                      $userManagement.replaceWith(function() {
-                        var $review = $('<div>').addClass('review');
-                        var $projectData = $('<div>').addClass('project-data');
-
-                        // Basic project data
-                        $review.append($projectData);
-                        $projectData.append($projectName).find('input').replaceWith( // Name
-                          $('<span>').addClass('value').html(_s(
-                            args.data.name
-                          ))
-                        );
-                        $projectData.append($projectDesc).find('input').replaceWith( // Display text
-                          $('<span>').addClass('value').html(_s(
-                            args.data.displayText
-                          ))
-                        );
-
-                        // User/resouce tabs
-                        var $tabs = $('<div>').addClass('tabs resources').appendTo($review);
-                        var $ul = $('<ul>').appendTo($tabs)
-                              .append(
-                                // Users tab
-                                $('<li>').addClass('first').append(
-                                  $('<a>').attr({ href: '#new-project-review-tabs-users'}).html(
-                                    cloudStack.projects.requireInvitation() ?
-                                      _l('label.invitations') : _l('label.accounts')
-                                  )
-                                )
-                              );
-
-                        if (isAdmin() || isDomainAdmin()) {
-                          $ul.append(
-                            // Resources tab
-                            $('<li>').addClass('last').append(
-                              $('<a>').attr({ href: '#new-project-review-tabs-resouces'}).html(_l('label.resources'))
-                            )
-                          );
-                        }
+                                $buttons.appendTo($confirm).append($.merge(
+                                    $addAccountButton, $laterButton
+                                ));
 
-                        var $users = $('<div>').attr({ id: 'new-project-review-tabs-users' }).appendTo($tabs);
-                        cloudStack.context.projects = [project];
+                                return $confirm;
+                            });
+                        },
+                        error: cloudStack.dialog.error(function() {
+                            $loading.remove();
+                        })
+                    }
+                });
 
-                        var $resources;
-                        if (isAdmin() || isDomainAdmin()) {
-                          $resouces = $('<div>')
-                            .attr({ id: 'new-project-review-tabs-resouces' })
-                            .appendTo($tabs)
-                            .append(pageElems.dashboardTabs.resources);
-                        }
+                return false;
+            });
 
-                        $tabs.tabs();
-
-                        $users.listView({
-                          listView: {
-                            id: 'project-accounts',
-                            disableInfiniteScrolling: true,
-                            fields: !cloudStack.projects.requireInvitation() ? {
-                              username: { label: _l('label.account') }
-                            } : {
-                              account: { label: _l('label.invited.accounts') }
-                            },
-                            dataProvider: function(args) {
-                              setTimeout(function() {
-                                args.response.success({
-                                  data: $.map($userManagement.find('.data-item tr'), function(elem) {
-                                    // Store previous user data in list table
-                                    return !cloudStack.projects.requireInvitation() ? {
-                                      username: $(elem).find('td.username span').html()
-                                    } : {
-                                      account: $(elem).find('td.account span').html()
-                                    };
-                                  })
-                                });
-                              }, 0);
-                            }
-                          }
-                        });
+            $cancel.click(function() {
+                $(':ui-dialog, .overlay').remove();
+            });
 
-                        // Save button
-                        var $saveButton = $nextButton.clone().appendTo($review);
-                        $saveButton.html(_l('label.save'));
-                        $saveButton.click(function() {
-                          $('#new-project-review-tabs-resouces').find('form').submit();
-                          $('.ui-dialog, .overlay').remove();
-                        });
+            return $newProject
+                .append(
+                    $form
+                    .append($formDesc)
+                    .append($projectName)
+                    .append($projectDesc)
+                    .append($cancel)
+                    .append($submit)
+            );
+        },
+
+        /**
+         * Project selection list
+         */
+        selector: function(args) {
+            var $selector = $('<div>').addClass('project-selector');
+            var $toolbar = $('<div>').addClass('toolbar');
+            var $list = $('<div>').addClass('listing')
+                .append($('<div>').addClass('header').html(_l('label.name')))
+                .append($('<div>').addClass('data').append($('<ul>')));
+            var $searchForm = $('<form>');
+            var $search = $('<div>').appendTo($toolbar).addClass('search')
+                .append(
+                    $searchForm
+                    .append($('<input>').attr({
+                        type: 'text'
+                    }))
+                    .append($('<input>').attr({
+                        type: 'submit'
+                    }).val(''))
+            );
+            var $projectSelect = args.$projectSelect;
+            var $cancel = $('<div>').addClass('button cancel').html(_l('label.cancel'));
+
+            // Get project data
+            var loadData = function(complete, options) {
+                cloudStack.projects.dataProvider({
+                    projectName: options ? options.projectName : null,
+                    context: cloudStack.context,
+                    response: {
+                        success: function(args) {
+                            var data = args.data;
+
+                            $projectSelect.find('option').remove();
+                            $(data).each(function() {
+                                var displayText = this.displayText ? this.displayText : this.name;
+
+                                $('<li>')
+                                    .data('json-obj', this)
+                                    .html(_s(displayText))
+                                    .appendTo($list.find('ul'));
+
+                                // Populate project select
+                                $('<option>')
+                                    .appendTo($projectSelect)
+                                    .data('json-obj', this)
+                                    .html(_s(displayText));
+                            });
+
+                            cloudStack.evenOdd($list, 'li', {
+                                even: function($elem) {
+                                    $elem.addClass('even');
+                                },
+
+                                odd: function($elem) {
+                                    $elem.addClass('odd');
+                                }
+                            });
+
+                            if (complete) complete();
+                        }
+                    }
+                });
+            };
 
-                        $laterButton.click(function() {
-                          $(':ui-dialog, .overlay').remove();
+            // Search form
+            $searchForm.submit(function() {
+                $list.find('li').remove();
+                loadData(null, {
+                    projectName: $(this).find('input[type=text]').val()
+                });
 
-                          return false;
-                        });
+                return false;
+            });
+
+            //Cancel button
+            $cancel.click(function() {
+                $(':ui-dialog, .overlay').remove();
+                $('.select.default-view').click();
+            });
+
+
+            // Initial load
+            loadData(function() {
+                if (!$list.find('li').size()) {
+                    cloudStack.dialog.notice({
+                        message: isAdmin() || isDomainAdmin() || g_userProjectsEnabled ? _l('message.no.projects') : _l('message.no.projects.adminOnly')
+                    }).closest('.ui-dialog');
+                    $.merge($selector, $('.overlay')).remove();
+                    $('.select.default-view').click();
+                } else {
+                    $selector.dialog({
+                        title: _l('label.select.project'),
+                        dialogClass: 'project-selector-dialog',
+                        closeOnEscape: false,
+                        width: 420
+                    }).closest('.ui-dialog').overlay();
+                }
+            });
 
-                        return $review;
-                      });
+            // Project item click event
+            $selector.click(function(event) {
+                var $target = $(event.target);
 
-                      $(':ui-dialog').dialog('option', 'position', 'center');
-                    });
-                    $laterButton.html(_l('label.close')).appendTo($userManagement);
+                if ($target.is('li')) {
+                    cloudStack.context.projects = [$target.data('json-obj')];
+                    showDashboard();
 
-                    return $userManagement;
-                  });
+                    var $switcher = $('.select.project-view');
+                    var projectName = _s(cloudStack.context.projects[0].name);
 
-                  $(':ui-dialog').dialog('option', 'position', 'center');
+                    $switcher.attr('title', projectName);
+                    if (projectName.length > 10) {
+                        projectName = projectName.substr(0, 10).concat('...');
+                    }
 
-                  return false;
-                });
+                    // Put project name in header
+                    $switcher.html('<span class="icon">&nbsp;</span>' + projectName);
 
-                var $laterButton = $('<div>').addClass('button later').html(_l('label.remind.later'));
-                $laterButton.click(function() {
-                  $(':ui-dialog, .overlay').remove();
 
-                  return false;
-                });
+                    $.merge($selector, $('.overlay')).remove();
 
-                $buttons.appendTo($confirm).append($.merge(
-                  $addAccountButton, $laterButton
-                ));
+                    // Select active project
+                    $projectSelect
+                        .find('option').attr('selected', '')
+                        .filter(function() {
+                            return $(this).data('json-obj').name == _s(cloudStack.context.projects[0].name);
+                        }).attr('selected', 'selected');
 
-                return $confirm;
-              });
-            },
-            error: cloudStack.dialog.error(function() {
-              $loading.remove();
-            })
-          }
-        });
+                    ////
+                    // Hidden for now
+                    //$projectSelect.parent().show();
+                }
+            });
 
-        return false;
-      });
-
-      $cancel.click(function() {
-        $(':ui-dialog, .overlay').remove();
-      });
-
-      return $newProject
-        .append(
-          $form
-            .append($formDesc)
-            .append($projectName)
-            .append($projectDesc)
-            .append($cancel)
-            .append($submit)
-        );
-    },
+            return $selector
+                .append($toolbar)
+                .append($list)
+                .append($cancel);
+        }
+    };
 
     /**
-     * Project selection list
+     * Show project-mode appearance on CloudStack UI
      */
-    selector: function(args) {
-      var $selector = $('<div>').addClass('project-selector');
-      var $toolbar = $('<div>').addClass('toolbar');
-      var $list = $('<div>').addClass('listing')
-            .append($('<div>').addClass('header').html(_l('label.name')))
-            .append($('<div>').addClass('data').append($('<ul>')));
-      var $searchForm = $('<form>');
-      var $search = $('<div>').appendTo($toolbar).addClass('search')
-            .append(
-              $searchForm
-                .append($('<input>').attr({ type: 'text' }))
-                .append($('<input>').attr({ type: 'submit' }).val(''))
-            );
-      var $projectSelect = args.$projectSelect;
-      var $cancel = $('<div>').addClass('button cancel').html(_l('label.cancel'));
-
-      // Get project data
-      var loadData = function(complete, options) {
-        cloudStack.projects.dataProvider({
-          projectName: options ? options.projectName : null,
-          context: cloudStack.context,
-          response: {
-            success: function(args) {
-              var data = args.data;
-
-              $projectSelect.find('option').remove();
-              $(data).each(function() {
-                var displayText = this.displayText ? this.displayText : this.name;
-
-                $('<li>')
-                  .data('json-obj', this)
-                  .html(_s(displayText))
-                  .appendTo($list.find('ul'));
-
-                // Populate project select
-                $('<option>')
-                  .appendTo($projectSelect)
-                  .data('json-obj', this)
-                  .html(_s(displayText));
-              });
-
-              cloudStack.evenOdd($list, 'li', {
-                even: function($elem) {
-                  $elem.addClass('even');
-                },
-
-                odd: function($elem) {
-                  $elem.addClass('odd');
-                }
-              });
+    var applyProjectStyle = function() {
+        var $container = $('#cloudStack3-container');
+        $container.addClass('project-view');
+    };
 
-              if (complete) complete();
-            }
-          }
-        });
-      };
+    /**
+     * Initiate new project flow
+     */
+    var addProject = function() {
+        pageElems.newProjectForm().dialog({
+            title: 'New Project',
+            closeOnEscape: false,
+            width: 760
+        }).closest('.ui-dialog').overlay();
+    };
 
-      // Search form
-      $searchForm.submit(function() {
-        $list.find('li').remove();
-        loadData(null, {
-          projectName: $(this).find('input[type=text]').val()
-        });
+    var deleteProject = function(args) {
+        var projectId = args.id;
+        var $projectSwitcher = $('div.project-switcher');
+        var contextProjectId = cloudStack.context.projects ? cloudStack.context.projects[0].id : -1;
 
-        return false;
-      });
-
-      //Cancel button
-      $cancel.click(function() {
-        $(':ui-dialog, .overlay').remove();
-        $('.select.default-view').click();
-      });
-
-
-      // Initial load
-      loadData(function() {
-        if (!$list.find('li').size()) {
-          cloudStack.dialog.notice({
-            message: isAdmin() || isDomainAdmin() || g_userProjectsEnabled ?
-              _l('message.no.projects') :
-              _l('message.no.projects.adminOnly')
-          }).closest('.ui-dialog');
-          $.merge($selector, $('.overlay')).remove();
-          $('.select.default-view').click();
-        } else {
-          $selector.dialog({
-            title: _l('label.select.project'),
-            dialogClass: 'project-selector-dialog',
-            closeOnEscape: false ,
-            width: 420
-          }).closest('.ui-dialog').overlay();
-        }
-      });
+        $projectSwitcher.find('option[value="' + projectId + '"]').remove();
 
-      // Project item click event
-      $selector.click(function(event) {
-        var $target = $(event.target);
+        //return to default view if current project is deleted
+        if (contextProjectId == projectId) {
+            $projectSwitcher.find('select').trigger('change');
+        }
+        return false;
+    };
 
-        if ($target.is('li')) {
-          cloudStack.context.projects = [$target.data('json-obj')];
-          showDashboard();
+    /**
+     * Show the dashboard, in panel
+     */
+    var showDashboard = function() {
+        var $browser = $('#browser .container');
+        applyProjectStyle($('html body'));
+
+        // Cleanup project context
+        if (cloudStack.context.projects)
+            cloudStack.context.projects[0].isNew = false;
+
+        $browser.cloudBrowser('removeAllPanels');
+        $browser.cloudBrowser('addPanel', {
+            title: _l('label.project.dashboard'),
+            complete: function($newPanel) {
+                $('#navigation li.dashboard').addClass('active').siblings().removeClass('active');
+                $newPanel.append(pageElems.dashboard);
+            }
+        });
+    };
 
-          var $switcher = $('.select.project-view');
-          var projectName = _s(cloudStack.context.projects[0].name);
+    /**
+     * Projects entry point
+     */
+    cloudStack.uiCustom.projects = function(args) {
+        var $dashboardNavItem = $('#navigation li.navigation-item.dashboard');
 
-          $switcher.attr('title', projectName);
-          if (projectName.length > 10) {
-            projectName = projectName.substr(0, 10).concat('...');
-          }
+        // Use project dashboard
+        var event = function() {
+            if (!$('#cloudStack3-container').hasClass('project-view')) {
+                // No longer in project view, go back to normal dashboard
+                $dashboardNavItem.unbind('click', event);
 
-          // Put project name in header
-          $switcher.html('<span class="icon">&nbsp;</span>' + projectName);
+                return true;
+            }
 
+            $(this).addClass('active');
+            $(this).siblings().removeClass('active');
 
-          $.merge($selector, $('.overlay')).remove();
+            if (cloudStack.context.projects && cloudStack.context.projects[0]) {
+                showDashboard();
+            }
 
-          // Select active project
-          $projectSelect
-            .find('option').attr('selected', '')
-            .filter(function() {
-              return $(this).data('json-obj').name == _s(cloudStack.context.projects[0].name);
-            }).attr('selected', 'selected');
+            return false;
+        };
+        $dashboardNavItem.bind('click', event);
 
-          ////
-          // Hidden for now
-          //$projectSelect.parent().show();
+        if (args.alreadySelected) {
+            showDashboard();
+        } else {
+            pageElems.selector(args);
         }
-      });
-
-      return $selector
-        .append($toolbar)
-        .append($list)
-        .append($cancel);
-    }
-  };
-
-  /**
-   * Show project-mode appearance on CloudStack UI
-   */
-  var applyProjectStyle = function() {
-    var $container = $('#cloudStack3-container');
-    $container.addClass('project-view');
-  };
-
-  /**
-   * Initiate new project flow
-   */
-  var addProject = function() {
-    pageElems.newProjectForm().dialog({
-      title: 'New Project',
-      closeOnEscape: false,
-      width: 760
-    }).closest('.ui-dialog').overlay();
-  };
-
-  var deleteProject = function(args) {
-    var projectId = args.id;
-    var $projectSwitcher = $('div.project-switcher');
-    var contextProjectId = cloudStack.context.projects ? cloudStack.context.projects[0].id : -1;
-
-    $projectSwitcher.find('option[value="'+projectId+'"]').remove();
-
-    //return to default view if current project is deleted
-    if(contextProjectId == projectId) {
-      $projectSwitcher.find('select').trigger('change');
-    }
-    return false;
-  };
-
-  /**
-   * Show the dashboard, in panel
-   */
-  var showDashboard = function() {
-    var $browser = $('#browser .container');
-    applyProjectStyle($('html body'));
-
-    // Cleanup project context
-    if (cloudStack.context.projects)
-      cloudStack.context.projects[0].isNew = false;
-
-    $browser.cloudBrowser('removeAllPanels');
-    $browser.cloudBrowser('addPanel', {
-      title: _l('label.project.dashboard'),
-      complete: function($newPanel) {
-        $('#navigation li.dashboard').addClass('active').siblings().removeClass('active');
-        $newPanel.append(pageElems.dashboard);
-      }
-    });
-  };
-
-  /**
-   * Projects entry point
-   */
-  cloudStack.uiCustom.projects = function(args) {
-    var $dashboardNavItem = $('#navigation li.navigation-item.dashboard');
-
-    // Use project dashboard
-    var event = function() {
-      if (!$('#cloudStack3-container').hasClass('project-view')) {
-        // No longer in project view, go back to normal dashboard
-        $dashboardNavItem.unbind('click', event);
-
-        return true;
-      }
+    };
 
-      $(this).addClass('active');
-      $(this).siblings().removeClass('active');
+    /**
+     * New project event
+     */
+    $(window).bind('cloudStack.newProject', function() {
+        addProject();
+    });
 
-      if (cloudStack.context.projects && cloudStack.context.projects[0]) {
-        showDashboard();
-      }
 
-      return false;
-    };
-    $dashboardNavItem.bind('click', event);
-
-    if (args.alreadySelected) {
-      showDashboard();
-    } else {
-      pageElems.selector(args);
-    }
-  };
-
-  /**
-   * New project event
-   */
-  $(window).bind('cloudStack.newProject', function() {
-    addProject();
-  });
-
-
-  $(window).bind('cloudStack.deleteProject', function(event, args) {
-    deleteProject({id: args.data.id});
-  });
+    $(window).bind('cloudStack.deleteProject', function(event, args) {
+        deleteProject({
+            id: args.data.id
+        });
+    });
 })(cloudStack, jQuery);

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/recurringSnapshots.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/recurringSnapshots.js b/ui/scripts/ui-custom/recurringSnapshots.js
index 985f369..c32aa99 100644
--- a/ui/scripts/ui-custom/recurringSnapshots.js
+++ b/ui/scripts/ui-custom/recurringSnapshots.js
@@ -15,200 +15,201 @@
 // specific language governing permissions and limitations
 // under the License.
 (function(cloudStack, $) {
-  cloudStack.uiCustom.recurringSnapshots = function(args) {
-    var desc = args.desc;
-    var selects = args.selects;
-    var actions = args.actions;
-    var dataProvider = args.dataProvider;
-
-    return function(args) {
-      var $snapshots = $('#template').find('.recurring-snapshots').clone();
-      var context = args.context;
-
-      // Update labels
-      $snapshots.find('.forms ul li.hourly a').html(_l('label.hourly'));
-      $snapshots.find('.forms ul li.daily a').html(_l('label.daily'));
-      $snapshots.find('.forms ul li.weekly a').html(_l('label.weekly'));
-      $snapshots.find('.forms ul li.monthly a').html(_l('label.monthly'));
-      $snapshots.find('.field.timezone .name').html(_l('label.timezone'));
-      $snapshots.find('.field.time .name').html(_l('label.time'));
-      $snapshots.find('.field.time .value label').html(_l('label.minute.past.hour'));
-      $snapshots.find('.add-snapshot-action.add').html(_l('label.add'));
-
-      // Get description
-      $snapshots.find('.desc').html(_l(desc));
-
-      // Snapshot type tabs
-      $snapshots.find('.forms').tabs();
-
-      // Populate selects
-      $snapshots.find('form select').each(function() {
-        var $select = $(this);
-        var selectData = selects[$select.attr('name')];
-
-        if (selectData) {
-          selectData({
-            response: {
-              success: function(args) {
-                $(args.data).each(function() {
-                  var $option = $('<option>').appendTo($select);
-
-                  $option.val(this.id).html(_l(this.name));
+    cloudStack.uiCustom.recurringSnapshots = function(args) {
+        var desc = args.desc;
+        var selects = args.selects;
+        var actions = args.actions;
+        var dataProvider = args.dataProvider;
+
+        return function(args) {
+            var $snapshots = $('#template').find('.recurring-snapshots').clone();
+            var context = args.context;
+
+            // Update labels
+            $snapshots.find('.forms ul li.hourly a').html(_l('label.hourly'));
+            $snapshots.find('.forms ul li.daily a').html(_l('label.daily'));
+            $snapshots.find('.forms ul li.weekly a').html(_l('label.weekly'));
+            $snapshots.find('.forms ul li.monthly a').html(_l('label.monthly'));
+            $snapshots.find('.field.timezone .name').html(_l('label.timezone'));
+            $snapshots.find('.field.time .name').html(_l('label.time'));
+            $snapshots.find('.field.time .value label').html(_l('label.minute.past.hour'));
+            $snapshots.find('.add-snapshot-action.add').html(_l('label.add'));
+
+            // Get description
+            $snapshots.find('.desc').html(_l(desc));
+
+            // Snapshot type tabs
+            $snapshots.find('.forms').tabs();
+
+            // Populate selects
+            $snapshots.find('form select').each(function() {
+                var $select = $(this);
+                var selectData = selects[$select.attr('name')];
+
+                if (selectData) {
+                    selectData({
+                        response: {
+                            success: function(args) {
+                                $(args.data).each(function() {
+                                    var $option = $('<option>').appendTo($select);
+
+                                    $option.val(this.id).html(_l(this.name));
+                                });
+                            }
+                        }
+                    });
+                }
+            });
+
+            // Form validation
+            $snapshots.find('form').validate();
+
+            // Add snapshot
+            $snapshots.find('.add-snapshot-action.add').click(function() {
+                var $form = $snapshots.find('form:visible');
+
+                if (!$form.valid()) return false;
+
+                var formData = cloudStack.serializeForm($form);
+
+                actions.add({
+                    context: context,
+                    snapshot: formData,
+                    response: {
+                        success: function(args) {
+                            var $snapshotRow = $snapshots.find('.scheduled-snapshots tr').filter(function() {
+                                return $(this).index() == args.data.type;
+                            }).addClass('active').show();
+
+                            $snapshotRow.data('json-obj', args.data);
+
+                            // Update fields
+                            $snapshotRow.find('td.time span').html(args.data.time);
+                            $snapshotRow.find('td.day-of-week span').html(_l(
+                                args.data['day-of-week'] ?
+                                $snapshots.find('select[name=day-of-week] option').filter(function() {
+                                    return $(this).val() == args.data['day-of-week'];
+                                }).html() :
+                                args.data['day-of-month']
+                            ));
+                            $snapshotRow.find('td.timezone span').html(
+                                $snapshots.find('select[name=timezone] option').filter(function() {
+                                    return $(this).val() == args.data['timezone'];
+                                }).html()
+                            );
+                            $snapshotRow.find('td.keep span').html(args.data.keep);
+
+                            $(':ui-dialog').dialog('option', 'position', 'center');
+
+                            refreshSnapshotTabs();
+                        }
+                    }
                 });
-              }
-            }
-          });
-        }
-      });
-
-      // Form validation
-      $snapshots.find('form').validate();
-
-      // Add snapshot
-      $snapshots.find('.add-snapshot-action.add').click(function() {
-        var $form = $snapshots.find('form:visible');
-
-        if (!$form.valid()) return false;
-
-        var formData = cloudStack.serializeForm($form);
-
-        actions.add({
-          context: context,
-          snapshot: formData,
-          response: {
-            success: function(args) {
-              var $snapshotRow = $snapshots.find('.scheduled-snapshots tr').filter(function() {
-                return $(this).index() == args.data.type;
-              }).addClass('active').show();
-
-              $snapshotRow.data('json-obj', args.data);
-
-              // Update fields
-              $snapshotRow.find('td.time span').html(args.data.time);
-              $snapshotRow.find('td.day-of-week span').html(_l(
-                args.data['day-of-week'] ?
-                  $snapshots.find('select[name=day-of-week] option').filter(function() {
-                    return $(this).val() == args.data['day-of-week'];
-                  }).html() :
-                args.data['day-of-month']
-              ));
-              $snapshotRow.find('td.timezone span').html(
-                $snapshots.find('select[name=timezone] option').filter(function() {
-                  return $(this).val() == args.data['timezone'];
-                }).html()
-              );
-              $snapshotRow.find('td.keep span').html(args.data.keep);
-
-              $(':ui-dialog').dialog('option', 'position', 'center');
-
-              refreshSnapshotTabs();
-            }
-          }
-        });
-
-        return true;
-      });
-
-      // Enable/disable snapshot tabs based on table contents;
-      var refreshSnapshotTabs = function() {
-        $snapshots.find('li').each(function() {
-          var index = $(this).index();
-          var $tr = $snapshots.find('tr').filter(function() {
-            return $(this).index() == index;
-          });
-
-          if ($tr.size() && $tr.hasClass('active')) { $(this).addClass('disabled ui-state-disabled'); }
-          else { $(this).removeClass('disabled ui-state-disabled'); }
-
-          if ($(this).is('.ui-tabs-selected.ui-state-disabled')) {
-            $snapshots.find('form').show();
-
-            if ($snapshots.find('li.ui-state-disabled').size() == $snapshots.find('li').size()) {
-              $snapshots.find('form').hide();
-            } else {
-              $snapshots.find('li:not(.ui-state-disabled):first a').click();
-            }
-          }
-        });
-      };
-
-      // Remove snapshot
-      $snapshots.find('.action.destroy').click(function() {
-        var $tr = $(this).closest('tr');
-        actions.remove({
-          context: context,
-          snapshot: $tr.data('json-obj'),
-          response: {
-            success: function(args) {
-              $tr.hide().removeClass('active');
-              $(':ui-dialog').dialog('option', 'position', 'center');
-
-              refreshSnapshotTabs();
-            }
-          }
-        });
-      });
-
-      // Get existing data
-      dataProvider({
-        context: context,
-        response: {
-          success: function(args) {
-            $(args.data).each(function() {
-              var snapshot = this;
-
-              // Get matching table row
-              var $tr = $snapshots.find('tr').filter(function() {
-                return $(this).index() == snapshot.type;
-              }).addClass('active').show();
-
-              $tr.data('json-obj', snapshot);
-
-              $tr.find('td.time span').html(snapshot.time);
-              $tr.find('td.timezone span').html(
-                $snapshots.find('select[name=timezone] option').filter(function() {
-                  return $(this).val() == snapshot['timezone'];
-                }).html()
-              );
-              $tr.find('td.keep span').html(snapshot.keep);
-              $tr.find('td.day-of-week span').html(
-                snapshot['day-of-week'] ?
-                  $snapshots.find('select[name=day-of-week] option').filter(function() {
-                    return $(this).val() == snapshot['day-of-week'];
-                  }).html() :
-                snapshot['day-of-month']
-              );
+
+                return true;
+            });
+
+            // Enable/disable snapshot tabs based on table contents;
+            var refreshSnapshotTabs = function() {
+                $snapshots.find('li').each(function() {
+                    var index = $(this).index();
+                    var $tr = $snapshots.find('tr').filter(function() {
+                        return $(this).index() == index;
+                    });
+
+                    if ($tr.size() && $tr.hasClass('active')) {
+                        $(this).addClass('disabled ui-state-disabled');
+                    } else {
+                        $(this).removeClass('disabled ui-state-disabled');
+                    }
+
+                    if ($(this).is('.ui-tabs-selected.ui-state-disabled')) {
+                        $snapshots.find('form').show();
+
+                        if ($snapshots.find('li.ui-state-disabled').size() == $snapshots.find('li').size()) {
+                            $snapshots.find('form').hide();
+                        } else {
+                            $snapshots.find('li:not(.ui-state-disabled):first a').click();
+                        }
+                    }
+                });
+            };
+
+            // Remove snapshot
+            $snapshots.find('.action.destroy').click(function() {
+                var $tr = $(this).closest('tr');
+                actions.remove({
+                    context: context,
+                    snapshot: $tr.data('json-obj'),
+                    response: {
+                        success: function(args) {
+                            $tr.hide().removeClass('active');
+                            $(':ui-dialog').dialog('option', 'position', 'center');
+
+                            refreshSnapshotTabs();
+                        }
+                    }
+                });
+            });
+
+            // Get existing data
+            dataProvider({
+                context: context,
+                response: {
+                    success: function(args) {
+                        $(args.data).each(function() {
+                            var snapshot = this;
+
+                            // Get matching table row
+                            var $tr = $snapshots.find('tr').filter(function() {
+                                return $(this).index() == snapshot.type;
+                            }).addClass('active').show();
+
+                            $tr.data('json-obj', snapshot);
+
+                            $tr.find('td.time span').html(snapshot.time);
+                            $tr.find('td.timezone span').html(
+                                $snapshots.find('select[name=timezone] option').filter(function() {
+                                    return $(this).val() == snapshot['timezone'];
+                                }).html()
+                            );
+                            $tr.find('td.keep span').html(snapshot.keep);
+                            $tr.find('td.day-of-week span').html(
+                                snapshot['day-of-week'] ?
+                                $snapshots.find('select[name=day-of-week] option').filter(function() {
+                                    return $(this).val() == snapshot['day-of-week'];
+                                }).html() :
+                                snapshot['day-of-month']
+                            );
+                        });
+
+                        refreshSnapshotTabs();
+                    }
+                }
             });
 
-            refreshSnapshotTabs();
-          }
-        }
-      });
-
-      // Create dialog
-      var $dialog = $snapshots.dialog({
-        title: _l('label.action.recurring.snapshot'),
-        dialogClass: 'recurring-snapshots',
-        closeOnEscape:false,
-        width: 600,
-        buttons: [
-          {
-            text: _l('label.done'),
-            'class': 'ok',
-            click: function() {
-              $dialog.fadeOut(function() {
-                $dialog.remove();
-              });
-
-              $('div.overlay').fadeOut(function() {
-                $('div.overlay').remove();
-              });
-            }
-          }
-        ]
-      }).closest('.ui-dialog').overlay();
-
-      return $dialog;
+            // Create dialog
+            var $dialog = $snapshots.dialog({
+                title: _l('label.action.recurring.snapshot'),
+                dialogClass: 'recurring-snapshots',
+                closeOnEscape: false,
+                width: 600,
+                buttons: [{
+                    text: _l('label.done'),
+                    'class': 'ok',
+                    click: function() {
+                        $dialog.fadeOut(function() {
+                            $dialog.remove();
+                        });
+
+                        $('div.overlay').fadeOut(function() {
+                            $('div.overlay').remove();
+                        });
+                    }
+                }]
+            }).closest('.ui-dialog').overlay();
+
+            return $dialog;
+        };
     };
-  };
 }(cloudStack, jQuery));

http://git-wip-us.apache.org/repos/asf/cloudstack/blob/ad69bc8d/ui/scripts/ui-custom/regions.js
----------------------------------------------------------------------
diff --git a/ui/scripts/ui-custom/regions.js b/ui/scripts/ui-custom/regions.js
index 9fc36f3..986e009 100644
--- a/ui/scripts/ui-custom/regions.js
+++ b/ui/scripts/ui-custom/regions.js
@@ -16,115 +16,117 @@
 // under the License.
 
 (function($, cloudStack) {
-  $(window).bind('cloudStack.ready', function() {
-    // Region switcher
-    var $regionList = $('<ul>');
-
-    // Get region listing
-    var refreshRegions = function() {
-      $regionList.find('li').remove();
-      cloudStack.sections.regions.regionSelector.dataProvider({
-        response: {
-          success: function(args) {
-            var data = args.data;
-            
-						var currentRegion = null;
-            $(data).each(function() {
-              var region = this;
-              var regionName = region.name;
-              var $li = $('<li>').append($('<span>').html(_s(region.name)));
-
-              $li.data('region-data', region);
-							
-							/* e.g.
-							region.endpoint	== "http://localhost:8080/client/" 
-							document.location.href == "http://localhost:8080/client/#" 
+    $(window).bind('cloudStack.ready', function() {
+        // Region switcher
+        var $regionList = $('<ul>');
+
+        // Get region listing
+        var refreshRegions = function() {
+            $regionList.find('li').remove();
+            cloudStack.sections.regions.regionSelector.dataProvider({
+                response: {
+                    success: function(args) {
+                        var data = args.data;
+
+                        var currentRegion = null;
+                        $(data).each(function() {
+                            var region = this;
+                            var regionName = region.name;
+                            var $li = $('<li>').append($('<span>').html(_s(region.name)));
+
+                            $li.data('region-data', region);
+
+                            /* e.g.
+							region.endpoint	== "http://localhost:8080/client/"
+							document.location.href == "http://localhost:8080/client/#"
 							*/
-							if(document.location.href.indexOf(region.endpoint) != -1) {							
-                currentRegion = region;	
-								$li.addClass('active');
-							}
-														
-              $regionList.append($li);							
+                            if (document.location.href.indexOf(region.endpoint) != -1) {
+                                currentRegion = region;
+                                $li.addClass('active');
+                            }
+
+                            $regionList.append($li);
+                        });
+
+                        if (currentRegion != null) {
+                            $regionSwitcherButton.find('.title').html(_s(currentRegion.name)).attr('title', _s(currentRegion.name));
+                        } else {
+                            $regionSwitcherButton.find('.title').html('').attr('title', '');
+                        }
+                    }
+                }
             });
-							
-            if(currentRegion != null)	{						
-						  $regionSwitcherButton.find('.title').html(_s(currentRegion.name)).attr('title', _s(currentRegion.name));   
-            }		
-            else {
-              $regionSwitcherButton.find('.title').html('').attr('title', '');   
-            }						
-          }
-        }
-      });
-    };
-
-    $(window).bind('cloudStack.refreshRegions', refreshRegions);
-
-    var $regionSelector = $('<div>').addClass('region-selector')
-    .append($('<div>').addClass('top-arrow'))
-    .append($('<h2>').html(_l('label.menu.regions')))
-    .append($regionList)
-    .append(
-      $('<div>').addClass('buttons')
-      .append(
-        $('<div>').addClass('button close').append($('<span>').html(_l('label.close')))
-      )
-    )
-    .hide();
-    var $regionSwitcherButton = $('<div>').addClass('region-switcher')
-    .attr('title', 'Select region')
-    .append(
-      $('<span>').addClass('icon').html('&nbsp;'),
-      $('<span>').addClass('title').html('')
-    );
-
-    var closeRegionSelector = function(args) {
-      $regionSwitcherButton.removeClass('active');
-      $regionSelector.fadeOut(args ? args.complete : null);
-      $('body > .overlay').fadeOut(function() { $('body > .overlay').remove() });
-    };
-
-    var switchRegion = function(url) {
-      closeRegionSelector({
-        complete: function() {
-          $('#container').prepend($('<div>').addClass('loading-overlay'));          
-          document.location.href = url;
-        }
-      });
-    };
-
-    $regionList.click(function(event) {
-      var $target = $(event.target);
-      var $li = $target.closest('li');
-      var region, url;
-
-      if ($li.size() && !$li.hasClass('active')) {
-        region = $li.data('region-data');
-        url = region.endpoint;
-        id = region.id;
-
-        if (id != '-1') {
-          switchRegion(url);
-        }
-      }
-    });
+        };
 
-    $regionSwitcherButton.click(function() {
-      if ($regionSwitcherButton.hasClass('active')) {
-        closeRegionSelector();
-      } else {
-        $regionSwitcherButton.addClass('active');
-        $regionSelector.fadeIn('fast').overlay({ closeAction: closeRegionSelector });
-      }
-    });
+        $(window).bind('cloudStack.refreshRegions', refreshRegions);
+
+        var $regionSelector = $('<div>').addClass('region-selector')
+            .append($('<div>').addClass('top-arrow'))
+            .append($('<h2>').html(_l('label.menu.regions')))
+            .append($regionList)
+            .append(
+                $('<div>').addClass('buttons')
+                .append(
+                    $('<div>').addClass('button close').append($('<span>').html(_l('label.close')))
+                )
+        )
+            .hide();
+        var $regionSwitcherButton = $('<div>').addClass('region-switcher')
+            .attr('title', 'Select region')
+            .append(
+                $('<span>').addClass('icon').html('&nbsp;'),
+                $('<span>').addClass('title').html('')
+        );
+
+        var closeRegionSelector = function(args) {
+            $regionSwitcherButton.removeClass('active');
+            $regionSelector.fadeOut(args ? args.complete : null);
+            $('body > .overlay').fadeOut(function() {
+                $('body > .overlay').remove()
+            });
+        };
+
+        var switchRegion = function(url) {
+            closeRegionSelector({
+                complete: function() {
+                    $('#container').prepend($('<div>').addClass('loading-overlay'));
+                    document.location.href = url;
+                }
+            });
+        };
+
+        $regionList.click(function(event) {
+            var $target = $(event.target);
+            var $li = $target.closest('li');
+            var region, url;
+
+            if ($li.size() && !$li.hasClass('active')) {
+                region = $li.data('region-data');
+                url = region.endpoint;
+                id = region.id;
+
+                if (id != '-1') {
+                    switchRegion(url);
+                }
+            }
+        });
+
+        $regionSwitcherButton.click(function() {
+            if ($regionSwitcherButton.hasClass('active')) {
+                closeRegionSelector();
+            } else {
+                $regionSwitcherButton.addClass('active');
+                $regionSelector.fadeIn('fast').overlay({
+                    closeAction: closeRegionSelector
+                });
+            }
+        });
+
+        $regionSelector.find('.button.close').click(function() {
+            closeRegionSelector();
+        });
 
-    $regionSelector.find('.button.close').click(function() {
-      closeRegionSelector();
+        $('#header .controls .view-switcher.button:last').after($regionSwitcherButton, $regionSelector);
+        refreshRegions();
     });
-    
-    $('#header .controls .view-switcher.button:last').after($regionSwitcherButton, $regionSelector); 
-    refreshRegions();
-  });
-}(jQuery, cloudStack));      
-        
+}(jQuery, cloudStack));


Mime
View raw message