Merge pull request #1760 from jaredevantabor/license-flow

Changing license workflow for first time user

awx/ui/client/src/app.js

@@ -730,6 +730,9 @@ var tower = angular.module('Tower', [
 
 
                 $rootScope.$on("$stateChangeStart", function (event, next, nextParams, prev) {
+                    if (next.name !== 'signOut'){
+                        CheckLicense.notify();
+                    }
                     $rootScope.$broadcast("closePermissionsModal");
                     // this line removes the query params attached to a route
                     if(prev && prev.$$route &&
@@ -822,6 +825,7 @@ var tower = angular.module('Tower', [
                             $rootScope.sessionTimer = timer;
                             $rootScope.$emit('OpenSocket');
                             pendoService.issuePendoIdentity();
+                            CheckLicense.notify();
                         });
                     }
                 }

awx/ui/client/src/bread-crumb/bread-crumb.partial.html

@@ -1,5 +1,5 @@
 <div id="bread_crumb" class="BreadCrumb" ng-class="{'is-loggedOut' : !$root.current_user.username}">
-    <div ncy-breadcrumb></div>
+    <div ng-if="!licenseMissing" ncy-breadcrumb></div>
     <div class="BreadCrumb-menuLink"
         id="bread_crumb_activity_stream"
         aw-tool-tip="View Activity Stream"
@@ -8,6 +8,7 @@
         data-container="body"
         ng-class="{'BreadCrumb-menuLinkActive' : activityStreamActive}"
         ng-if="showActivityStreamButton"
+        ng-hide= "licenseMissing"
         ng-click="openActivityStream()">
         <i class="BreadCrumb-menuLinkImage icon-activity-stream"
             alt="Activity Stream">
@@ -20,6 +21,7 @@
         data-placement="left"
         data-trigger="hover"
         data-container="body"
+        ng-hide="licenseMissing"
         ng-if="!showActivityStreamButton">
         <i class="BreadCrumb-menuLinkImage fa fa-tachometer"
             alt="Dashboard">

awx/ui/client/src/inventories/manage/manage-hosts/manage-hosts-add.controller.js

@@ -17,7 +17,7 @@
         $scope.toggleEnabled = function(){
             $scope.host.enabled = !$scope.host.enabled;
         };
-        $scope.formSave = function(){;
+        $scope.formSave = function(){
             var params = {
                 variables: $scope.extraVars === '---' || $scope.extraVars === '{}' ? null : $scope.extraVars,
                 name: $scope.name,
@@ -25,7 +25,7 @@
                 enabled: $scope.host.enabled,
                 inventory: $stateParams.inventory_id
             };
-            ManageHostsService.post(params).then(function(res){
+            ManageHostsService.post(params).then(function(){
                 $state.go('^', null, {reload: true});
             });
         };

awx/ui/client/src/inventories/manage/manage-hosts/manage-hosts-edit.controller.js

@@ -24,7 +24,7 @@
                 description: $scope.description,
                 enabled: $scope.host.enabled
             };
-            ManageHostsService.put(host).then(function(res){
+            ManageHostsService.put(host).then(function(){
                 $state.go('^', null, {reload: true});
             });
         };

awx/ui/client/src/license/checkLicense.factory.js

@@ -5,13 +5,15 @@
  *************************************************/
 
 export default
-	['$state', '$rootScope', 'Rest', 'GetBasePath', 'ProcessErrors', function($state, $rootScope, Rest, GetBasePath, ProcessErrors){
+	['$state', '$rootScope', 'Rest', 'GetBasePath', 'ProcessErrors', '$q',
+	function($state, $rootScope, Rest, GetBasePath, ProcessErrors, $q){
 			return {
 				get: function() {
 					var defaultUrl = GetBasePath('config');
 					Rest.setUrl(defaultUrl);
 					return Rest.get()
 						.success(function(res){
+							$rootScope.license_tested = true;
 							return res;
 						})
 	                    .error(function(res, status){
@@ -50,13 +52,26 @@ export default
 					 	return true;
 				},
 				notify: function(){
-					var self = this;
+					var deferred = $q.defer(),
-					this.get()
+						self = this;
-						.then(function(res){
+					if($rootScope.license_tested !== true){
-							if(self.valid(res.data.license_info) === false) {
+						this.get()
-								$state.go('license');
+							.then(function(res){
-							}
+								if(self.valid(res.data.license_info) === false) {
-						});
+									$rootScope.licenseMissing = true;
+									deferred.resolve();
+									$state.go('license');
+								}
+								else {
+									$rootScope.licenseMissing = false;
+								}
+							});
+					}
+					else{
+						deferred.resolve();
+					}
+
+					return deferred.promise;
 				}
 
 			};

awx/ui/client/src/license/license.block.less

@@ -32,7 +32,7 @@
 }
 .License-eula textarea{
 	width: 100%;
-	height: 300px;
+	height: 200px;
 }
 .License-field label{
 	width: 155px;
@@ -64,6 +64,20 @@
 .License-management{
 	.OnePlusTwo-right--panel(650px);
 }
+.License-management--missingLicense{
+	height: auto;
+}
+.License-downloadLicenseButton{
+	background-color: @default-link !important;
+	margin-bottom: 10px;
+	color:@default-bg;
+}
+.License-downloadLicenseButton:hover{
+	color:@default-bg !important;
+}
+.License-downloadLicenseButton:focus{
+	color:@default-bg !important;
+}
 .License-submit--container{
 	height: 33px;
 }

awx/ui/client/src/license/license.controller.js

@@ -5,10 +5,10 @@
  *************************************************/
 
 export default
-	[	'Wait', '$state', '$scope', '$rootScope', '$location',
+	['Wait', '$state', '$scope', '$rootScope', '$location', 'GetBasePath',
-	 'GetBasePath', 'Rest', 'ProcessErrors', 'CheckLicense', 'moment',
+	'Rest', 'ProcessErrors', 'CheckLicense', 'moment','$window',
-	 function( Wait, $state, $scope, $rootScope, $location,
+	function( Wait, $state, $scope, $rootScope, $location, GetBasePath, Rest,
-	 	GetBasePath, Rest, ProcessErrors, CheckLicense, moment){
+		ProcessErrors, CheckLicense, moment, $window){
 	 	$scope.getKey = function(event){
 	 		// Mimic HTML5 spec, show filename
 	 		$scope.fileName = event.target.files[0].name;
@@ -35,6 +35,11 @@ export default
 	 	$scope.fakeClick = function(){
 	 		$('#License-file').click();
 	 	};
+
+		$scope.downloadLicense = function(){
+            $window.open('https://www.ansible.com/license', '_blank');
+        };
+
 		$scope.newLicense = {};
 		$scope.submit = function(){
 			Wait('start');
@@ -48,6 +53,13 @@ export default
 						$scope.success = false;
 						clearTimeout(successTimeout);
 					}, 4000);
+					if($rootScope.licenseMissing === true){
+						$rootScope.licenseMissing = false;
+						$state.go('dashboard');
+					}
+					else{
+						$rootScope.licenseMissing = false;
+					}
 			});
 		};
 	 	var calcDaysRemaining = function(ms){
@@ -62,6 +74,7 @@ export default
 	 	};
 	 	var init = function(){
 	 		$scope.fileName = "Please choose a file...";
+			$scope.title = $rootScope.licenseMissing ? "Tower License" : "License Management";
 	 		Wait('start');
 	 		CheckLicense.get()
 	 		.then(function(res){

awx/ui/client/src/license/license.partial.html

@@ -1,5 +1,5 @@
 <div class="License-container">
-	<div class="License-details">
+	<div class="License-details" ng-if="!licenseMissing">
 		<div class="Panel">
 			<div class="License-titleText">Details</div>
 			<div class="License-fields">
@@ -69,11 +69,32 @@
 			<a href="https://www.ansible.com/renew" target="_blank"><button class="btn btn-default">Upgrade</button></a>
 		</div>
 	</div>
-	<div class="License-management">
+	<div class="License-management" ng-class="{'License-management--missingLicense' : licenseMissing}">
 		<div class="Panel">
-			<div class="License-titleText">License Management</div>
+			<div class="License-titleText">{{title}}</div>
 			<div class="License-body">
-				<p class="License-helperText">Choose your license file, agree to the End User License Agreement, and click submit.</p>
+				<div class="AddPermissions-directions" ng-if="licenseMissing">
+					<span class="AddPermissions-directionNumber">
+						1.
+					</span>
+					<span class="License-helperText">
+						Please click the button below to visit Ansible's website to get a Tower license key.
+					</span>
+				</div>
+
+					<button class="License-downloadLicenseButton btn" ng-if="licenseMissing" ng-click="downloadLicense()">
+						Request License
+					</button>
+
+				<div class="AddPermissions-directions">
+					<span class="AddPermissions-directionNumber" ng-if="licenseMissing">
+						2.
+					</span>
+					<span class="License-helperText">
+						Choose your license file, agree to the End User License Agreement, and click submit.
+					</span>
+				</div>
+
 				<form id="License-form" name="license">
 					<div class="License-subTitleText prepend-asterisk"> License File</div>
 					<div class="input-group License-file--container">
@@ -89,12 +110,12 @@
 					<div class="form-group">
 						<div class="checkbox">
 							<div class="License-details--label"><input type="checkbox" ng-model="newLicense.eula" required>  I agree to the End User License Agreement</div>
-							<div class="License-submit--container pull-right">
-								<span ng-show="success == true" class="License-greenText License-submit--success pull-left">Save successful!</span>
-								<button ng-click="submit()" class="btn btn-success pull-right" ng-disabled="newLicense.file.license_key == null || newLicense.eula == null">Submit</button>
-							</div>
 						</div>
 					</div>
+					<div class="License-submit--container">
+						<span ng-show="success == true" class="License-greenText License-submit--success pull-left">Save successful!</span>
+						<button ng-click="submit()" class="btn btn-success pull-right" ng-disabled="newLicense.file.license_key == null || newLicense.eula == null">Submit</button>
+					</div>
 				</form>
 			</div>
 		</div>

awx/ui/client/src/license/license.route.js

@@ -15,5 +15,14 @@ export default {
 	ncyBreadcrumb: {
 		parent: 'setup',
 		label: 'LICENSE'
-	}
+	},
+	resolve: {
+		features: ['CheckLicense', '$rootScope',
+			function(CheckLicense, $rootScope) {
+				if($rootScope.licenseMissing === undefined){
+					return CheckLicense.notify();
+				}
+
+		}]
+	},
 };

awx/ui/client/src/main-menu/main-menu.block.less

@@ -17,6 +17,10 @@
     align-items: stretch;
 }
 
+.MainMenu--licenseMissing{
+    justify-content: flex-end;
+}
+
 .MainMenu-logo,
 .MainMenu-item {
     color: @menu-link;

awx/ui/client/src/main-menu/main-menu.partial.html

@@ -1,8 +1,9 @@
-<nav id="main_menu" class="MainMenu">
+<nav id="main_menu" class="MainMenu" ng-class="{'MainMenu--licenseMissing' : licenseMissing}">
     <!-- Menu logo item -->
     <a id="main_menu_logo"
         href="/#/"
         class="MainMenu-logo"
+        ng-if="!licenseMissing"
         ng-class="{'is-loggedOut' : !$root.current_user.username}">
         <img class="MainMenu-logoImage"
             ng-src="/static/assets/tower-logo-header.svg">
@@ -88,6 +89,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--left"
         id="main_menu_projects_link"
         href="/#/projects"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('projects'), 'is-loggedOut' : !$root.current_user.username}">
         <span class="MainMenu-itemText">
             PROJECTS
@@ -96,6 +98,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--left"
         id="main_menu_inventories_link"
         href="/#/inventories"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('inventories'), 'is-loggedOut' : !$root.current_user.username}">
         <span class="MainMenu-itemText">
             INVENTORIES
@@ -104,6 +107,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--left"
         id="main_menu_job_templates_link"
         href="/#/job_templates"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('jobTemplates'), 'is-loggedOut' : !$root.current_user.username}">
         <span class="MainMenu-itemText">
             JOB TEMPLATES
@@ -112,6 +116,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--left MainMenu-item--lastLeft"
         id="main_menu_jobs_link"
         href="/#/jobs"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('jobs'), 'is-loggedOut' : !$root.current_user.username}">
         <span class="MainMenu-itemText">
             JOBS
@@ -120,6 +125,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--user MainMenu-item--right"
         id="main_menu_current_user_link"
         ng-href="/#/users/{{ $root.current_user.id }}"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('users.edit'), 'is-loggedOut' : !$root.current_user.username}"
         aw-tool-tip="{{currentUserTip}}"
         aw-tip-watch="currentUserTip"
@@ -136,6 +142,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
         id="main_menu_setup_link"
         ng-href="/#/setup"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('setup'), 'is-loggedOut' : !$root.current_user.username}"
         aw-tool-tip="Settings"
         data-placement="bottom"
@@ -148,6 +155,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
         id="main_menu_portal_link"
         ng-href="/#/portal"
+        ng-if="!licenseMissing"
         ng-class="{'is-currentRoute' : isCurrentState('portalMode'), 'is-loggedOut' : !$root.current_user.username}"
         aw-tool-tip="Portal Mode"
         data-placement="bottom"
@@ -160,6 +168,7 @@
     <a class="MainMenu-item MainMenu-item--notMobile MainMenu-item--right"
         id="main_menu_docs_link"
         ng-href="http://docs.ansible.com/ansible-tower/"
+        ng-if="!licenseMissing"
         ng-class="{'is-loggedOut' : !$root.current_user.username}"
         aw-tool-tip="View Documentation"
         data-placement="bottom"
@@ -204,6 +213,7 @@
     <button
         id="main_menu_mobile_toggle_button"
         class="MainMenu-toggle"
+        ng-if="!licenseMissing"
         ng-class="{'is-active': !isHiddenOnMobile, 'is-loggedOut' : !$root.current_user.username}"
         ng-click="toggleMenu()">
         <i class="fa fa-bars MainMenu-toggleImage"></i>