diff --git a/awx/ui/client/lib/components/truncate/truncate.directive.js b/awx/ui/client/lib/components/truncate/truncate.directive.js index 6ce69aed6b..fd0d496230 100644 --- a/awx/ui/client/lib/components/truncate/truncate.directive.js +++ b/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, - maxlength; + let 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: '{{vm.truncatedString}}', + templateUrl: pathService.getPartialPath('components/truncate/truncate'), controller: AtTruncateController, controllerAs: 'vm', link: atTruncateLink, scope: { - maxLength: '@' + maxLength: '@', + string: '@' } } } atTruncate.$inject = [ - '$filter' + '$filter', + 'PathService' ]; export default atTruncate; \ No newline at end of file diff --git a/awx/ui/client/lib/components/truncate/truncate.partial.html b/awx/ui/client/lib/components/truncate/truncate.partial.html new file mode 100644 index 0000000000..5d5bcd7ead --- /dev/null +++ b/awx/ui/client/lib/components/truncate/truncate.partial.html @@ -0,0 +1,9 @@ +