Add revision component to job details

awx/ui/client/lib/components/truncate/truncate.directive.js

@@ -1,6 +1,6 @@
 function atTruncateLink (scope, el, attr, ctrl) {
     let truncateController = ctrl;
-    let string = attr.atTruncate;
+    let string = attr.string;
     let maxlength = attr.maxlength;
 
     truncateController.init(scope, string, maxlength);
@@ -8,36 +8,73 @@ function atTruncateLink (scope, el, attr, ctrl) {
 
 function AtTruncateController ($filter) {
     let vm = this;
+    vm.toolTipContent = 'Copy full revision to clipboard.';
 
-    let string,
+    let maxlength;
-        maxlength;
 
     vm.init = (scope, _string_, _maxlength_) => {
-        string = _string_;
+        vm.string = _string_;
         maxlength = _maxlength_;
-        vm.truncatedString = $filter('limitTo')(string, maxlength, 0);
+        vm.truncatedString = $filter('limitTo')(vm.string, maxlength, 0);
     }
 
+    vm.copy = function() {
+        vm.toolTipContent = 'Copied to clipboard.';
+
+        let textArea = document.createElement("textarea");
+
+        // Place in top-left corner of screen regardless of scroll position.
+        textArea.style.position = 'fixed';
+        textArea.style.top = 0;
+        textArea.style.left = 0;
+
+        // Ensure it has a small width and height. Setting to 1px / 1em
+        // doesn't work as this gives a negative w/h on some browsers.
+        textArea.style.width = '2em';
+        textArea.style.height = '2em';
+
+        // We don't need padding, reducing the size if it does flash render.
+        textArea.style.padding = 0;
+
+        // Clean up any borders.
+        textArea.style.border = 'none';
+        textArea.style.outline = 'none';
+        textArea.style.boxShadow = 'none';
+
+        // Avoid flash of white box if rendered for any reason.
+        textArea.style.background = 'transparent';
+
+        textArea.value = vm.string;
+        document.body.appendChild(textArea);
+        textArea.select();
+
+        document.execCommand('copy');
+
+        document.body.removeChild(textArea);
+    };
+
 }
 
 
-function atTruncate($filter) {
+function atTruncate($filter, pathService) {
     return {
         restrict: 'EA',
         replace: true,
         transclude: true,
-        template: '<span>{{vm.truncatedString}}</span>',
+        templateUrl: pathService.getPartialPath('components/truncate/truncate'),
         controller: AtTruncateController,
         controllerAs: 'vm',
         link: atTruncateLink,
         scope: {
-            maxLength: '@'
+            maxLength: '@',
+            string: '@'
         }
     }
 }
 
 atTruncate.$inject = [
-    '$filter'
+    '$filter',
+    'PathService'
 ];
 
 export default atTruncate;

awx/ui/client/lib/components/truncate/truncate.partial.html

@@ -0,0 +1,9 @@
+<div class="RevisionHash">
+    <div class="RevisionHash-tag">
+        <span class="RevisionHash-name">{{vm.truncatedString}}</span>
+    </div>
+    <div class="RevisionHash-copy" aw-tool-tip="vm.toolTipContent" data-tip-watch="vm.toolTipContent"
+        data-placement="top" ng-click="vm.copy()">
+        <i class="fa fa-clone"></i>
+    </div>
+</div>

awx/ui/client/src/job-results/job-results.partial.html

@@ -247,9 +247,8 @@
                         <label class="JobResults-resultRowLabel">
                             Revision
                         </label>
-                        <div class="JobResults-resultRowText JobResults-resultRowText--revision">
+                        <at-truncate string="{{job.scm_revision}}" maxLength="7" class="JobResults-resultRowText JobResults-resultRowText--revision">
-                            {{ job.scm_revision }}
+                        </at-truncate>
-                        </div>
                     </div>
 
                     <!-- PLAYBOOK DETAIL -->

awx/ui/client/src/projects/list/projects-list.controller.js

@@ -94,14 +94,16 @@ export default ['$scope', '$rootScope', '$log', 'Rest', 'Alert',
         }
 
         $scope.$on('copied', function(e) {
-            $scope.projects.map( (project) => {
+            // $scope.projects.map( (project) => {
-                if (project.id === e.targetScope.project.id) {
+            //     if (project.id === e.targetScope.project.id) {
-                    project.tooltipContent = 'Copied to clipboard.';
+            //         project.tooltipContent = 'Copied to clipboard.';
-                }
+            //     }
-                else {
+            //     else {
-                    project.tooltipContent = "Copy full revision to clipboard.";
+            //         project.tooltipContent = "Copy full revision to clipboard.";
-                }
+            //     }
-            });
+            // });
+            console.log('copied hi there');
+            console.log(e);
         });
 
         $scope.reloadList = function(){

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

@@ -525,7 +525,7 @@ angular.module('GeneratorHelpers', [systemStatus.name])
                 Attr(field, 'columnClass') : "";
                 html += `
                 <td ${classList}>
-                    <revisions class=\"RevisionHash\"></revisions>
+                    <at-truncate string="{{project.scm_revision}}"  maxLength="7"></at-truncate>
                 </td>`;
             } else if (field.type === 'badgeCount') {
                 html = BadgeCount(params);