AC-232 First iteration of License display.

awx/ui/static/css/ansible-ui.css

@@ -78,8 +78,8 @@
  }
 
  .login-alert {
-    font-weight: bold;
+    font-weight: normal;
-    font-size: 16px;
+    font-size: 14px;
     text-align: center;
     color: #0088cc;
     margin-bottom: 25px;
@@ -375,7 +375,10 @@
  
 /* Jobs pages */
 
- .job-error, .job-failed,
+ .job-error, 
+ .job-failed,
+ .license-expired,
+ .license-invalid,
  .active-failures-true,
  .active-failures-true a,
  .active-failures-true a:active,
@@ -394,7 +397,8 @@
     color: #da4f49;
  }
 
- .job-event-status {
+ .job-event-status,
+ .license-status {
     padding-top: 5px;
  }
 
@@ -408,13 +412,16 @@
  .job-success,
  .job-successful,
  .active-failures-false,
+ .license-valid,
  input[type="text"].job-success,
  input[type="text"].job-successful
  {
     color: #5bb75b;
  }
 
- .job-changed {
+ .job-changed,
+ .license-warning,
+ .license-demo {
     color: #FF9900;
  }
 
@@ -508,7 +515,7 @@
  }
 
  #hosts-well {
-    padding-top: 10px;
+    padding-top: 5px;
  }
 
  #hosts-title p {
@@ -522,6 +529,11 @@
  #hosts-well .search-widget {
    margin-top: 10px;
  }
