revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-09-19 16:58:48 +02:00
Code Issues Releases Wiki Activity

When a dropdown menu would render in a way that hides it offscreen, try a different alignment

Browse source 
Summary:
Depends on D20382. Ref T13272. When something near the edge of the screen has a dropdown menu, we currently may render the menu offscreen.

Instead, keep the menu onscreen.

(This is happening because I'm adding dropdown menus to tab query panels.)

Test Plan:
Before:

{F6363339}

After:

{F6363340}

Reviewers: amckinley

Reviewed By: amckinley

Maniphest Tasks: T13272

Differential Revision: https://secure.phabricator.com/D20383
This commit is contained in:
epriestley 2019-04-08 10:29:05 -07:00
parent 41afc7c7e6
commit e4524d4707
2 changed files with 39 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
resources/celerity/map.php
View file

@ -10,7 +10,7 @@ return array(
'conpherence.pkg.css' => '3c8a0668',
'conpherence.pkg.js' => '020aebcf',
'core.pkg.css' => '2d4810eb',
'core.pkg.js' => 'a568e834',
'core.pkg.js' => 'c783d8f6',
'differential.pkg.css' => '8d8360fb',
'differential.pkg.js' => '67e02996',
'diffusion.pkg.css' => '42c75c37',
@ -518,7 +518,7 @@ return array(
'rsrc/js/phuix/PHUIXActionView.js' => 'aaa08f3b',
'rsrc/js/phuix/PHUIXAutocomplete.js' => '2fbe234d',
'rsrc/js/phuix/PHUIXButtonView.js' => '55a24e84',
'rsrc/js/phuix/PHUIXDropdownMenu.js' => 'bdce4d78',
'rsrc/js/phuix/PHUIXDropdownMenu.js' => '7acfd98b',
'rsrc/js/phuix/PHUIXExample.js' => 'c2c500a7',
'rsrc/js/phuix/PHUIXFormControl.js' => '38c1f3fb',
'rsrc/js/phuix/PHUIXIconView.js' => 'a5257c4e',
@ -874,7 +874,7 @@ return array(
'phuix-action-view' => 'aaa08f3b',
'phuix-autocomplete' => '2fbe234d',
'phuix-button-view' => '55a24e84',
'phuix-dropdown-menu' => 'bdce4d78',
'phuix-dropdown-menu' => '7acfd98b',
'phuix-form-control-view' => '38c1f3fb',
'phuix-icon-view' => 'a5257c4e',
'policy-css' => 'ceb56a08',
@ -1563,6 +1563,13 @@ return array(
'javelin-install',
'javelin-dom',
),
'7acfd98b' => array(
'javelin-install',
'javelin-util',
'javelin-dom',
'javelin-vector',
'javelin-stratcom',
),
'7ad020a5' => array(
'javelin-behavior',
'javelin-dom',
@ -1922,13 +1929,6 @@ return array(
'javelin-uri',
'phabricator-notification',
),
'bdce4d78' => array(
'javelin-install',
'javelin-util',
'javelin-dom',
'javelin-vector',
'javelin-stratcom',
),
'bde53589' => array(
'phui-inline-comment-view-css',
),

30
webroot/rsrc/js/phuix/PHUIXDropdownMenu.js
View file

@ -198,7 +198,35 @@ JX.install('PHUIXDropdownMenu', {
var v = JX.$V(this._node);
var d = JX.Vector.getDim(this._node);
switch (this.getAlign()) {
var alignments = ['right', 'left'];
var disallow = {};
var margin = 8;
// If "right" alignment would leave us with the dropdown near or off the
// left side of the screen, disallow it.
var x_min = ((v.x + d.x) - m.x);
if (x_min < margin) {
disallow.right = true;
}
var align = this.getAlign();
// If the position disallows the configured alignment, try the next
// best alignment instead.
// If no alignment is allowed, we'll stick with the original alignment
// and accept that it isn't going to render very nicely. This can happen
// if the browser window is very, very small.
if (align in disallow) {
for (var ii = 0; ii < alignments.length; ii++) {
if (!(alignments[ii] in disallow)) {
align = alignments[ii];
break;
}
}
}
switch (align) {
case 'right':
v = v.add(d)
.add(JX.$V(-m.x, 0));