From 62e860afc129b292d95ff4462261faf3478b4f7e Mon Sep 17 00:00:00 2001
From: Chris Houseknecht <chouse@ansible.com>
Date: Thu, 27 Mar 2014 10:47:22 -0400
Subject: [PATCH] Fixed Utilities.alert() so that Alert dialog boxes no longer
 render empty. The issue was one of scope. The alert dialogs exist in the
 parent scope. Often the scope of the caller is in a child or nested child
 scope. Alerts now have their own scope and the HTML is compiled just before
 render.

---
 awx/ui/static/js/helpers/Lookup.js     |  2 +-
 awx/ui/static/lib/ansible/Utilities.js | 99 +++++++++++++-------------
 2 files changed, 52 insertions(+), 49 deletions(-)

diff --git a/awx/ui/static/js/helpers/Lookup.js b/awx/ui/static/js/helpers/Lookup.js
index a830a8eabb..989701ca72 100644
--- a/awx/ui/static/js/helpers/Lookup.js
+++ b/awx/ui/static/js/helpers/Lookup.js
@@ -192,7 +192,7 @@ angular.module('LookUpHelper', ['RestServices', 'Utilities', 'SearchHelper', 'Pa
                     }
                     if (found === false) {
                         Alert('Missing Selection', 'Oops, you failed to make a selection. Click on a row to make your selection, ' +
-                            'and then click the Select button.');
+                            'and then click the Select button. Or, click Cancel to quit.');
                     } else {
                         $('#lookup-modal-dialog').dialog('close');
                         if (postAction) {
diff --git a/awx/ui/static/lib/ansible/Utilities.js b/awx/ui/static/lib/ansible/Utilities.js
index 8767ca5359..84fd39dec3 100644
--- a/awx/ui/static/lib/ansible/Utilities.js
+++ b/awx/ui/static/lib/ansible/Utilities.js
@@ -75,57 +75,60 @@ angular.module('Utilities', ['RestServices', 'Utilities'])
  * alert-info...). Pass an optional function(){}, if you want a specific action to occur when user
  * clicks 'OK' button. Set secondAlert to true, when a second dialog is needed.
  */
-.factory('Alert', ['$rootScope',
-    function ($rootScope) {
-        return function (hdr, msg, cls, action, secondAlert, disableButtons) {
-            if (secondAlert) {
-                $rootScope.alertHeader2 = hdr;
-                $rootScope.alertBody2 = msg;
-                $rootScope.alertClass2 = (cls) ? cls : 'alert-danger'; //default alert class is alert-danger
-                $('#alert-modal2').modal({
-                    show: true,
-                    keyboard: true,
-                    backdrop: 'static'
-                });
-                $rootScope.disableButtons2 = (disableButtons) ? true : false;
-                
-                $('#alert-modal2').on('hidden.bs.modal', function () {
-                    if (action) {
-                        action();
-                    }
-                });
-                $(document).bind('keydown', function (e) {
-                    if (e.keyCode === 27) {
-                        $('#alert-modal2').modal('hide');
-                    }
-                });
-            } else {
-                $rootScope.alertHeader = hdr;
-                $rootScope.alertBody = msg;
-                $rootScope.alertClass = (cls) ? cls : 'alert-danger'; //default alert class is alert-danger
-                $('#alert-modal').modal({
-                    show: true,
-                    keyboard: true,
-                    backdrop: 'static'
-                });
+.factory('Alert', ['$rootScope', '$compile', function ($rootScope, $compile) {
+    return function (hdr, msg, cls, action, secondAlert, disableButtons) {
+        var scope = $rootScope.$new(), e;
+        if (secondAlert) {
+            scope.alertHeader2 = hdr;
+            scope.alertBody2 = msg;
+            scope.alertClass2 = (cls) ? cls : 'alert-danger'; //default alert class is alert-danger
+            e = angular.element(document.getElementById('alert-modal2'));
+            $compile(e)(scope);
+            $('#alert-modal2').modal({
+                show: true,
+                keyboard: true,
+                backdrop: 'static'
+            });
+            scope.disableButtons2 = (disableButtons) ? true : false;
+            
+            $('#alert-modal2').on('hidden.bs.modal', function () {
+                if (action) {
+                    action();
+                }
+            });
+            $(document).bind('keydown', function (e) {
+                if (e.keyCode === 27) {
+                    $('#alert-modal2').modal('hide');
+                }
+            });
+        } else {
+            scope.alertHeader = hdr;
+            scope.alertBody = msg;
+            scope.alertClass = (cls) ? cls : 'alert-danger'; //default alert class is alert-danger
+            e = angular.element(document.getElementById('alert-modal'));
+            $compile(e)(scope);
+            $('#alert-modal').modal({
+                show: true,
+                keyboard: true,
+                backdrop: 'static'
+            });
 
-                $('#alert-modal').on('hidden.bs.modal', function () {
-                    if (action) {
-                        action();
-                    }
-                });
+            $('#alert-modal').on('hidden.bs.modal', function () {
+                if (action) {
+                    action();
+                }
+            });
 
-                $(document).bind('keydown', function (e) {
-                    if (e.keyCode === 27) {
-                        $('#alert-modal').modal('hide');
-                    }
-                });
+            $(document).bind('keydown', function (e) {
+                if (e.keyCode === 27) {
+                    $('#alert-modal').modal('hide');
+                }
+            });
 
-                $rootScope.disableButtons = (disableButtons) ? true : false;
-            }
-        };
-    }
-])
+            scope.disableButtons = (disableButtons) ? true : false;
+        }
+    };
+}])
 
 
 .factory('ProcessErrors', ['$rootScope', '$cookieStore', '$log', '$location', 'Alert', 'Wait',