+
+ #hosts-well .list-actions {
+   padding-top: 10px;
+ }
+
  .parse-selection {
    font-size: 12px;
    margin: 5px 0 8px 0;

awx/ui/static/js/app.js

@@ -60,7 +60,9 @@ angular.module('ansible', [
     'ProjectPathHelper',
     'md5Helper',
     'AccessHelper',
-    'SelectionHelper'
+    'SelectionHelper',
+    'LicenseFormDefinition',
+    'License'
      ])
     .config(['$routeProvider', function($routeProvider) {
         $routeProvider.
@@ -214,8 +216,8 @@ angular.module('ansible', [
             
             otherwise({redirectTo: '/'});
     }])
-    .run(['$rootScope', 'CheckLicense', '$location', 'Authorization','LoadBasePaths', 
+    .run(['$rootScope', 'CheckLicense', '$location', 'Authorization','LoadBasePaths', 'ViewLicense',
-         function($rootScope, CheckLicense, $location, Authorization, LoadBasePaths) {
+         function($rootScope, CheckLicense, $location, Authorization, LoadBasePaths, ViewLicense) {
         
         LoadBasePaths(); 
 
@@ -265,5 +267,10 @@ angular.module('ansible', [
 
         $rootScope.viewCurrentUser = function() {
             $location.path('/users/' + $rootScope.current_user.id);
-            }    
+            }
+
+        $rootScope.viewLicense = function() {
+            //$location.path('/license');
+            ViewLicense();
+            }   
     }]);

awx/ui/static/js/forms/License.js

@@ -0,0 +1,86 @@
+/*********************************************
+ *  Copyright (c) 2013 AnsibleWorks, Inc.
+ *
+ *  License.js
+ *  Form definition for LIcense model
+ *
+ *  
+ */
+angular.module('LicenseFormDefinition', [])
+    .value(
+    'LicenseForm', {
+
+        name: 'license',
+        well: false,
+        well: false,
+        forceListeners: true,
+        'class': 'horizontal-narrow',                                            
+
+        fields: {
+            license_status: {
+                label: 'Status',
+                type: 'custom',
+                control: '<div ng-class=\"status_color\" class=\"license-status\"><i class="icon-circle"></i> \{\{ license_status \}\}</div>',
+                readonly: true,
+                section: 'License'
+                },
+            license_key: {
+                label: 'Key',
+                type: 'textarea',
+                section: 'License',
+                'class': 'modal-input-xlarge',
+                readonly: true
+                },
+            license_date: {
+                label: 'Activated On',
+                type: 'text',
+                readonly: true,
+                section: 'License'
+                },
+            time_remaining: {
+                label: 'Days Left',
+                type: 'text',
+                readonly: true,
+                section: 'License'
+                },
+            available_instances: {
+                label: 'License Count',
+                type: 'text',
+                readonly: true,
+                section: 'Available Servers'
+                },
+            current_instances: {
+                label: 'Used',
+                type: 'text',
+                readonly: true,
+                section: 'Available Servers'
+                },
+            free_instances: {
+                label: 'Remaining',
+                type: 'text',
+                readonly: true,
+                section: 'Available Servers'
+                },
+            company_name: {
+                label: 'Company',
+                type: 'text',
+                readonly: true,
+                section: 'Contact Info'
+                },
+            contact_name: {
+                label: 'Contact',
+                type: 'text',
+                readonly: true,
+                section: 'Contact Info'
+                },
+            contact_email: {
+                label: 'Contact Email',
+                type: 'text',
+                readonly: true,
+                section: 'Contact Info'
+                }
+            }
+
+    }); //form
+
+    

awx/ui/static/lib/ansible/form-generator.js

@@ -681,15 +681,26 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
           }
           else {
              // original, single-column form
-             var section = '';             
+             var section = '';        
+             var group = '';     
              for (var fld in this.form.fields) {
                  var field = this.form.fields[fld];
+                 
+                 if (field.group && field.group != group) {
+                    if (group !== '') {
+                       html += "</div>\n";
+                    }
+                    html += "<div class=\"well\">\n";
+                    html += "<h5>" + field.group + "</h5>\n"; 
+                    group = field.group;
+                 }
+
                  if (field.section && field.section != section) {
                     if (section !== '') {
                        html += "</div>\n";
                     }
                     else {
-                        html += "</div>";
+                        html += "</div>\n";
                         html += "<div id=\"" + this.form.name + "-collapse\" class=\"jqui-accordion-modal\">\n";
                     }
                     var sectionShow = (this.form[field.section + 'Show']) ? " ng-show=\"" + this.form[field.section + 'Show'] + "\"" : "";
@@ -697,11 +708,15 @@ angular.module('FormGenerator', ['GeneratorHelpers', 'ngCookies'])
                     html += "<div" + sectionShow + ">\n";
                     section = field.section;
                  }
+
                  html += this.buildField(fld, field, options);
              }
              if (section !== '') {
                 html += "</div>\n</div>\n";
              }
+             if (group !== '') {
+                html += "</div>\n";
+             }
           }
 
           //buttons

awx/ui/static/lib/ansible/license.js

@@ -0,0 +1,69 @@
+/*****************************************
+ * License.js
+ *
+ * View license info: /api/vi/config/
+ *
+ *****************************************/
+
+'use strict';
+
+angular.module('License', ['LicenseFormDefinition', 'RestServices', 'Utilities', 'FormGenerator'])
+   .factory('ViewLicense', ['$location', 'LicenseForm', 'GenerateForm', 'Rest', 'Alert', 'GetBasePath', 'ProcessErrors', 
+   function($location, LicenseForm, GenerateForm, Rest, Alert, GetBasePath, ProcessErrors) {
+   return function() {
+   
+   var defaultUrl=GetBasePath('config');
+   var generator = GenerateForm;
+   var form = LicenseForm;
+   var base = $location.path().replace(/^\//,'').split('/')[0];
+   
+   // load the form
+   var scope = generator.inject(form, { mode: 'edit', modal: true, related: false});
+   generator.reset();
+   scope.formModalAction = function() {
+       $('#form-modal').modal("hide");
+       }
+   scope.formModalActionLabel = 'OK';
+   scope.formModalCancelShow = false;
+   scope.formModalInfo = false;
+   $('#form-modal .btn-success').removeClass('btn-success').addClass('btn-none');
+   $('#form-modal').addClass('skinny-modal');
+   scope.formModalHeader = 'AWX License';
+                
+   // Retrieve detail record and prepopulate the form
+   Rest.setUrl(defaultUrl); 
+   Rest.get()
+       .success( function(data, status, headers, config) {
+           for (var fld in form.fields) {
+              if (data['license_info'][fld]) {
+                 scope[fld] = data['license_info'][fld];
+              }
+           }
+           var license = data['license_info'][fld];
+           if (license['valid_key'] !== undefined && license['valid_key'] == false) {
+              scope['license_status'] = 'Invalid';
+              scope['status_color'] = 'license-invalid';
+           }
+           else if (license['demo'] !== undefined && license['demo'] == true) {
+              scope['license_status'] = 'Demo';
+              scope['status_color'] = 'license-demo';
+           }
+           else if (license['date_warning'] !== undefined && license['date_warning'] == true) {
+              scope['license_status'] = 'Expired';
+              scope['status_color'] = 'license-expired';
+           }
+           else if (license['free_instances'] !== undefined && parseInt(license['free_instances']) <= 0) {
+              scope['license_status'] = 'No available servers';
+              scope['status_color'] = 'license-warning';
+           }
+           else {
+              scope['license_status'] = 'Valid';
+              scope['status_color'] = 'license-valid';
+           }
+           })
+       .error( function(data, status, headers, config) {
+           ProcessErrors(scope, data, status, form,
+               { hdr: 'Error!', msg: 'Failed to retrieve license. GET status: ' + status });
+           });
+   }
+   }]);

awx/ui/templates/ui/index.html

@@ -32,6 +32,7 @@
   <script src="{{ STATIC_URL }}lib/ansible/directives.js"></script>
   <script src="{{ STATIC_URL }}lib/ansible/filters.js"></script>
   <script src="{{ STATIC_URL }}lib/ansible/api-loader.js"></script>
+  <script src="{{ STATIC_URL }}lib/ansible/LicenseView.js"></script>
   <script src="{{ STATIC_URL }}js/controllers/Authentication.js"></script>
   <script src="{{ STATIC_URL }}js/controllers/Organizations.js"></script>
   <script src="{{ STATIC_URL }}js/controllers/Users.js"></script>
@@ -57,6 +58,7 @@
   <script src="{{ STATIC_URL }}js/forms/Projects.js"></script>
   <script src="{{ STATIC_URL }}js/forms/Permissions.js"></script>
   <script src="{{ STATIC_URL }}js/forms/JobEventData.js"></script>
+  <script src="{{ STATIC_URL }}js/forms/License.js"></script>
   <script src="{{ STATIC_URL }}js/lists/Users.js"></script>
   <script src="{{ STATIC_URL }}js/lists/Organizations.js"></script>
   <script src="{{ STATIC_URL }}js/lists/Admins.js"></script>
@@ -102,6 +104,7 @@
            <ul class="nav pull-right">
              <li ng-show="current_user.username != null && current_user.username != undefined">
               <a href="" ng-click="viewCurrentUser()" ng-bind="'Hello! ' + current_user.username"></a></li>
+             <li ng-show="userLoggedIn == true"><a href="" ng-click="viewLicense()">View License</a></li>
              <li ng-show="userLoggedIn == true"><a href="#/logout">Logout</a></li>
            </ul>
          </div><!-- container -->