@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
Allow workboards to be panned horizontally by dragging the background
Summary:
Ref T5240. For boards with a lot of columns and users without "shift + mousewheel" or a touchpad, allow click-drag on the board background to pan the board horizontally.
The `ew-resize` cursor cue might be a little too intense. If it's annoying, we could drop it and just leave this as a secret feature to discover.
Test Plan: Panned the board horizontally.
Reviewers: chad
Reviewed By: chad
Maniphest Tasks: T5240
Differential Revision: https://secure.phabricator.com/D15211
+65
-15
+14
-14
resources/celerity/map.php
+14
-14
resources/celerity/map.php
···
154
154
'rsrc/css/phui/phui-tag-view.css' => '9d5d4400',
155
155
'rsrc/css/phui/phui-timeline-view.css' => '2efceff8',
156
156
'rsrc/css/phui/phui-two-column-view.css' => 'c75bfc5b',
157
-
'rsrc/css/phui/workboards/phui-workboard.css' => 'f526057c',
157
+
'rsrc/css/phui/workboards/phui-workboard.css' => '2b5367d2',
158
158
'rsrc/css/phui/workboards/phui-workcard.css' => 'a869098a',
159
159
'rsrc/css/phui/workboards/phui-workpanel.css' => 'e1bd8d04',
160
160
'rsrc/css/sprite-login.css' => '60e8560e',
···
414
414
'rsrc/js/application/phortune/phortune-credit-card-form.js' => '2290aeef',
415
415
'rsrc/js/application/policy/behavior-policy-control.js' => 'd0c516d5',
416
416
'rsrc/js/application/policy/behavior-policy-rule-editor.js' => '5e9f347c',
417
-
'rsrc/js/application/projects/behavior-project-boards.js' => '5191522f',
417
+
'rsrc/js/application/projects/behavior-project-boards.js' => 'a1807fd7',
418
418
'rsrc/js/application/projects/behavior-project-create.js' => '065227cc',
419
419
'rsrc/js/application/projects/behavior-reorder-columns.js' => 'e1d25dfb',
420
420
'rsrc/js/application/releeph/releeph-preview-branch.js' => 'b2b4fbaf',
···
654
654
'javelin-behavior-phui-profile-menu' => '12884df9',
655
655
'javelin-behavior-policy-control' => 'd0c516d5',
656
656
'javelin-behavior-policy-rule-editor' => '5e9f347c',
657
-
'javelin-behavior-project-boards' => '5191522f',
657
+
'javelin-behavior-project-boards' => 'a1807fd7',
658
658
'javelin-behavior-project-create' => '065227cc',
659
659
'javelin-behavior-quicksand-blacklist' => '7927a7d3',
660
660
'javelin-behavior-recurring-edit' => '5f1c4d5f',
···
831
831
'phui-theme-css' => 'ab7b848c',
832
832
'phui-timeline-view-css' => '2efceff8',
833
833
'phui-two-column-view-css' => 'c75bfc5b',
834
-
'phui-workboard-view-css' => 'f526057c',
834
+
'phui-workboard-view-css' => '2b5367d2',
835
835
'phui-workcard-view-css' => 'a869098a',
836
836
'phui-workpanel-view-css' => 'e1bd8d04',
837
837
'phuix-action-list-view' => 'b5c256b8',
···
1190
1190
'javelin-typeahead-source',
1191
1191
'javelin-util',
1192
1192
),
1193
-
'5191522f' => array(
1194
-
'javelin-behavior',
1195
-
'javelin-dom',
1196
-
'javelin-util',
1197
-
'javelin-vector',
1198
-
'javelin-stratcom',
1199
-
'javelin-workflow',
1200
-
'phabricator-draggable-list',
1201
-
'phabricator-drag-and-drop-file-upload',
1202
-
),
1203
1193
'519705ea' => array(
1204
1194
'javelin-install',
1205
1195
'javelin-dom',
···
1615
1605
'javelin-install',
1616
1606
'javelin-dom',
1617
1607
'javelin-reactor-dom',
1608
+
),
1609
+
'a1807fd7' => array(
1610
+
'javelin-behavior',
1611
+
'javelin-dom',
1612
+
'javelin-util',
1613
+
'javelin-vector',
1614
+
'javelin-stratcom',
1615
+
'javelin-workflow',
1616
+
'phabricator-draggable-list',
1617
+
'phabricator-drag-and-drop-file-upload',
1618
1618
),
1619
1619
'a2828756' => array(
1620
1620
'javelin-dom',
+1
-1
src/view/phui/PHUIWorkboardView.php
+1
-1
src/view/phui/PHUIWorkboardView.php
+9
webroot/rsrc/css/phui/workboards/phui-workboard.css
+9
webroot/rsrc/css/phui/workboards/phui-workboard.css
+41
webroot/rsrc/js/application/projects/behavior-project-boards.js
+41
webroot/rsrc/js/application/projects/behavior-project-boards.js
···
382
382
drop.start();
383
383
}
384
384
385
+
// When the user drags the workboard background, pan the workboard
386
+
// horizontally. This allows you to scroll across cards with only the
387
+
// mouse, without shift + scrollwheel or using the scrollbar.
388
+
389
+
var pan_origin = null;
390
+
var pan_node = null;
391
+
var pan_x = null;
392
+
393
+
JX.Stratcom.listen('mousedown', 'workboard-shadow', function(e) {
394
+
if (!JX.Device.isDesktop()) {
395
+
return;
396
+
}
397
+
398
+
if (e.getNode('workpanel')) {
399
+
return;
400
+
}
401
+
402
+
if (JX.Stratcom.pass()) {
403
+
return;
404
+
}
405
+
406
+
e.kill();
407
+
408
+
pan_origin = JX.$V(e);
409
+
pan_node = e.getNode('workboard-shadow');
410
+
pan_x = pan_node.scrollLeft;
411
+
});
412
+
413
+
JX.Stratcom.listen('mousemove', null, function(e) {
414
+
if (!pan_origin) {
415
+
return;
416
+
}
417
+
418
+
var cursor = JX.$V(e);
419
+
pan_node.scrollLeft = pan_x + (pan_origin.x - cursor.x);
420
+
});
421
+
422
+
JX.Stratcom.listen('mouseup', null, function() {
423
+
pan_origin = null;
424
+
});
425
+
385
426
return true;
386
427
}
387
428