Added proper support for dropdown menus in RTL
authorAlexander Ebert <ebert@woltlab.com>
Tue, 11 Mar 2014 16:06:00 +0000 (17:06 +0100)
committerAlexander Ebert <ebert@woltlab.com>
Tue, 11 Mar 2014 16:06:00 +0000 (17:06 +0100)
wcfsetup/install/files/js/WCF.js

index edb5653308935b189b64c7783b0ad7803fc976d4..fcc7901a8363828acc723cb2b1a0d0ed69f7939d 100755 (executable)
@@ -1080,14 +1080,40 @@ WCF.Dropdown = {
                if ($align === 'left') {
                        dropdownMenu.removeClass('dropdownArrowRight');
                        
-                       $left = $dropdownOffsets.left + 'px';
+                       $left = $dropdownOffsets.left;
                }
                else {
                        dropdownMenu.addClass('dropdownArrowRight');
                        
-                       $right = ($windowWidth - ($dropdownOffsets.left + $dropdownDimensions.width)) + 'px';
+                       $right = ($windowWidth - ($dropdownOffsets.left + $dropdownDimensions.width));
                }
                
+               // rtl works the same with the exception that we need to offset it with the right boundary
+               if (WCF.Language.get('wcf.global.pageDirection') == 'rtl') {
+                       var $oldLeft = $left;
+                       var $oldRight = $right;
+                       
+                       // use reverse positioning
+                       if ($left == 'auto') {
+                               dropdownMenu.removeClass('dropdownArrowRight');
+                       }
+                       else {
+                               $right = $windowWidth - ($dropdownOffsets.left + $dropdownDimensions.width);
+                               $left = 'auto';
+                               
+                               if ($right + $menuDimensions.width > $windowWidth) {
+                                       // exceeded window width, restore ltr values
+                                       $left = $oldLeft;
+                                       $right = $oldRight;
+                                       
+                                       dropdownMenu.addClass('dropdownArrowRight');
+                               }
+                       }
+               }
+               
+               if ($left == 'auto') $right += 'px';
+               else $left += 'px';
+               
                // calculate vertical offset
                var $wasHidden = true;
                if (dropdownMenu.hasClass('dropdownOpen')) {