@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
When dragging stuff around, compensate for changes in scroll position
Summary:
Ref T5240. This fixes dragging stuff and using the mousewheel or keyboard to scroll the window during the drag.
(It does not fix "dragging near the edge of the container should scroll it" yet.)
Test Plan: Dragged stuff around on task list and workboards in Safari, Firefox and Chrome. Used mousewheel and shift + mousewheel to scroll the document and containers during drag. Object remained under the cursor.
Reviewers: btrahan
Reviewed By: btrahan
Subscribers: epriestley
Maniphest Tasks: T5240
Differential Revision: https://secure.phabricator.com/D10186
+64
-27
+26
-26
resources/celerity/map.php
+26
-26
resources/celerity/map.php
···
8
8
return array(
9
9
'names' => array(
10
10
'core.pkg.css' => 'c7059fd9',
11
-
'core.pkg.js' => 'eb8d4f82',
11
+
'core.pkg.js' => '14887b3d',
12
12
'darkconsole.pkg.js' => 'df001cab',
13
13
'differential.pkg.css' => '4a93db37',
14
14
'differential.pkg.js' => 'eb182ccd',
···
202
202
'rsrc/externals/javelin/lib/Routable.js' => 'b3e7d692',
203
203
'rsrc/externals/javelin/lib/Router.js' => '29274e2b',
204
204
'rsrc/externals/javelin/lib/URI.js' => '6eff08aa',
205
-
'rsrc/externals/javelin/lib/Vector.js' => '23cbb8ac',
205
+
'rsrc/externals/javelin/lib/Vector.js' => 'cc1bd0b0',
206
206
'rsrc/externals/javelin/lib/Workflow.js' => 'd149e002',
207
207
'rsrc/externals/javelin/lib/__tests__/Cookie.js' => '5ed109e8',
208
208
'rsrc/externals/javelin/lib/__tests__/DOM.js' => 'c984504b',
···
417
417
'rsrc/js/application/projects/behavior-boards-dropdown.js' => '0ec56e1d',
418
418
'rsrc/js/application/projects/behavior-project-boards.js' => 'd4bf1f3c',
419
419
'rsrc/js/application/projects/behavior-project-create.js' => '065227cc',
420
-
'rsrc/js/application/projects/behavior-reorder-columns.js' => '09eee344',
420
+
'rsrc/js/application/projects/behavior-reorder-columns.js' => 'e1d25dfb',
421
421
'rsrc/js/application/releeph/releeph-preview-branch.js' => 'b2b4fbaf',
422
422
'rsrc/js/application/releeph/releeph-request-state-change.js' => 'ab836011',
423
423
'rsrc/js/application/releeph/releeph-request-typeahead.js' => 'de2e896f',
···
441
441
'rsrc/js/application/uiexample/notification-example.js' => '7a9677fc',
442
442
'rsrc/js/core/Busy.js' => '6453c869',
443
443
'rsrc/js/core/DragAndDropFileUpload.js' => 'f61aa8ec',
444
-
'rsrc/js/core/DraggableList.js' => '2cad29d1',
444
+
'rsrc/js/core/DraggableList.js' => 'bfccc644',
445
445
'rsrc/js/core/FileUpload.js' => 'a4ae61bf',
446
446
'rsrc/js/core/Hovercard.js' => '7e8468ae',
447
447
'rsrc/js/core/KeyboardShortcut.js' => '1ae869f2',
···
647
647
'javelin-behavior-releeph-request-typeahead' => 'de2e896f',
648
648
'javelin-behavior-remarkup-preview' => 'f7379f45',
649
649
'javelin-behavior-reorder-applications' => '76b9fc3e',
650
-
'javelin-behavior-reorder-columns' => '09eee344',
650
+
'javelin-behavior-reorder-columns' => 'e1d25dfb',
651
651
'javelin-behavior-repository-crossreference' => 'f9539603',
652
652
'javelin-behavior-search-reorder-queries' => 'e9581f08',
653
653
'javelin-behavior-select-on-click' => '4e3e79a6',
···
688
688
'javelin-typeahead-static-source' => '316b8fa1',
689
689
'javelin-uri' => '6eff08aa',
690
690
'javelin-util' => 'e7995242',
691
-
'javelin-vector' => '23cbb8ac',
691
+
'javelin-vector' => 'cc1bd0b0',
692
692
'javelin-view' => '0f764c35',
693
693
'javelin-view-html' => 'e5b406f9',
694
694
'javelin-view-interpreter' => '0c33c1a0',
···
716
716
'phabricator-crumbs-view-css' => '7fbf25b8',
717
717
'phabricator-dashboard-css' => 'a2bfdcbf',
718
718
'phabricator-drag-and-drop-file-upload' => 'f61aa8ec',
719
-
'phabricator-draggable-list' => '2cad29d1',
719
+
'phabricator-draggable-list' => 'bfccc644',
720
720
'phabricator-fatal-config-template-css' => '25d446d6',
721
721
'phabricator-feed-css' => '4e544db4',
722
722
'phabricator-file-upload' => 'a4ae61bf',
···
876
876
'javelin-mask',
877
877
'phabricator-drag-and-drop-file-upload',
878
878
),
879
-
'09eee344' => array(
880
-
'javelin-behavior',
881
-
'javelin-stratcom',
882
-
'javelin-workflow',
883
-
'javelin-dom',
884
-
'phabricator-draggable-list',
885
-
),
886
879
'0a3f3021' => array(
887
880
'javelin-behavior',
888
881
'javelin-stratcom',
···
995
988
'javelin-dom',
996
989
'javelin-vector',
997
990
),
998
-
'23cbb8ac' => array(
999
-
'javelin-install',
1000
-
'javelin-event',
1001
-
),
1002
991
'2926fff2' => array(
1003
992
'javelin-behavior',
1004
993
'javelin-dom',
···
1019
1008
'javelin-stratcom',
1020
1009
'javelin-dom',
1021
1010
),
1022
-
'2cad29d1' => array(
1023
-
'javelin-install',
1024
-
'javelin-dom',
1025
-
'javelin-stratcom',
1026
-
'javelin-util',
1027
-
'javelin-vector',
1028
-
'javelin-magical-init',
1029
-
),
1030
1011
'2fa810fc' => array(
1031
1012
'javelin-behavior',
1032
1013
'javelin-dom',
···
1645
1626
'javelin-util',
1646
1627
'phabricator-shaped-request',
1647
1628
),
1629
+
'bfccc644' => array(
1630
+
'javelin-install',
1631
+
'javelin-dom',
1632
+
'javelin-stratcom',
1633
+
'javelin-util',
1634
+
'javelin-vector',
1635
+
'javelin-magical-init',
1636
+
),
1648
1637
'c4569c05' => array(
1649
1638
'javelin-magical-init',
1650
1639
'javelin-install',
···
1663
1652
'javelin-dom',
1664
1653
'javelin-stratcom',
1665
1654
'phabricator-phtize',
1655
+
),
1656
+
'cc1bd0b0' => array(
1657
+
'javelin-install',
1658
+
'javelin-event',
1666
1659
),
1667
1660
'd149e002' => array(
1668
1661
'javelin-stratcom',
···
1760
1753
'javelin-behavior',
1761
1754
'javelin-dom',
1762
1755
'phabricator-prefab',
1756
+
),
1757
+
'e1d25dfb' => array(
1758
+
'javelin-behavior',
1759
+
'javelin-stratcom',
1760
+
'javelin-workflow',
1761
+
'javelin-dom',
1762
+
'phabricator-draggable-list',
1763
1763
),
1764
1764
'e1ff79b1' => array(
1765
1765
'javelin-behavior',
+29
webroot/rsrc/externals/javelin/lib/Vector.js
+29
webroot/rsrc/externals/javelin/lib/Vector.js
···
297
297
);
298
298
},
299
299
300
+
301
+
/**
302
+
* Get the aggregate scroll offsets for a node and all of its parents.
303
+
*
304
+
* Note that this excludes scroll at the document level, because it does
305
+
* not normally impact operations in document coordinates, which everything
306
+
* on this class returns. Use @{method:getScroll} to get the document scroll
307
+
* position.
308
+
*
309
+
* @param Node Node to determine offsets for.
310
+
* @return JX.Vector New vector with aggregate scroll offsets.
311
+
*/
312
+
getAggregateScrollForNode: function(node) {
313
+
var x = 0;
314
+
var y = 0;
315
+
316
+
do {
317
+
if (node == document.body || node == document.documentElement) {
318
+
break;
319
+
}
320
+
321
+
x += node.scrollLeft || 0;
322
+
y += node.scrollTop || 0;
323
+
node = node.parentNode;
324
+
} while (node);
325
+
326
+
return new JX.$V(x, y);
327
+
},
328
+
300
329
/**
301
330
* Determine the size of the viewport (basically, the browser window) by
302
331
* building a new vector where the 'x' component corresponds to the width
+9
-1
webroot/rsrc/js/core/DraggableList.js
+9
-1
webroot/rsrc/js/core/DraggableList.js
···
44
44
_dragging : null,
45
45
_locked : 0,
46
46
_origin : null,
47
+
_originScroll : null,
47
48
_target : null,
48
49
_targets : null,
49
50
_dimensions : null,
···
166
167
167
168
this._dragging = e.getNode(this._sigil);
168
169
this._origin = JX.$V(e);
170
+
this._originScroll = JX.Vector.getAggregateScrollForNode(this._dragging);
169
171
this._dimensions = JX.$V(this._dragging);
170
172
171
173
for (var ii = 0; ii < this._group.length; ii++) {
···
359
361
// adjust the cursor position for the change in node document position.
360
362
// Do this before choosing a new target to avoid a flash of nonsense.
361
363
362
-
var origin = this._origin;
364
+
var scroll = JX.Vector.getAggregateScrollForNode(this._dragging);
365
+
366
+
var origin = {
367
+
x: this._origin.x + (this._originScroll.x - scroll.x),
368
+
y: this._origin.y + (this._originScroll.y - scroll.y)
369
+
};
363
370
364
371
var adjust_h = 0;
365
372
var adjust_y = 0;
···
463
470
}
464
471
return this;
465
472
}
473
+
466
474
}
467
475
468
476
});