Improve mobile/device behaviors for inline comments

Summary: Fixes T1026. Ref T12616. Allows drag-to-select on devices to add inlines on a range of lines, using dark magic that I copy/pasted from StackOverflow.

Test Plan: Left a comment on a range of lines on iPhone simulator.

Reviewers: chad

Reviewed By: chad

Maniphest Tasks: T12616, T1026

Differential Revision: https://secure.phabricator.com/D17928

resources/celerity/map.php

@@ -13,7 +13,7 @@ return array(
     'core.pkg.js' => '0f87a6eb',
     'darkconsole.pkg.js' => '1f9a31bc',
     'differential.pkg.css' => 'ea471cb0',
-    'differential.pkg.js' => '85c19957',
+    'differential.pkg.js' => '58457c19',
     'diffusion.pkg.css' => 'b93d9b8c',
     'diffusion.pkg.js' => '84c8f8fd',
     'favicon.ico' => '30672e08',
@@ -391,7 +391,7 @@ return array(
     'rsrc/js/application/dashboard/behavior-dashboard-query-panel-select.js' => '453c5375',
     'rsrc/js/application/dashboard/behavior-dashboard-tab-panel.js' => 'd4eecc63',
     'rsrc/js/application/diff/DiffChangeset.js' => '68758d99',
-    'rsrc/js/application/diff/DiffChangesetList.js' => '842e2676',
+    'rsrc/js/application/diff/DiffChangesetList.js' => '204e4bfc',
     'rsrc/js/application/diff/DiffInline.js' => '1afe9760',
     'rsrc/js/application/diff/behavior-preview-link.js' => '051c7832',
     'rsrc/js/application/differential/behavior-comment-preview.js' => 'b064af76',
@@ -778,7 +778,7 @@ return array(
     'phabricator-darkmessage' => 'c48cccdd',
     'phabricator-dashboard-css' => 'fe5b1869',
     'phabricator-diff-changeset' => '68758d99',
-    'phabricator-diff-changeset-list' => '842e2676',
+    'phabricator-diff-changeset-list' => '204e4bfc',
     'phabricator-diff-inline' => '1afe9760',
     'phabricator-drag-and-drop-file-upload' => '58dea2fa',
     'phabricator-draggable-list' => 'bea6e7f4',
@@ -1066,6 +1066,9 @@ return array(
       'javelin-install',
       'javelin-dom',
     ),
+    '204e4bfc' => array(
+      'javelin-install',
+    ),
     '21df4ff5' => array(
       'javelin-install',
       'javelin-workboard-card',
@@ -1532,9 +1535,6 @@ return array(
       'javelin-install',
       'javelin-dom',
     ),
-    '842e2676' => array(
-      'javelin-install',
-    ),
     '8499b6ab' => array(
       'javelin-behavior',
       'javelin-dom',

webroot/rsrc/js/application/diff/DiffChangesetList.js

@@ -65,7 +65,7 @@ JX.install('DiffChangesetList', {
 
     var onrangedown = JX.bind(this, this._ifawake, this._onrangedown);
     JX.Stratcom.listen(
-      'mousedown',
+      ['touchstart', 'mousedown'],
       ['differential-changeset', 'tag:th'],
       onrangedown);
 
@@ -75,8 +75,17 @@ JX.install('DiffChangesetList', {
       ['differential-changeset', 'tag:th'],
       onrangemove);
 
+    var onrangetouchmove = JX.bind(this, this._ifawake, this._onrangetouchmove);
+    JX.Stratcom.listen(
+      'touchmove',
+      null,
+      onrangetouchmove);
+
     var onrangeup = JX.bind(this, this._ifawake, this._onrangeup);
-    JX.Stratcom.listen('mouseup', null, onrangeup);
+    JX.Stratcom.listen(
+      ['touchend', 'mouseup'],
+      null,
+      onrangeup);
   },
 
   properties: {
@@ -1088,11 +1097,9 @@ JX.install('DiffChangesetList', {
     },
 
     _onrangedown: function(e) {
-      if (!e.isNormalMouseEvent()) {
+      // NOTE: We're allowing touch events through, including "touchstart". We
-        return;
+      // need to kill the "touchstart" event so the page doesn't scroll.
-      }
+      if (e.isRightButton()) {
-
-      if (e.getIsTouchEvent()) {
         return;
       }
 
@@ -1120,8 +1127,13 @@ JX.install('DiffChangesetList', {
         return;
       }
 
+      var is_out = (e.getType() == 'mouseout');
       var target = e.getTarget();
 
+      this._updateRange(target, is_out);
+    },
+
+    _updateRange: function(target, is_out) {
       // Don't update the range if this "<th />" doesn't correspond to a line
       // number. For instance, this may be a dead line number, like the empty
       // line numbers on the left hand side of a newly added file.
@@ -1154,7 +1166,6 @@ JX.install('DiffChangesetList', {
         }
       }
 
-      var is_out = (e.getType() == 'mouseout');
       if (is_out) {
         if (this._rangeActive) {
           // If we're dragging a range, just leave the state as it is. This
@@ -1177,6 +1188,31 @@ JX.install('DiffChangesetList', {
       this._setHoverRange(this._rangeOrigin, this._rangeTarget);
     },
 
+    _onrangetouchmove: function(e) {
+      if (!this._rangeActive) {
+        return;
+      }
+
+      // NOTE: The target of a "touchmove" event is bogus. Use dark magic to
+      // identify the actual target. Some day, this might move into the core
+      // libraries. If this doesn't work, just bail.
+
+      var target;
+      try {
+        var raw_event = e.getRawEvent();
+        var touch = raw_event.touches[0];
+        target = document.elementFromPoint(touch.clientX, touch.clientY);
+      } catch (ex) {
+        return;
+      }
+
+      if (!JX.DOM.isType(target, 'th')) {
+        return;
+      }
+
+      this._updateRange(target, false);
+    },
+
     _onrangeup: function(e) {
       if (!this._rangeActive) {
         return;