← Back to team overview

dhis2-devs team mailing list archive

[Branch ~dhis2-devs-core/dhis2/trunk] Rev 13203: change direction of context-menu if it overflows current browser window

 

------------------------------------------------------------
revno: 13203
committer: Morten Olav Hansen <mortenoh@xxxxxxxxx>
branch nick: dhis2
timestamp: Wed 2013-12-11 15:39:02 +0100
message:
  change direction of context-menu if it overflows current browser window
modified:
  dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.contextmenu.js


--
lp:dhis2
https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk

Your team DHIS 2 developers is subscribed to branch lp:dhis2.
To unsubscribe from this branch go to https://code.launchpad.net/~dhis2-devs-core/dhis2/trunk/+edit-subscription
=== modified file 'dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.contextmenu.js'
--- dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.contextmenu.js	2013-12-04 14:39:36 +0000
+++ dhis-2/dhis-web/dhis-web-commons-resources/src/main/webapp/dhis-web-commons/javascripts/dhis2/dhis2.contextmenu.js	2013-12-11 14:39:02 +0000
@@ -60,7 +60,7 @@
   var config = dhis2.contextmenu.config;
 
   var $list = $('#' + config.listId);
-  var $menu = $('#' + config.menuId);
+  window.$menu = $('#' + config.menuId);
   var $menuItems = $menu.find('ul');
 
   // make sure that all old event handler are removed (with .context namespace)
@@ -111,8 +111,25 @@
       }
     });
 
+    var menuHeight = $menu.height();
+    var menuWidth = $menu.width();
+    var winHeight = $(window).height();
+    var winWidth = $(window).width();
+
+    var pageX = e.pageX;
+    var pageY = e.pageY;
+
     $menu.show();
-    $menu.css({left: e.pageX, top: e.pageY});
+
+    if( (menuWidth + pageX) > winWidth ) {
+      pageX -= menuWidth;
+    }
+
+    if( (menuHeight + pageY) > winHeight ) {
+      pageY -= menuHeight;
+    }
+
+    $menu.css({left: pageX, top: pageY});
 
     return false;
   });