You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by at...@apache.org on 2017/11/20 15:02:25 UTC
ambari git commit: AMBARI-22478 Ambari 3.0: Implement new design for
Admin View: Edit cluster name. (atkach)
Repository: ambari
Updated Branches:
refs/heads/trunk cc535c841 -> af8c40178
AMBARI-22478 Ambari 3.0: Implement new design for Admin View: Edit cluster name. (atkach)
Project: http://git-wip-us.apache.org/repos/asf/ambari/repo
Commit: http://git-wip-us.apache.org/repos/asf/ambari/commit/af8c4017
Tree: http://git-wip-us.apache.org/repos/asf/ambari/tree/af8c4017
Diff: http://git-wip-us.apache.org/repos/asf/ambari/diff/af8c4017
Branch: refs/heads/trunk
Commit: af8c40178f4caf56404d688ec56c252e25de3aef
Parents: cc535c8
Author: Andrii Tkach <at...@apache.org>
Authored: Mon Nov 20 16:18:27 2017 +0200
Committer: Andrii Tkach <at...@apache.org>
Committed: Mon Nov 20 16:18:27 2017 +0200
----------------------------------------------------------------------
.../controllers/ClusterInformationCtrl.js | 45 +++++++-
.../app/styles/cluster-information.css | 13 ++-
.../admin-web/app/views/clusterInformation.html | 29 +++++-
.../controllers/ClusterInformationCtrl_test.js | 102 +++++++++++++++++++
4 files changed, 176 insertions(+), 13 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/ambari/blob/af8c4017/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ClusterInformationCtrl.js
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ClusterInformationCtrl.js b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ClusterInformationCtrl.js
index 60a610c..059f399 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ClusterInformationCtrl.js
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/scripts/controllers/ClusterInformationCtrl.js
@@ -18,16 +18,22 @@
'use strict';
angular.module('ambariAdminConsole')
-.controller('ClusterInformationCtrl', ['$scope', '$http', '$location', 'Cluster', '$routeParams', '$translate', '$rootScope',
-function($scope, $http, $location, Cluster, $routeParams, $translate, $rootScope) {
+.controller('ClusterInformationCtrl',
+['$scope', '$http', '$location', 'Cluster', '$routeParams', '$translate', '$rootScope', 'ConfirmationModal', 'Alert',
+function($scope, $http, $location, Cluster, $routeParams, $translate, $rootScope, ConfirmationModal, Alert) {
var $t = $translate.instant;
$scope.isDataLoaded = false;
+ $scope.edit = {
+ clusterName: null
+ };
+ $scope.isClusterNameEdited = false;
$scope.$watch(function() {
return $rootScope.cluster;
}, function() {
$scope.cluster = $rootScope.cluster;
if ($scope.cluster) {
+ $scope.edit.clusterName = $scope.cluster.Clusters.cluster_name;
$scope.getBlueprint();
}
}, true);
@@ -62,4 +68,39 @@ function($scope, $http, $location, Cluster, $routeParams, $translate, $rootScope
a.click();
}
};
+
+ $scope.toggleSaveButton = function() {
+ var value = $scope.edit.clusterName;
+ $scope.isClusterNameEdited = (value !== null && $scope.cluster.Clusters.cluster_name !== value);
+ };
+
+ $scope.confirmClusterNameChange = function() {
+ ConfirmationModal.show(
+ $t('common.clusterNameChangeConfirmation.title'),
+ $t('common.clusterNameChangeConfirmation.message', {
+ clusterName: $scope.edit.clusterName
+ })
+ )
+ .then(function () {
+ $scope.saveClusterName();
+ }).catch(function () {
+ // user clicked cancel
+ $scope.edit.clusterName = $scope.cluster.Clusters.cluster_name;
+ $scope.toggleSaveButton();
+ });
+ };
+
+ $scope.saveClusterName = function() {
+ var oldClusterName = $scope.cluster.Clusters.cluster_name,
+ newClusterName = $scope.edit.clusterName;
+
+ Cluster.editName(oldClusterName, newClusterName).then(function(data) {
+ $scope.cluster.Clusters.cluster_name = newClusterName;
+ $scope.edit.clusterName = newClusterName;
+ $scope.toggleSaveButton();
+ Alert.success($t('common.alerts.clusterRenamed', {clusterName: newClusterName}));
+ }).catch(function(data) {
+ Alert.error($t('common.alerts.cannotRenameCluster', {clusterName: newClusterName}), data.data.message);
+ });
+ };
}]);
http://git-wip-us.apache.org/repos/asf/ambari/blob/af8c4017/ambari-admin/src/main/resources/ui/admin-web/app/styles/cluster-information.css
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/styles/cluster-information.css b/ambari-admin/src/main/resources/ui/admin-web/app/styles/cluster-information.css
index 63f4150..64e9ecb 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/styles/cluster-information.css
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/styles/cluster-information.css
@@ -28,19 +28,18 @@
vertical-align: text-top;
}
-#cluster-information .cluster-name label {
- font-weight: normal;
+#cluster-information .cluster-name input {
+ width: 75%;
}
-#cluster-information .dev-blueprint {
- line-height: 35px;
+#cluster-information .cluster-name button {
+ margin-top: -34px;
}
-#cluster-information .dev-blueprint span {
- vertical-align: text-top;
+#cluster-information .cluster-name input.edited {
+ background-color: #fdfbdd;
}
-
#cluster-information .welcome-header {
margin: -15px;
padding: 15px 15px 40px 15px;
http://git-wip-us.apache.org/repos/asf/ambari/blob/af8c4017/ambari-admin/src/main/resources/ui/admin-web/app/views/clusterInformation.html
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/app/views/clusterInformation.html b/ambari-admin/src/main/resources/ui/admin-web/app/views/clusterInformation.html
index 6334d06..ead73c3 100644
--- a/ambari-admin/src/main/resources/ui/admin-web/app/views/clusterInformation.html
+++ b/ambari-admin/src/main/resources/ui/admin-web/app/views/clusterInformation.html
@@ -39,12 +39,33 @@
</div>
<div ng-show="cluster.Clusters.provisioning_state === 'INSTALLED'">
- <div class="row">
- <div class="form-group col-xs-3 cluster-name">
+ <form class="row" name="editClusterNameForm" ng-submit="confirmClusterNameChange()">
+ <div class="form-group col-xs-4 cluster-name"
+ ng-class="{'has-error': editClusterNameForm.clusterName.$invalid}">
<label for="clusterName">{{'views.clusterName' | translate}}*</label>
- <input type="text" class="form-control" id="clusterName" ng-model="cluster.Clusters.cluster_name">
+ <input type="text"
+ class="form-control"
+ id="clusterName"
+ name="clusterName"
+ ng-change="toggleSaveButton()"
+ ng-model="edit.clusterName"
+ required
+ autofocus
+ ng-pattern="/^\w*$/"
+ ng-maxlength="80"
+ tooltip="{{'common.renameClusterTip' | translate}}"
+ tooltip-trigger="focus"
+ tooltip-placement="bottom"
+ ng-class="{edited: isClusterNameEdited}">
+ <button
+ type="submit"
+ ng-class="{'disabled': editClusterNameForm.clusterName.$invalid}"
+ class="btn btn-default pull-right"
+ ng-show="isClusterNameEdited">
+ {{'common.controls.save' | translate}}
+ </button>
</div>
- </div>
+ </form>
<div>
<div class="row dev-blueprint">
<div class="col-sm-11"><span>{{'clusters.devBlueprint' | translate}}</span></div>
http://git-wip-us.apache.org/repos/asf/ambari/blob/af8c4017/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/ClusterInformationCtrl_test.js
----------------------------------------------------------------------
diff --git a/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/ClusterInformationCtrl_test.js b/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/ClusterInformationCtrl_test.js
new file mode 100644
index 0000000..2972e7f
--- /dev/null
+++ b/ambari-admin/src/main/resources/ui/admin-web/test/unit/controllers/ClusterInformationCtrl_test.js
@@ -0,0 +1,102 @@
+/**
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+describe('ClusterInformationCtrl', function() {
+ beforeEach(module('ambariAdminConsole'));
+
+ var ctrl, $scope, Cluster, deferred, ConfirmationModal;
+
+ beforeEach(inject(function($controller, $rootScope, _Cluster_, _$q_, _ConfirmationModal_){
+ // The injector unwraps the underscores (_) from around the parameter names when matching
+ Cluster = _Cluster_;
+ ConfirmationModal = _ConfirmationModal_;
+ deferred = _$q_.defer();
+ $scope = $rootScope.$new();
+ $scope.$apply();
+ ctrl = $controller('ClusterInformationCtrl', {
+ $scope: $scope
+ });
+
+ spyOn(Cluster, 'getBlueprint').andReturn(deferred.promise);
+ spyOn(Cluster, 'editName').andReturn(deferred.promise);
+ spyOn(ConfirmationModal, 'show').andReturn(deferred.promise);
+ }));
+
+ describe('#getBlueprint', function() {
+ it('Cluster.getBlueprint should be called', function() {
+ $scope.cluster = {
+ Clusters: {
+ cluster_name: 'c1'
+ }
+ };
+ $scope.getBlueprint();
+ expect(Cluster.getBlueprint).toHaveBeenCalled();
+ });
+ });
+
+ describe('#toggleSaveButton', function() {
+ beforeEach(function() {
+ $scope.cluster = {
+ Clusters: {
+ cluster_name: 'c1'
+ }
+ };
+ });
+
+ it('isClusterNameEdited should be true', function() {
+ $scope.edit = {
+ clusterName: 'c2'
+ };
+ $scope.toggleSaveButton();
+ expect($scope.isClusterNameEdited).toBeTruthy();
+ });
+
+ it('isClusterNameEdited should be false', function() {
+ $scope.edit = {
+ clusterName: 'c1'
+ };
+ $scope.toggleSaveButton();
+ expect($scope.isClusterNameEdited).toBeFalsy();
+ });
+ });
+
+ describe('#confirmClusterNameChange', function() {
+ it('ConfirmationModal.show should be called', function() {
+ $scope.edit = {
+ clusterName: 'c1'
+ };
+ $scope.confirmClusterNameChange();
+ expect(ConfirmationModal.show).toHaveBeenCalled();
+ });
+ });
+
+ describe('#saveClusterName', function() {
+ it('Cluster.editName should be called', function() {
+ $scope.edit = {
+ clusterName: 'c1'
+ };
+ $scope.cluster = {
+ Clusters: {
+ cluster_name: 'c2'
+ }
+ };
+ $scope.saveClusterName();
+ expect(Cluster.editName).toHaveBeenCalledWith('c2', 'c1');
+ });
+ });
+});