Merge "Copy current commit to clipboard"

polygerrit-ui/app/elements/change/gr-commit-info/gr-commit-info.html

@@ -16,12 +16,14 @@ limitations under the License.
 
 <link rel="import" href="../../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../../styles/shared-styles.html">
+<link rel="import" href="../../shared/gr-copy-clipboard/gr-copy-clipboard.html">
 
 <dom-module id="gr-commit-info">
   <template>
     <style include="shared-styles">
       :host {
-        display: inline-block;
+        align-items: center;
+        display: flex;
       }
     </style>
     <template is="dom-if" if="[[_showWebLink]]">
@@ -31,6 +33,10 @@ limitations under the License.
     <template is="dom-if" if="[[!_showWebLink]]">
       [[_computeShortHash(commitInfo)]]
     </template>
+    <gr-copy-clipboard
+        hide-input
+        text="[[commitInfo.commit]]">
+    </gr-copy-clipboard>
   </template>
   <script src="gr-commit-info.js"></script>
 </dom-module>

polygerrit-ui/app/elements/change/gr-commit-info/gr-commit-info.js

@@ -19,6 +19,7 @@
 
     properties: {
       change: Object,
+      /** @type {?} */
       commitInfo: Object,
       serverConfig: Object,
       _showWebLink: {

polygerrit-ui/app/elements/shared/gr-copy-clipboard/gr-copy-clipboard.html

@@ -16,9 +16,10 @@ limitations under the License.
 
 <link rel="import" href="../../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../../bower_components/iron-input/iron-input.html">
-<link rel="import" href="../../shared/gr-button/gr-button.html">
-<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 <link rel="import" href="../../../styles/shared-styles.html">
+<link rel="import" href="../../shared/gr-button/gr-button.html">
+<link rel="import" href="../../shared/gr-icons/gr-icons.html">
+<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 
 <dom-module id="gr-copy-clipboard">
   <template>
@@ -27,8 +28,6 @@ limitations under the License.
         align-items: center;
         display: flex;
         flex-wrap: wrap;
-        margin-bottom: .5em;
-        width: 60em;
       }
       .text label {
         flex: 0 0 100%;
@@ -44,6 +43,9 @@ limitations under the License.
         font-family: var(--monospace-font-family);
         font-size: inherit;
       }
+      #button {
+        padding-left: .5em;
+      }
     </style>
     <div class="text">
         <label>[[title]]</label>
@@ -57,7 +59,7 @@ limitations under the License.
             link
             class="copyToClipboard"
             on-tap="_copyToClipboard">
-          copy
+          <iron-icon id="icon" icon="gr-icons:content-copy"></iron-icon>
         </gr-button>
       </div>
     <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>

polygerrit-ui/app/elements/shared/gr-copy-clipboard/gr-copy-clipboard.js

@@ -41,12 +41,20 @@
       Polymer.dom(e).rootTarget.select();
     },
 
-    _copyToClipboard(e) {
+    _copyToClipboard() {
+      if (this.hideInput) {
+        this.$.input.style.display = 'block';
+      }
+      this.$.input.focus();
       this.$.input.select();
       document.execCommand('copy');
-      window.getSelection().removeAllRanges();
-      e.target.textContent = 'done';
-      this.async(() => { e.target.textContent = 'copy'; }, COPY_TIMEOUT_MS);
+      if (this.hideInput) {
+        this.$.input.style.display = 'none';
+      }
+      this.$.icon.icon = 'gr-icons:check';
+      this.async(
+          () => this.$.icon.icon = 'gr-icons:content-copy',
+          COPY_TIMEOUT_MS);
     },
   });
 })();

polygerrit-ui/app/elements/shared/gr-download-commands/gr-download-commands.html

@@ -52,10 +52,16 @@ limitations under the License.
         justify-content: space-between;
       }
       .commands {
+        display: flex;
+        flex-direction: column;
         border-bottom: 1px solid #ddd;
         border-top: 1px solid #ddd;
         padding: .5em;
       }
+      gr-copy-clipboard {
+        width: 60em;
+        margin-bottom: .5em;
+      }
     </style>
     <div class="schemes">
       <ul hidden$="[[!schemes.length]]" hidden>

polygerrit-ui/app/elements/shared/gr-icons/gr-icons.html

@@ -27,6 +27,10 @@ limitations under the License.
       <g id="side-by-side"><path d="M17.1578947,10.8888889 L2.84210526,10.8888889 C2.37894737,10.8888889 2,11.2888889 2,11.7777778 L2,17.1111111 C2,17.6 2.37894737,18 2.84210526,18 L17.1578947,18 C17.6210526,18 18,17.6 18,17.1111111 L18,11.7777778 C18,11.2888889 17.6210526,10.8888889 17.1578947,10.8888889 Z M17.1578947,2 L2.84210526,2 C2.37894737,2 2,2.4 2,2.88888889 L2,8.22222222 C2,8.71111111 2.37894737,9.11111111 2.84210526,9.11111111 L17.1578947,9.11111111 C17.6210526,9.11111111 18,8.71111111 18,8.22222222 L18,2.88888889 C18,2.4 17.6210526,2 17.1578947,2 Z M16.1973628,2 L2.78874238,2 C2.35493407,2 2,2.4 2,2.88888889 L2,8.22222222 C2,8.71111111 2.35493407,9.11111111 2.78874238,9.11111111 L16.1973628,9.11111111 C16.6311711,9.11111111 16.9861052,8.71111111 16.9861052,8.22222222 L16.9861052,2.88888889 C16.9861052,2.4 16.6311711,2 16.1973628,2 Z" id="Shape" transform="scale(1.2) translate(10.000000, 10.000000) rotate(-90.000000) translate(-10.000000, -10.000000)"/></g>
       <!-- This is a custom PolyGerrit SVG -->
       <g id="unified"><path d="M4,2 L17,2 C18.1045695,2 19,2.8954305 19,4 L19,16 C19,17.1045695 18.1045695,18 17,18 L4,18 C2.8954305,18 2,17.1045695 2,16 L2,4 L2,4 C2,2.8954305 2.8954305,2 4,2 L4,2 Z M4,7 L4,9 L17,9 L17,7 L4,7 Z M4,11 L4,13 L17,13 L17,11 L4,11 Z" id="Combined-Shape" transform="scale(1.2)"/></g>
+      <!-- This is a custom PolyGerrit SVG -->
+      <g id="content-copy"><path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></g>
+      <!-- This is a custom PolyGerrit SVG -->
+      <g id="check"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></g>
     </defs>
   </svg>
 </iron-iconset-svg>