Repository: ambari Updated Branches: refs/heads/trunk 67c6f5561 -> a26fefccd
AMBARI-19625 Admin View: add spinners for tables in loading state. (atkach) Project: http://git-wip-us.apache.org/repos/asf/ambari/repo Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/a26fefcc Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/a26fefcc Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/a26fefcc Branch: refs/heads/trunk Commit: a26fefccdd6a5f10acd9f41d9f8bcf417d55bd8c Parents: 67c6f55 Author: Andrii Tkach <atk...@apache.org> Authored: Thu Jan 19 12:13:52 2017 +0200 Committer: Andrii Tkach <atk...@apache.org> Committed: Thu Jan 19 13:54:08 2017 +0200 ---------------------------------------------------------------------- .../app/scripts/controllers/ambariViews/ViewsListCtrl.js | 6 ++++++ .../admin-web/app/scripts/controllers/groups/GroupsListCtrl.js | 3 +++ .../controllers/remoteClusters/RemoteClustersListCtrl.js | 3 +++ .../scripts/controllers/stackVersions/StackVersionsListCtrl.js | 3 +++ .../admin-web/app/scripts/controllers/users/UsersListCtrl.js | 3 +++ .../src/main/resources/ui/admin-web/app/styles/main.css | 5 +++++ .../ui/admin-web/app/views/ambariViews/listTable.html | 5 ++++- .../resources/ui/admin-web/app/views/ambariViews/listUrls.html | 5 ++++- .../src/main/resources/ui/admin-web/app/views/groups/list.html | 5 ++++- .../resources/ui/admin-web/app/views/remoteClusters/list.html | 5 ++++- .../resources/ui/admin-web/app/views/stackVersions/list.html | 5 ++++- .../src/main/resources/ui/admin-web/app/views/users/list.html | 5 ++++- 12 files changed, 47 insertions(+), 6 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ambariViews/ViewsListCtrl.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ambariViews/ViewsListCtrl.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ambariViews/ViewsListCtrl.js index e98801c..c41e5d4 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ambariViews/ViewsListCtrl.js +++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ambariViews/ViewsListCtrl.js @@ -21,6 +21,8 @@ angular.module('ambariAdminConsole') .controller('ViewsListCtrl',['$scope', 'View','$modal', 'Alert', 'ConfirmationModal', '$location', '$translate', function($scope, View, $modal, Alert, ConfirmationModal, $location, $translate) { var deferredList = [], $t = $translate.instant; + $scope.isLoadingViews = false; + $scope.isLoadingUrls = false; $scope.constants = { unable: $t('views.alerts.unableToCreate'), views: $t('common.views').toLowerCase() @@ -55,7 +57,9 @@ angular.module('ambariAdminConsole') } function loadViews(){ + $scope.isLoadingViews = true; View.all().then(function(views) { + $scope.isLoadingViews = false; $scope.views = views; $scope.getFilteredViews(); angular.forEach(views, function(view) { @@ -211,6 +215,7 @@ angular.module('ambariAdminConsole') $scope.listViewUrls = function(){ + $scope.isLoadingUrls = true; View.allUrls({ currentPage: $scope.currentPage, urlsPerPage: $scope.urlsPerPage, @@ -218,6 +223,7 @@ angular.module('ambariAdminConsole') suffixSearch: $scope.urlSuffixfilter, instanceType: $scope.instanceTypeFilter?$scope.instanceTypeFilter.value:'*' }).then(function(urls) { + $scope.isLoadingUrls = false; $scope.urls = urls; $scope.ViewNameFilterOptions = urls.items.map(function(url){ return url.ViewUrlInfo.view_instance_common_name; http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/groups/GroupsListCtrl.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/groups/GroupsListCtrl.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/groups/GroupsListCtrl.js index 948b707..7cc590e 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/groups/GroupsListCtrl.js +++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/groups/GroupsListCtrl.js @@ -23,6 +23,7 @@ angular.module('ambariAdminConsole') $scope.constants = { groups: $t('common.groups').toLowerCase() }; + $scope.isLoading = false; $scope.groups = []; $scope.groupsPerPage = 10; @@ -49,12 +50,14 @@ angular.module('ambariAdminConsole') }; function loadGroups(){ + $scope.isLoading = true; Group.all({ currentPage: $scope.currentPage, groupsPerPage: $scope.groupsPerPage, searchString: $scope.currentNameFilter, group_type: $scope.currentTypeFilter.value }).then(function(groups) { + $scope.isLoading = false; $scope.totalGroups = groups.itemTotal; $scope.groups = groups.map(Group.makeGroup); $scope.tableInfo.total = groups.itemTotal; http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/remoteClusters/RemoteClustersListCtrl.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/remoteClusters/RemoteClustersListCtrl.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/remoteClusters/RemoteClustersListCtrl.js index dc3a120..3656dfc 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/remoteClusters/RemoteClustersListCtrl.js +++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/remoteClusters/RemoteClustersListCtrl.js @@ -22,6 +22,7 @@ angular.module('ambariAdminConsole') var $t = $translate.instant; $scope.clusterName = $routeParams.clusterName; + $scope.isLoading = false; $scope.constants = { groups: $t('common.clusters').toLowerCase() @@ -64,12 +65,14 @@ angular.module('ambariAdminConsole') }; function loadRemoteClusters(){ + $scope.isLoading = true; RemoteCluster.all({ currentPage: $scope.currentPage, groupsPerPage: $scope.groupsPerPage, searchString: $scope.currentNameFilter, service: $scope.currentTypeFilter }).then(function(remoteclusters) { + $scope.isLoading = false; $scope.totalGroups = remoteclusters.itemTotal; $scope.tableInfo.total = remoteclusters.itemTotal; http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/stackVersions/StackVersionsListCtrl.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/stackVersions/StackVersionsListCtrl.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/stackVersions/StackVersionsListCtrl.js index 34daa29..1de8817 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/stackVersions/StackVersionsListCtrl.js +++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/stackVersions/StackVersionsListCtrl.js @@ -23,6 +23,7 @@ angular.module('ambariAdminConsole') $scope.getConstant = function (key) { return $t('common.' + key).toLowerCase(); }; + $scope.isLoading = false; $scope.clusterName = $routeParams.clusterName; $scope.filter = { name: '', @@ -94,6 +95,7 @@ angular.module('ambariAdminConsole') $scope.fetchRepos = function () { return Stack.allRepos($scope.filter, $scope.pagination).then(function (repos) { + $scope.isLoading = false; $scope.pagination.totalRepos = repos.itemTotal; $scope.repos = repos.items; $scope.tableInfo.total = repos.itemTotal; @@ -151,6 +153,7 @@ angular.module('ambariAdminConsole') }; $scope.loadAllData = function () { + $scope.isLoading = true; $scope.fetchStacks() .then(function () { return $scope.fetchClusters(); http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/users/UsersListCtrl.js ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/users/UsersListCtrl.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/users/UsersListCtrl.js index bd2cec4..8146163 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/users/UsersListCtrl.js +++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/users/UsersListCtrl.js @@ -24,6 +24,7 @@ angular.module('ambariAdminConsole') admin: $t('users.ambariAdmin'), users: $t('common.users').toLowerCase() }; + $scope.isLoading = false; $scope.users = []; $scope.usersPerPage = 10; $scope.currentPage = 1; @@ -44,6 +45,7 @@ angular.module('ambariAdminConsole') }; $scope.loadUsers = function(){ + $scope.isLoading = true; User.list({ currentPage: $scope.currentPage, usersPerPage: $scope.usersPerPage, @@ -52,6 +54,7 @@ angular.module('ambariAdminConsole') active: $scope.currentActiveFilter.value, admin: $scope.adminFilter }).then(function(data) { + $scope.isLoading = false; $scope.totalUsers = data.data.itemTotal; $scope.users = data.data.items.map(User.makeUser); $scope.tableInfo.showed = data.data.items.length; http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/styles/main.css ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/styles/main.css b/ambari-admin/src/main/resources/ui/admin-web/app/styles/main.css index c81b789..dde8fbc 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/styles/main.css +++ b/ambari-admin/src/main/resources/ui/admin-web/app/styles/main.css @@ -1888,3 +1888,8 @@ legend { .glyphicon-question-sign { color: #0572ff; } + +.spinner-container { + text-align: center; + padding-bottom: 10px; +} \ No newline at end of file http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listTable.html ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listTable.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listTable.html index e03f035..02348ed 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listTable.html +++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listTable.html @@ -96,7 +96,10 @@ </tfoot> </table> </accordion-group> - <div class="alert alert-info" ng-show="views && !filteredViews.length"> + <div ng-if="isLoadingViews" class="spinner-container"> + <i class="fa fa-2x fa-spinner fa-spin" aria-hidden="true"></i> + </div> + <div class="alert alert-info" ng-show="views && !filteredViews.length && !isLoadingViews"> {{'common.alerts.nothingToDisplay' | translate: '{term: constants.views}'}} </div> http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listUrls.html ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listUrls.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listUrls.html index 82a4dec..6c18bd9 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listUrls.html +++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/ambariViews/listUrls.html @@ -95,7 +95,10 @@ </tr> </tbody> </table> - <div class="alert alert-info col-sm-12" ng-show="!urls.items.length"> + <div ng-if="isLoadingUrls" class="spinner-container"> + <i class="fa fa-2x fa-spinner fa-spin" aria-hidden="true"></i> + </div> + <div class="alert alert-info col-sm-12" ng-show="!urls.items.length && !isLoadingUrls"> {{'urls.noUrlsToDisplay'| translate}} </div> <div class="col-sm-12 table-bar"> http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html index 6be6fdd..8457065 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html +++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/groups/list.html @@ -58,7 +58,10 @@ </tr> </tbody> </table> - <div class="alert alert-info col-sm-12" ng-show="!groups.length"> + <div ng-if="isLoading" class="spinner-container"> + <i class="fa fa-2x fa-spinner fa-spin" aria-hidden="true"></i> + </div> + <div class="alert alert-info col-sm-12" ng-show="!groups.length && !isLoading"> {{'common.alerts.nothingToDisplay' | translate: '{term: constants.groups}'}} </div> <div class="col-sm-12 table-bar"> http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html index 7f525e8..bdecbdc 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html +++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/remoteClusters/list.html @@ -60,7 +60,10 @@ </tbody> </table> - <div class="alert alert-info col-sm-12" ng-show="!remoteClusters.length"> + <div ng-if="isLoading" class="spinner-container"> + <i class="fa fa-2x fa-spinner fa-spin" aria-hidden="true"></i> + </div> + <div class="alert alert-info col-sm-12" ng-show="!remoteClusters.length && !isLoading"> {{'common.alerts.noRemoteClusterDisplay' | translate}} </div> <div class="col-sm-12 table-bar"> http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html index 5ac78ca..120aed6 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html +++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/stackVersions/list.html @@ -105,7 +105,10 @@ </tr> </tbody> </table> - <div class="alert alert-info col-sm-12" ng-show="!repos.length"> + <div ng-if="isLoading" class="spinner-container"> + <i class="fa fa-2x fa-spinner fa-spin" aria-hidden="true"></i> + </div> + <div class="alert alert-info col-sm-12" ng-show="!repos.length && !isLoading"> {{'common.alerts.nothingToDisplay' | translate: '{term: getConstant("version")}'}} </div> <div class="col-sm-12 table-bar"> http://git-wip-us.apache.org/repos/asf/ambari/blob/a26fefcc/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html ---------------------------------------------------------------------- diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html index 9e93032..87e2be7 100644 --- a/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html +++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/users/list.html @@ -75,7 +75,10 @@ </tr> </tbody> </table> - <div class="alert alert-info col-sm-12" ng-show="!users.length"> + <div ng-if="isLoading" class="spinner-container"> + <i class="fa fa-2x fa-spinner fa-spin" aria-hidden="true"></i> + </div> + <div class="alert alert-info col-sm-12" ng-show="!users.length && !isLoading"> {{'common.alerts.nothingToDisplay' | translate: '{term: constants.users}'}} </div> <div class="col-sm-12 table-bar">