Bug 1161797: Use document.execCommand("copy") instead of flash where it is available

3 files changed, 68 insertions, 27 deletions

diff --git a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
index 7cd41e386..9563a929c 100644
--- a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
@@ -244,6 +244,7 @@
       [% IF bug.assigned_to.id == user.id || user.in_group("editbugs") %]
         <button type="button" id="copy-summary" class="minor"
           title="Copy [% terms.bug %] number and summary to your clipboard">Copy Summary</button>
+        <div id="clip-container" style="display:none"><input type="text" id="clip"></div>
       [% END %]
       [% IF user.id %]
         <button type="button" class="minor" id="cc-btn" data-is-cced="[% is_cced ? 1 : 0 %]">
diff --git a/extensions/BugModal/web/bug_modal.css b/extensions/BugModal/web/bug_modal.css
index 4bcb05a1a..ff804e4db 100644
--- a/extensions/BugModal/web/bug_modal.css
+++ b/extensions/BugModal/web/bug_modal.css
@@ -887,3 +887,15 @@ div.ui-tooltip {
 .search-nav-disabled {
     color: #777;
 }
+
+/* clipboard shenanigans */
+
+#clip-container {
+    position: fixed;
+    top: 0px;
+    left: 0px;
+    width: 0px;
+    height: 0px;
+    z-index: 100;
+    opacity: 0;
+}
diff --git a/extensions/BugModal/web/bug_modal.js b/extensions/BugModal/web/bug_modal.js
index 8ff4b2921..b1eb17b81 100644
--- a/extensions/BugModal/web/bug_modal.js
+++ b/extensions/BugModal/web/bug_modal.js
@@ -162,37 +162,65 @@ $(function() {
         });
 
     // copy summary to clipboard
+
+    function clipboardSummary() {
+        return 'Bug ' + BUGZILLA.bug_id + ' - ' + $('#field-value-short_desc').text();
+    }
+
     if ($('#copy-summary').length) {
 
-        // we don't know if flash is enabled without waiting for load to timeout
-        // remember the flash enabled state between pages
-        var hasFlash = true;
-        if (localStorage.getItem('hasFlash') === null) {
-            $('#copy-summary').hide();
+        // probe for document.execCommand("copy") support
+        var hasExecCopy = false;
+        try {
+            // on page load nothing will be selected, so we don't smash the
+            // clipboard doing this
+            document.execCommand("copy");
+            hasExecCopy = true;
+        } catch(ex) {
+            // ignore
         }
-        else {
-            hasFlash = localStorage.getItem('hasFlash');
+
+        if (hasExecCopy) {
+            $('#copy-summary')
+                .click(function() {
+                    // execCommand("copy") only works on selected text
+                    $('#clip-container').show();
+                    $('#clip').val(clipboardSummary()).select();
+                    document.execCommand("copy");
+                    $('#clip-container').hide();
+                });
         }
-        if (hasFlash) {
-            ZeroClipboard.config({ flashLoadTimeout: 5000 });
-            var zero = new ZeroClipboard($('#copy-summary'));
-            zero.on({
-                'ready': function(event) {
-                    $('#copy-summary').show();
-                    localStorage.setItem('hasFlash', true);
-                },
-                'error': function(event) {
-                    console.log(event.message);
-                    zero.destroy();
-                    $('#global-zeroclipboard-html-bridge').remove();
-                    $('#copy-summary').hide();
-                    localStorage.removeItem('hasFlash');
-                },
-                'copy': function(event) {
-                    var clipboard = event.clipboardData;
-                    clipboard.setData('text/plain', 'Bug ' + BUGZILLA.bug_id + ' - ' + $('#field-value-short_desc').text());
-                }
-            });
+        else {
+            // we don't know if flash is enabled without waiting for load to timeout
+            // remember the flash enabled state between pages
+            var hasFlash = true;
+            if (localStorage.getItem('hasFlash') === null) {
+                $('#copy-summary').hide();
+            }
+            else {
+                hasFlash = localStorage.getItem('hasFlash');
+            }
+            if (hasFlash) {
+                ZeroClipboard.config({ flashLoadTimeout: 5000 });
+                var zero = new ZeroClipboard($('#copy-summary'));
+                zero.on({
+                    'ready': function(event) {
+                        $('#copy-summary').show();
+                        localStorage.setItem('hasFlash', true);
+                    },
+                    'error': function(event) {
+                        console.log(event.message);
+                        zero.destroy();
+                        $('#global-zeroclipboard-html-bridge').remove();
+                        $('#copy-summary').hide();
+                        localStorage.removeItem('hasFlash');
+                    },
+                    'copy': function(event) {
+                        var clipboard = event.clipboardData;
+                        clipboard.setData('text/plain', clipboardSummary());
+                    }
+                });
+            }
         }
     }