From 4c621aeae75e1ec72d9ccea6573a93b55007469e Mon Sep 17 00:00:00 2001
From: Jared Tabor <jtabor@ansible.com>
Date: Thu, 31 Jul 2014 11:55:47 -0400
Subject: [PATCH] adjusted Alert popup, and added a check for the drag and drop
 file size

---
 awx/ui/static/lib/ansible/Utilities.js  | 16 +++++++++-------
 awx/ui/static/lib/ansible/directives.js |  7 ++++++-
 awx/ui/templates/ui/index.html          |  4 ++--
 3 files changed, 17 insertions(+), 10 deletions(-)

diff --git a/awx/ui/static/lib/ansible/Utilities.js b/awx/ui/static/lib/ansible/Utilities.js
index 9425fcb72b..4a933807a3 100644
--- a/awx/ui/static/lib/ansible/Utilities.js
+++ b/awx/ui/static/lib/ansible/Utilities.js
@@ -75,15 +75,17 @@ 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', '$compile', '$sce', function ($rootScope, $compile, $sce) {
+.factory('Alert', ['$rootScope', '$compile', '$sce', function ($rootScope) {
     return function (hdr, msg, cls, action, secondAlert, disableButtons) {
         var scope = $rootScope.$new(), alertClass, e;
         if (secondAlert) {
             e = angular.element(document.getElementById('alert-modal2'));
-            $compile(e)(scope);
-            scope.alertHeader2 = hdr;
-            scope.alertBody2 = $sce.trustAsHtml(msg);
+
+            $('#alertHeader2').text(hdr);
+            $('#alert2-modal-msg').text(msg);
+            $("#alertHeader").text(msg);
             alertClass = (cls) ? cls : 'alert-danger'; //default alert class is alert-danger
+
             $('#alert2-modal-msg').attr({ "class": "alert " + alertClass });
             $('#alert-modal2').modal({
                 show: true,
@@ -104,9 +106,9 @@ angular.module('Utilities', ['RestServices', 'Utilities'])
             });
         } else {
             e = angular.element(document.getElementById('alert-modal'));
-            $compile(e)(scope);
-            scope.alertHeader = hdr;
-            scope.alertBody = $sce.trustAsHtml(msg);
+
+            $('#alertHeader').text(hdr);
+            $('#alert-modal-msg').text(msg);
             alertClass = (cls) ? cls : 'alert-danger'; //default alert class is alert-danger
             $('#alert-modal-msg').attr({ "class": "alert " + alertClass });
             $('#alert-modal').modal({
diff --git a/awx/ui/static/lib/ansible/directives.js b/awx/ui/static/lib/ansible/directives.js
index 4f132614f2..fefa8232b1 100644
--- a/awx/ui/static/lib/ansible/directives.js
+++ b/awx/ui/static/lib/ansible/directives.js
@@ -786,7 +786,12 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'AuthService', 'Job
                     reader.onerror = function() {
                         Alert('Error','There was an error reading the selected file.');
                     };
-                    reader.readAsText(files[0]);
+                    if(files[0].size<10000){
+                        reader.readAsText(files[0]);
+                    }
+                    else {
+                        Alert('Error','There was an error reading the selected file.');
+                    }
                 });
             }
         };
diff --git a/awx/ui/templates/ui/index.html b/awx/ui/templates/ui/index.html
index bee2c85f23..4c90d51ecf 100644
--- a/awx/ui/templates/ui/index.html
+++ b/awx/ui/templates/ui/index.html
@@ -362,7 +362,7 @@
               <div class="modal-header">
                 <button type="button" class="close" ng-hide="disableButtons" data-target="#alert-modal"
                     data-dismiss="modal" class="modal" aria-hidden="true">&times;</button>
-                <h3 ng-bind="alertHeader"></h3>
+                <h3 id= "alertHeader" ng-bind="alertHeader"></h3>
               </div>
               <div class="modal-body">
                 <div id="alert-modal-msg" class="alert" ng-bind-html="alertBody"></div>
@@ -380,7 +380,7 @@
               <div class="modal-header">
                 <button type="button" class="close" data-target="#alert-modal2"
                                 data-dismiss="modal" ng-hide="disableButtons2" aria-hidden="true">&times;</button>
-                <h3 ng-bind="alertHeader2"></h3>
+                <h3 id="alertHeader2" ng-bind="alertHeader2"></h3>
               </div>
               <div class="modal-body">
                 <div id="alert2-modal-msg" class="alert" ng-bind-html="alertBody2"></div>