From 97233d417dc5398baa827158bdfc4c7e433fd075 Mon Sep 17 00:00:00 2001
From: rolux <rolux@rolux.org>
Date: Sat, 24 May 2014 16:16:08 +0200
Subject: [PATCH] make bottom menus right-aligned if they wouldn't fit the
 window when left-aligned

---
 source/Ox.UI/css/Ox.UI.css   |  6 ++++++
 source/Ox.UI/js/Menu/Menu.js | 15 ++++++++++-----
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/source/Ox.UI/css/Ox.UI.css b/source/Ox.UI/css/Ox.UI.css
index 896ef7c3..d119f1b0 100644
--- a/source/Ox.UI/css/Ox.UI.css
+++ b/source/Ox.UI/css/Ox.UI.css
@@ -1873,12 +1873,18 @@ Menus
     border-bottom-left-radius: 4px;
     border-bottom-right-radius: 4px;
 }
+.OxMenu.OxLeft {
+    border-top-left-radius: 4px;
+}
 .OxMenu.OxRight {
     border-top-right-radius: 4px;
 }
 .OxMenu .OxTop {
     height: 4px;
 }
+.OxMenu.OxLeft .OxTop {
+    border-top-left-radius: 4px;
+}
 .OxMenu.OxRight .OxTop {
     border-top-right-radius: 4px;
 }
diff --git a/source/Ox.UI/js/Menu/Menu.js b/source/Ox.UI/js/Menu/Menu.js
index e4d52037..a530fb43 100644
--- a/source/Ox.UI/js/Menu/Menu.js
+++ b/source/Ox.UI/js/Menu/Menu.js
@@ -802,17 +802,22 @@ Ox.Menu = function(options, self) {
         var offset = self.options.element.offset(),
             width = self.options.element.outerWidth(),
             height = self.options.element.outerHeight(),
-            left = Ox.limit(
-                offset.left + self.options.offset.left + (self.options.edge == 'bottom' ? 0 : width),
-                0, Ox.UI.$window.width() - that.width()
-            ),
+            menuWidth = that.width(),
+            windowWidth = Ox.UI.$window.width(),
+            windowHeight = Ox.UI.$window.height(),
+            left = offset.left + self.options.offset.left + (self.options.edge == 'bottom' ? 0 : width),
+            right,
             top = offset.top + self.options.offset.top + (self.options.edge == 'bottom' ? height : 0),
             menuHeight = that.$content.outerHeight(), // fixme: why is outerHeight 0 when hidden?
             menuMaxHeight = Math.floor(Ox.UI.$window.height() - top - 16);
+        if (self.options.edge == 'bottom' && left + menuWidth > windowWidth) {
+            left = offset.left + width - menuWidth;
+            that.is('.OxRight') && that.removeClass('OxRight') && that.addClass('OxLeft');
+        }
         if (self.options.parent) {
             if (menuHeight > menuMaxHeight) {
                 top = Ox.limit(top - menuHeight + menuMaxHeight, self.options.parent.offset().top, top);
-                menuMaxHeight = Math.floor(Ox.UI.$window.height() - top - 16);
+                menuMaxHeight = Math.floor(windowHeight - top - 16);
             }
         }
         that.css({