Skip to content

Commit f2e4fda

Browse files
juanvallejojuanvallejo
committed
use copy-to-clipboard directive
1 parent 72af64d commit f2e4fda

File tree

6 files changed

+36
-62
lines changed

6 files changed

+36
-62
lines changed

‎app/scripts/controllers/commandLine.js

-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ angular.module('openshiftConsole')
1515
$scope.loginBaseURL = DataService.openshiftAPIBaseUrl();
1616
$scope.sessionToken = AuthService.UserStore().getToken();
1717
$scope.showSessionToken = false;
18-
$scope.copySessionTokenId = "showSessionTokenLink";
1918

2019
$scope.toggleShowSessionToken = function() {
2120
$scope.showSessionToken = !$scope.showSessionToken;

‎app/scripts/directives/util.js

+7-7
Original file line numberDiff line numberDiff line change
@@ -77,8 +77,8 @@ angular.module('openshiftConsole')
7777
scope: {
7878
clipboardText: "=",
7979
isDisabled: "=?",
80-
displayAsLink: "=?",
81-
customLinkText: "=?"
80+
displayWide: "=?",
81+
inputText: "=?"
8282
},
8383
templateUrl: 'views/directives/_copy-to-clipboard.html',
8484
controller: function($scope) {
@@ -90,13 +90,13 @@ angular.module('openshiftConsole')
9090
return;
9191
}
9292

93-
var node = $('a', element);
94-
var nodeItem = node.get(0);
95-
if($scope.displayAsLink) {
96-
nodeItem = node.get(1);
93+
var nodeElem = $('a', element);
94+
var node = nodeElem.get(0);
95+
if ($scope.inputText) {
96+
node = nodeElem.get(1);
9797
}
9898

99-
var clipboard = new Clipboard( nodeItem );
99+
var clipboard = new Clipboard( node );
100100
clipboard.on('success', function (e) {
101101
$(e.trigger)
102102
.attr('title', 'Copied!')

‎app/views/command-line.html

+5-17
Original file line numberDiff line numberDiff line change
@@ -37,40 +37,28 @@ <h1 id="cli">Command Line Tools</h1>
3737
</p>
3838
<p>
3939
After downloading and installing it, you can start by logging in using<span ng-if="sessionToken"> this current session token</span>:
40-
<div ng-if="sessionToken">
41-
<div class="code prettyprint ng-binding">
42-
oc login {{loginBaseURL}} --token=<span ng-show="showSessionToken">{{sessionToken}}</span><span ng-show="!showSessionToken">&lt;hidden&gt;</span>
43-
</div>
44-
<a href="#" ng-click="toggleShowSessionToken()">
45-
<span ng-show="!showSessionToken">Show token</span>
46-
<span ng-show="showSessionToken">Hide token</span>
47-
</a>
48-
<span ng-if="!IS_IOS">
49-
<span class="action-divider">|</span>
50-
<copy-to-clipboard display-as-link="true" clipboard-text="'oc login ' + loginBaseURL + ' --token=' + sessionToken" custom-link-text="'Copy command to clipboard'"></copy-to-clipboard>
51-
</span>
52-
</div>
40+
<copy-to-clipboard display-wide="true" clipboard-text="'oc login ' + loginBaseURL + ' --token=' + sessionToken" input-text="'oc login ' + loginBaseURL + ' --token=<hidden>'"></copy-to-clipboard>
5341
<pre class="code prettyprint ng-binding" ng-if="!sessionToken">
5442
oc login {{loginBaseURL}}
5543
</pre>
5644
</p>
5745

58-
<div class="alert alert-warning" ng-if="sessionToken">
46+
<div class="alert alert-warning">
5947
<span class="pficon pficon-warning-triangle-o" aria-hidden="true"></span>
6048
<strong>A token is a form of a password.</strong>
6149
Do not share your API token.
6250
</div>
6351

6452
<p>After you login to your account you will get a list of projects that you can switch between:
65-
<pre class="code prettyprint">oc project <i>project-name</i></pre>
53+
<copy-to-clipboard display-wide="true" clipboard-text="'oc project <project-name>'"></copy-to-clipboard>
6654
</p>
6755

6856
<p>If you do not have any existing projects, you can create one:
69-
<pre class="code prettyprint">oc new-project <i>project-name</i></pre>
57+
<copy-to-clipboard display-wide="true" clipboard-text="'oc new-project <project-name>'"></copy-to-clipboard>
7058
</p>
7159

7260
<p>To show a high level overview of the current project:
73-
<pre class="code prettyprint">oc status</pre>
61+
<copy-to-clipboard display-wide="true" clipboard-text="'oc status'"></copy-to-clipboard>
7462
</p>
7563

7664
<p>For other information about the command line tools, check the <a target="_blank" href="{{'cli' | helpLink}}">CLI Reference</a> and <a target="_blank" href="{{'basic_cli_operations' | helpLink}}">Basic CLI Operations</a>.</p>

‎app/views/directives/_copy-to-clipboard.html

+10-9
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
1-
<div ng-show="!displayAsLink" class="input-group copy-to-clipboard">
2-
<input id="{{id}}" type="text" class="form-control" value="{{clipboardText}}" ng-disabled="isDisabled" ng-readonly="!isDisabled" select-on-focus>
1+
<div class="input-group copy-to-clipboard" style="{{displayWide ? 'max-width:100%;' : ''}}">
2+
<input id="{{id}}" type="text" class="form-control" value="{{inputText ? inputText : clipboardText}}" ng-disabled="isDisabled" ng-readonly="!isDisabled" select-on-focus>
33
<span class="input-group-btn" ng-hide="hidden">
4-
<a data-clipboard-target="#{{id}}"
4+
<a ng-show="!inputText" data-clipboard-target="#{{id}}"
5+
ng-disabled="isDisabled"
6+
data-toggle="tooltip"
7+
title="Copy to clipboard"
8+
role="button"
9+
class="btn btn-default"><i class="fa fa-clipboard"/></a>
10+
<a ng-show="inputText" data-clipboard-text="{{clipboardText}}"
511
ng-disabled="isDisabled"
612
data-toggle="tooltip"
713
title="Copy to clipboard"
814
role="button"
915
class="btn btn-default"><i class="fa fa-clipboard"/></a>
1016
</span>
11-
</div><!-- /input-group -->
12-
<span ng-show="displayAsLink" ng-hide="hidden">
13-
<a data-clipboard-text="{{clipboardText}}"
14-
data-toggle="tooltip"
15-
title="Copy to clipboard">{{customLinkText || 'Copy to clipboard'}}</a>
16-
</span>
17+
</div><!-- /input-group -->

‎dist/scripts/scripts.js

+4-4
Original file line numberDiff line numberDiff line change
@@ -7969,7 +7969,7 @@ kubernetes:c.VERSION.kubernetes
79697969
}
79707970
};
79717971
} ]), angular.module("openshiftConsole").controller("CommandLineController", [ "$scope", "DataService", "AuthService", "Constants", function(a, b, c, d) {
7972-
c.withUser(), a.cliDownloadURL = d.CLI, a.cliDownloadURLPresent = a.cliDownloadURL && !_.isEmpty(a.cliDownloadURL), a.loginBaseURL = b.openshiftAPIBaseUrl(), a.sessionToken = c.UserStore().getToken(), a.showSessionToken = !1, a.copySessionTokenId = "showSessionTokenLink", a.toggleShowSessionToken = function() {
7972+
c.withUser(), a.cliDownloadURL = d.CLI, a.cliDownloadURLPresent = a.cliDownloadURL && !_.isEmpty(a.cliDownloadURL), a.loginBaseURL = b.openshiftAPIBaseUrl(), a.sessionToken = c.UserStore().getToken(), a.showSessionToken = !1, a.toggleShowSessionToken = function() {
79737973
a.showSessionToken = !a.showSessionToken;
79747974
};
79757975
} ]), angular.module("openshiftConsole").controller("CreatePersistentVolumeClaimController", [ "$filter", "$routeParams", "$scope", "$window", "ApplicationGenerator", "DataService", "Navigate", "ProjectsService", "keyValueEditorUtils", function(a, b, c, d, e, f, g, h, i) {
@@ -9757,8 +9757,8 @@ restrict:"E",
97579757
scope:{
97589758
clipboardText:"=",
97599759
isDisabled:"=?",
9760-
displayAsLink:"=?",
9761-
customLinkText:"=?"
9760+
displayWide:"=?",
9761+
inputText:"=?"
97629762
},
97639763
templateUrl:"views/directives/_copy-to-clipboard.html",
97649764
controller:[ "$scope", function(a) {
@@ -9767,7 +9767,7 @@ a.id = _.uniqueId("clipboardJs");
97679767
link:function(b, c) {
97689768
if (a) return void (b.hidden = !0);
97699769
var d = $("a", c), e = d.get(0);
9770-
b.displayAsLink && (e = d.get(1));
9770+
b.inputText && (e = d.get(1));
97719771
var f = new Clipboard(e);
97729772
f.on("success", function(a) {
97739773
$(a.trigger).attr("title", "Copied!").tooltip("fixTitle").tooltip("show").attr("title", "Copy to clipboard").tooltip("fixTitle"), a.clearSelection();

‎dist/scripts/templates.js

+10-24
Original file line numberDiff line numberDiff line change
@@ -3871,36 +3871,24 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
38713871
"</p>\n" +
38723872
"<p>\n" +
38733873
"After downloading and installing it, you can start by logging in using<span ng-if=\"sessionToken\"> this current session token</span>:\n" +
3874-
"<div ng-if=\"sessionToken\">\n" +
3875-
"<div class=\"code prettyprint ng-binding\">\n" +
3876-
"oc login {{loginBaseURL}} --token=<span ng-show=\"showSessionToken\">{{sessionToken}}</span><span ng-show=\"!showSessionToken\">&lt;hidden&gt;</span>\n" +
3877-
"</div>\n" +
3878-
"<a href=\"#\" ng-click=\"toggleShowSessionToken()\">\n" +
3879-
"<span ng-show=\"!showSessionToken\">Show token</span>\n" +
3880-
"<span ng-show=\"showSessionToken\">Hide token</span>\n" +
3881-
"</a>\n" +
3882-
"<span ng-if=\"!IS_IOS\">\n" +
3883-
"<span class=\"action-divider\">|</span>\n" +
3884-
"<copy-to-clipboard display-as-link=\"true\" clipboard-text=\"'oc login ' + loginBaseURL + ' --token=' + sessionToken\" custom-link-text=\"'Copy command to clipboard'\"></copy-to-clipboard>\n" +
3885-
"</span>\n" +
3886-
"</div>\n" +
3874+
"<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'oc login ' + loginBaseURL + ' --token=' + sessionToken\" input-text=\"'oc login ' + loginBaseURL + ' --token=<hidden>'\"></copy-to-clipboard>\n" +
38873875
"<pre class=\"code prettyprint ng-binding\" ng-if=\"!sessionToken\">\n" +
38883876
" oc login {{loginBaseURL}}\n" +
38893877
" </pre>\n" +
38903878
"</p>\n" +
3891-
"<div class=\"alert alert-warning\" ng-if=\"sessionToken\">\n" +
3879+
"<div class=\"alert alert-warning\">\n" +
38923880
"<span class=\"pficon pficon-warning-triangle-o\" aria-hidden=\"true\"></span>\n" +
38933881
"<strong>A token is a form of a password.</strong>\n" +
38943882
"Do not share your API token.\n" +
38953883
"</div>\n" +
38963884
"<p>After you login to your account you will get a list of projects that you can switch between:\n" +
3897-
"<pre class=\"code prettyprint\">oc project <i>project-name</i></pre>\n" +
3885+
"<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'oc project <project-name>'\"></copy-to-clipboard>\n" +
38983886
"</p>\n" +
38993887
"<p>If you do not have any existing projects, you can create one:\n" +
3900-
"<pre class=\"code prettyprint\">oc new-project <i>project-name</i></pre>\n" +
3888+
"<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'oc new-project <project-name>'\"></copy-to-clipboard>\n" +
39013889
"</p>\n" +
39023890
"<p>To show a high level overview of the current project:\n" +
3903-
"<pre class=\"code prettyprint\">oc status</pre>\n" +
3891+
"<copy-to-clipboard display-wide=\"true\" clipboard-text=\"'oc status'\"></copy-to-clipboard>\n" +
39043892
"</p>\n" +
39053893
"<p>For other information about the command line tools, check the <a target=\"_blank\" href=\"{{'cli' | helpLink}}\">CLI Reference</a> and <a target=\"_blank\" href=\"{{'basic_cli_operations' | helpLink}}\">Basic CLI Operations</a>.</p>\n" +
39063894
"</div>\n" +
@@ -4849,15 +4837,13 @@ angular.module('openshiftConsoleTemplates', []).run(['$templateCache', function(
48494837

48504838

48514839
$templateCache.put('views/directives/_copy-to-clipboard.html',
4852-
"<div ng-show=\"!displayAsLink\" class=\"input-group copy-to-clipboard\">\n" +
4853-
"<input id=\"{{id}}\" type=\"text\" class=\"form-control\" value=\"{{clipboardText}}\" ng-disabled=\"isDisabled\" ng-readonly=\"!isDisabled\" select-on-focus>\n" +
4840+
"<div class=\"input-group copy-to-clipboard\" style=\"{{displayWide ? 'max-width:100%;' : ''}}\">\n" +
4841+
"<input id=\"{{id}}\" type=\"text\" class=\"form-control\" value=\"{{inputText ? inputText : clipboardText}}\" ng-disabled=\"isDisabled\" ng-readonly=\"!isDisabled\" select-on-focus>\n" +
48544842
"<span class=\"input-group-btn\" ng-hide=\"hidden\">\n" +
4855-
"<a data-clipboard-target=\"#{{id}}\" ng-disabled=\"isDisabled\" data-toggle=\"tooltip\" title=\"Copy to clipboard\" role=\"button\" class=\"btn btn-default\"><i class=\"fa fa-clipboard\"/></a>\n" +
4843+
"<a ng-show=\"!inputText\" data-clipboard-target=\"#{{id}}\" ng-disabled=\"isDisabled\" data-toggle=\"tooltip\" title=\"Copy to clipboard\" role=\"button\" class=\"btn btn-default\"><i class=\"fa fa-clipboard\"/></a>\n" +
4844+
"<a ng-show=\"inputText\" data-clipboard-text=\"{{clipboardText}}\" ng-disabled=\"isDisabled\" data-toggle=\"tooltip\" title=\"Copy to clipboard\" role=\"button\" class=\"btn btn-default\"><i class=\"fa fa-clipboard\"/></a>\n" +
48564845
"</span>\n" +
4857-
"</div>\n" +
4858-
"<span ng-show=\"displayAsLink\" ng-hide=\"hidden\">\n" +
4859-
"<a data-clipboard-text=\"{{clipboardText}}\" data-toggle=\"tooltip\" title=\"Copy to clipboard\">{{customLinkText || 'Copy to clipboard'}}</a>\n" +
4860-
"</span>"
4846+
"</div>"
48614847
);
48624848

48634849

0 commit comments

Comments
 (0)