diff --git a/resources/celerity/map.php b/resources/celerity/map.php --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -10,7 +10,7 @@ '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 @@ '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 @@ '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 @@ '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 @@ 'javelin-uri', 'phabricator-notification', ), - 'bdce4d78' => array( - 'javelin-install', - 'javelin-util', - 'javelin-dom', - 'javelin-vector', - 'javelin-stratcom', - ), 'bde53589' => array( 'phui-inline-comment-view-css', ), diff --git a/webroot/rsrc/js/phuix/PHUIXDropdownMenu.js b/webroot/rsrc/js/phuix/PHUIXDropdownMenu.js --- a/webroot/rsrc/js/phuix/PHUIXDropdownMenu.js +++ b/webroot/rsrc/js/phuix/PHUIXDropdownMenu.js @@ -198,7 +198,35 @@ 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));