copy on iOS Chrome

app/scripts/util/copy-paste.js

@@ -1,5 +1,7 @@
 'use strict';
 
+var FeatureDetector = require('./feature-detector');
+
 var CopyPaste = {
     tryCopy: function() {
         try {
@@ -12,18 +14,21 @@ var CopyPaste = {
     createHiddenInput: function(text, pos) {
         var hiddenInput = $('<input/>')
             .val(text)
-            .attr({ type: 'text', readonly: true, 'class': pos ? '' : 'hide-by-pos' })
+            .attr({ type: 'text', 'class': pos ? '' : 'hide-by-pos' })
             .appendTo(document.body);
+        if (FeatureDetector.canCopyReadonlyInput()) {
+            hiddenInput.attr('readonly', true);
+        }
         if (pos) {
-            hiddenInput.css({ position: 'absolute', zIndex: 100, padding: 0,
+            hiddenInput.css({ position: 'absolute', zIndex: 100, padding: '0 .6em',
                 border: 'none', background: 'transparent', color: 'transparent',
                 left: pos.left, top: pos.top, width: pos.width, height: pos.height });
         }
-        hiddenInput.focus();
         hiddenInput[0].selectionStart = 0;
         hiddenInput[0].selectionEnd = text.length;
+        hiddenInput.focus();
         hiddenInput.on({
-            'copy': function() { setTimeout(function() { hiddenInput.blur(); }, 0); },
+            'copy cut paste': function() { setTimeout(function() { hiddenInput.blur(); }, 0); },
             blur: function() { hiddenInput.remove(); }
         });
     }

app/scripts/util/feature-detector.js

@@ -11,11 +11,10 @@ var FeatureDetector = {
         return this.isMac() ? '⌥' : formatting ? '<span class="thin">alt + </span>' : 'alt-';
     },
     shouldMoveHiddenInputToCopySource: function() {
-        var ua = navigator.userAgent;
-        var iOS = !!ua.match(/iPad/i) || !!ua.match(/iPhone/i);
-        var webkit = !!ua.match(/WebKit/i);
-        var iOSSafari = iOS && webkit && !ua.match(/CriOS/i); // shouldn't we do this for mobile chrome as well? check it.
-        return !!iOSSafari;
+        return /(iPad|iPhone)/i.test(navigator.userAgent);
+    },
+    canCopyReadonlyInput: function() {
+        return !(/CriOS/i.test(navigator.userAgent));
     }
 };
 

app/scripts/views/fields/field-view.js

@@ -39,12 +39,12 @@ var FieldView = Backbone.View.extend({
         var field = this.model.name;
         if (FeatureDetector.shouldMoveHiddenInputToCopySource()) {
             var box = this.valueEl[0].getBoundingClientRect();
-            var textValue = this.value && this.value.getText ? this.value.getText() : this.renderValue(this.value);
+            var textValue = this.value && this.value.getText ? this.value.getText() : this.getEditValue(this.value);
             if (!textValue) {
                 return;
             }
             CopyPaste.createHiddenInput(textValue, box);
-            CopyPaste.tryCopy(); // maybe Apple will ever support this?
+            //CopyPaste.tryCopy(); // maybe Apple will ever support this?
             return;
         }
         if (field) {

app/styles/areas/_details.scss

@@ -283,6 +283,8 @@
     text-align: center;
     overflow: hidden;
     transition: color $base-duration $base-timing;
+    display: none;
+    @include nomobile { display: block; }
     &:hover {
       @include th { color: medium-color(); }
     }
@@ -317,6 +319,8 @@
       right: $base-padding-h;
       white-space: nowrap;
       opacity: .15;
+      display: none;
+      @include nomobile { display: block; }
     }
     &-icon {
       display: none;

app/templates/settings/settings-help.html

@@ -23,6 +23,7 @@
             <i class="fa fa-chrome"></i>
             <i class="fa fa-firefox"></i>
             <i class="fa fa-opera"></i>
+            <i class="fa fa-compass"></i>
             <i class="fa fa-internet-explorer"></i>
             <a href="<%= webAppLink %>" target="_blank">Web app</a>
         </li>