From 9dcd6d52af079019700a5b3d635ec69a3d13f9db Mon Sep 17 00:00:00 2001
From: jaredevantabor <jtabor@ansible.com>
Date: Tue, 29 Nov 2016 14:44:27 -0800
Subject: [PATCH] making labels section collapsible on job results

---
 .../src/job-results/job-results.block.less    |  9 +++++++
 .../src/job-results/job-results.controller.js | 12 +++++++++
 .../src/job-results/job-results.partial.html  | 26 +++++++++++++++----
 3 files changed, 42 insertions(+), 5 deletions(-)

diff --git a/awx/ui/client/src/job-results/job-results.block.less b/awx/ui/client/src/job-results/job-results.block.less
index 5b6e46e373..9165ac4d4c 100644
--- a/awx/ui/client/src/job-results/job-results.block.less
+++ b/awx/ui/client/src/job-results/job-results.block.less
@@ -94,6 +94,15 @@
     width: 100%;
 }
 
+.JobResults-expandArrow {
+    color: #D7D7D7;
+    font-size: 14px;
+    font-weight: bold;
+    margin-right: 10px;
+    text-transform: uppercase;
+    margin-left: 10px;
+}
+
 .JobResults-resultRowText--revision{
     font-family: monospace;
 }
diff --git a/awx/ui/client/src/job-results/job-results.controller.js b/awx/ui/client/src/job-results/job-results.controller.js
index 454eed3e6e..282bf648d2 100644
--- a/awx/ui/client/src/job-results/job-results.controller.js
+++ b/awx/ui/client/src/job-results/job-results.controller.js
@@ -86,6 +86,18 @@ export default ['jobData', 'jobDataOptions', 'jobLabels', 'jobFinished', 'count'
         jobResultsService.relaunchJob($scope);
     };
 
+    $scope.lessLabels = false;
+    $scope.toggleLessLabels = function() {
+        if (!$scope.lessLabels) {
+            $('#job-results-labels').slideUp(200);
+            $scope.lessLabels = true;
+        }
+        else {
+            $('#job-results-labels').slideDown(200);
+            $scope.lessLabels = false;
+        }
+    };
+
     // get initial count from resolve
     $scope.count = count.val;
     $scope.hostCount = getTotalHostCount(count.val);
diff --git a/awx/ui/client/src/job-results/job-results.partial.html b/awx/ui/client/src/job-results/job-results.partial.html
index 594dc01112..3e1399447a 100644
--- a/awx/ui/client/src/job-results/job-results.partial.html
+++ b/awx/ui/client/src/job-results/job-results.partial.html
@@ -305,11 +305,27 @@
                     <!-- LABELS DETAIL -->
                     <div class="JobResults-resultRow"
                         ng-show="labels && labels.length > 0">
-                        <label class="JobResults-resultRowLabel
-                            JobResults-resultRowLabel--fullWidth">
-                            Labels
-                        </label>
-                        <div class="LabelList
+                        <div class="JobResults-resultRow">
+                            <a class="JobResults-resultRowLabel
+                                JobResults-resultRowLabel--fullWidth"
+                                ng-show="lessLabels"
+                                href=""
+                                ng-click="toggleLessLabels()">
+                                    Labels
+                                <i class="JobResults-expandArrow
+                                    fa fa-caret-right"></i>
+                            </a>
+                            <a class="JobResults-resultRowLabel
+                                JobResults-resultRowLabel--fullWidth"
+                                ng-show="!lessLabels"
+                                href=""
+                                ng-click="toggleLessLabels()">
+                                    Labels
+                                <i class="JobResults-expandArrow
+                                    fa fa-caret-down"></i>
+                            </a>
+                        </div>
+                        <div id="job-results-labels" class="LabelList
                             JobResults-resultRowText
                             JobResults-resultRowText--fullWidth">
                             <div ng-repeat="label in labels"