From 44e436ca93ca206f7a7c0b5601713cce5aac34a1 Mon Sep 17 00:00:00 2001
From: Ken Hoes <khoes@ansible.com>
Date: Fri, 3 Feb 2017 13:15:07 -0500
Subject: [PATCH 1/2] Added thumbnail display for custom logo upload

---
 .../configuration/configuration.block.less    |  8 +++++++
 awx/ui/client/src/shared/directives.js        | 23 ++++++++++---------
 2 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/awx/ui/client/src/configuration/configuration.block.less b/awx/ui/client/src/configuration/configuration.block.less
index f06aa21d01..0aa2e2da55 100644
--- a/awx/ui/client/src/configuration/configuration.block.less
+++ b/awx/ui/client/src/configuration/configuration.block.less
@@ -85,6 +85,14 @@ input#filePickerText {
     background-color: #fff;
 }
 
+.Form-filePicker--selectedFile {
+    margin: 12px 0;
+}
+
+.Form-filePicker--thumbnail {
+    height: 40px;
+}
+
 // Messagebar for system auditor role notifications
 .Section-messageBar {
     width: 120%;
diff --git a/awx/ui/client/src/shared/directives.js b/awx/ui/client/src/shared/directives.js
index 78b9ec916f..4b3cf6a7d9 100644
--- a/awx/ui/client/src/shared/directives.js
+++ b/awx/ui/client/src/shared/directives.js
@@ -128,11 +128,11 @@ angular.module('AWDirectives', ['RestServices', 'Utilities', 'JobsHelper'])
 // Accepts image and returns base64 information with basic validation
 // Can eventually expand to handle all uploads with different endpoints and handlers
 //
-.directive('imageUpload', ['ConfigurationUtils', 'i18n',
-function(ConfigurationUtils, i18n) {
+.directive('imageUpload', ['ConfigurationUtils', 'i18n', '$rootScope',
+function(ConfigurationUtils, i18n, $rootScope) {
     var browseText = i18n._('BROWSE'),
     placeholderText = i18n._('Choose file'),
-    uploadedText = i18n._('Custom logo has been uploaded'),
+    uploadedText = i18n._('Current Image: '),
     removeText = i18n._('REMOVE');
 
     return {
@@ -146,14 +146,12 @@ function(ConfigurationUtils, i18n) {
                       <input type="text" class="form-control Form-filePicker--textBox" id="filePickerText" placeholder="${placeholderText}" readonly>
                       <input type="file" name="file" class="Form-filePicker" id="filePicker"  onchange="angular.element(this).scope().fileChange(this.files)"/>
                     </div>
-                <!-- Update when API supports file name saving
+
                 <div ng-if="imagePresent" class="Form-filePicker--selectedFile">
-                    ${uploadedText}
-                </div>-->
-                <!-- Thumbnail feature
-                <div class="thumbnail">
-                    <img src="{{image}}" alt="Current logo">
-                </div> -->
+                ${uploadedText}
+                    <img data-ng-src="{{imageData}}" alt="Current logo" class="Form-filePicker--thumbnail">
+                </div>
+
                 <div class="error" id="filePickerError"></div>`,
 
         link: function(scope) {
@@ -162,11 +160,14 @@ function(ConfigurationUtils, i18n) {
             var filePickerError = angular.element(document.getElementById('filePickerError'));
             var filePickerButton = angular.element(document.getElementById('filePickerButton'));
 
-            scope.imagePresent = global.$AnsibleConfig.custom_logo;
+            scope.imagePresent = global.$AnsibleConfig.custom_logo || false;
+            scope.imageData = $rootScope.custom_logo;
 
             scope.$on('loginUpdated', function() {
                 scope.imagePresent = global.$AnsibleConfig.custom_logo;
+                scope.imageData = $rootScope.custom_logo;
             });
+
             scope.update = function(e) {
                 if(scope.$parent[fieldKey]) {
                     e.preventDefault();

From d10047147bb12988b71be3678e58e1ab69829620 Mon Sep 17 00:00:00 2001
From: kensible <khoes@ansible.com>
Date: Mon, 6 Feb 2017 09:23:38 -0500
Subject: [PATCH 2/2] Update configuration.block.less

---
 awx/ui/client/src/configuration/configuration.block.less | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/awx/ui/client/src/configuration/configuration.block.less b/awx/ui/client/src/configuration/configuration.block.less
index 0aa2e2da55..b5a7d203cf 100644
--- a/awx/ui/client/src/configuration/configuration.block.less
+++ b/awx/ui/client/src/configuration/configuration.block.less
@@ -90,7 +90,8 @@ input#filePickerText {
 }
 
 .Form-filePicker--thumbnail {
-    height: 40px;
+    max-height: 40px;
+    max-width: 40px;
 }
 
 // Messagebar for system auditor role notifications