Merge pull request #92 from marshmalien/ux/fix/notifications

[UX] Fix Notification radio buttons and add close button to Toaster alert

awx/ui/client/src/app.js

@@ -151,7 +151,8 @@ var awApp = angular.module('awApp', [
     .config(['ngToastProvider', function(ngToastProvider) {
         ngToastProvider.configure({
             animation: 'slide',
-            dismissOnTimeout: true,
+            dismissOnTimeout: false,
+            dismissButton: true,
             timeout: 4000
         });
     }])

awx/ui/client/src/notifications/add/add.controller.js

@@ -134,10 +134,22 @@ export default ['Rest', 'Wait', 'NotificationsFormObject',
 
         $scope.emailOptionsChange = function () {
             if ($scope.email_options === 'use_ssl') {
+                if ($scope.use_ssl) {
+                    $scope.email_options = null;
+                    $scope.use_ssl = false;
+                    return;
+                }
+
                 $scope.use_ssl = true;
                 $scope.use_tls = false;
             }
             else if ($scope.email_options === 'use_tls') {
+                if ($scope.use_tls) {
+                    $scope.email_options = null;
+                    $scope.use_tls = false;
+                    return;
+                }
+
                 $scope.use_ssl = false;
                 $scope.use_tls = true;
             }

awx/ui/client/src/notifications/edit/edit.controller.js

@@ -205,10 +205,22 @@ export default ['Rest', 'Wait',
 
         $scope.emailOptionsChange = function () {
             if ($scope.email_options === 'use_ssl') {
+                if ($scope.use_ssl) {
+                    $scope.email_options = null;
+                    $scope.use_ssl = false;
+                    return;
+                }
+
                 $scope.use_ssl = true;
                 $scope.use_tls = false;
             }
             else if ($scope.email_options === 'use_tls') {
+                if ($scope.use_tls) {
+                    $scope.email_options = null;
+                    $scope.use_tls = false;
+                    return;
+                }
+
                 $scope.use_ssl = false;
                 $scope.use_tls = true;
             }
@@ -263,7 +275,7 @@ export default ['Rest', 'Wait',
             Rest.setUrl(url + id + '/');
             Rest.put(params)
                 .success(function() {
-                    $state.go($state.current, null, { reload: true });
+                    $state.go('notifications', {}, { reload: true });
                     Wait('stop');
                 })
                 .error(function(data, status) {

awx/ui/client/src/notifications/notificationTemplates.form.js

@@ -398,7 +398,7 @@ export default ['i18n', function(i18n) {
                 type: 'radio_group',
                 subForm: 'typeSubForm',
                 ngShow: "notification_type.value == 'email'",
-                ngChange: "emailOptionsChange()",
+                ngClick: "emailOptionsChange()",
                 ngDisabled: '!(notification_template.summary_fields.user_capabilities.edit || canAdd)',
                 options: [{
                     value: 'use_tls',

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

@@ -25,3 +25,25 @@
 .NotificationsForm-radioButtons{
     display:block!important;
 }
+
+#notification_templates_table .name-column {
+    padding-left: 10px;
+}
+
+.notificationsList {
+    margin-top: 0;
+}
+
+.ng-toast {
+    .alert {
+        margin: 0;
+    }
+    .close {
+        position: absolute;
+        right: 5px;
+        top: 0px;
+        color: white;
+        opacity: 1;
+        text-shadow: none;
+    }
+}

awx/ui/client/src/shared/form-generator.js

@@ -1287,6 +1287,7 @@ angular.module('FormGenerator', [GeneratorHelpers.name, 'Utilities', listGenerat
                             html += "value=\"" + field.options[i].value + "\" ";
                             html += "ng-model=\"" + fld + "\" ";
                             html += (field.ngChange) ? this.attr(field, 'ngChange') : "";
+                            html += (field.ngClick) ? this.attr(field, 'ngClick') : "";
                             html += (field.ngDisabled) ? `ng-disabled="${field.ngDisabled}"` : "";
                             html += (field.readonly) ? "disabled " : "";
                             html += (field.required) ? "required " : "";