mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-22 21:40:55 +01:00
When a dropdown menu would render in a way that hides it offscreen, try a different alignment
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:
parent
41afc7c7e6
commit
e4524d4707
2 changed files with 39 additions and 11 deletions
|
@ -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',
|
||||
),
|
||||
|
|
|
@ -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));
|
||||
|
|
Loading…
Reference in a new issue