Ox.Menu: deselect when mouse moves over disabled item

source/UI/js/Menu/Menu.js

@@ -62,10 +62,10 @@ Ox.Menu = function(options, self) {
             ' Ox' + Ox.toTitleCase(self.options.size)
         )
         .on({
-            click: click,
             mouseenter: mouseenter,
             mouseleave: mouseleave,
             mousemove: mousemove,
+            mouseup: mouseup,
             mousewheel: mousewheel
         })
         .bindEvent({
@@ -103,29 +103,6 @@ Ox.Menu = function(options, self) {
         .addClass('OxBottom')
         .appendTo(that);
 
-    function click(event) {
-        var item,
-            position,
-            $target = $(event.target),
-            $parent = $target.parent();
-        // necessary for highlight
-        if ($parent.is('.OxCell')) {
-            $target = $parent;
-            $parent = $target.parent();
-        }
-        if ($target.is('.OxCell')) {
-            position = $parent.data('position');
-            item = that.items[position];
-            if (!item.options('disabled')) {
-                clickItem(position);
-            } else {
-                that.hideMenu();
-            }
-        } else {
-            that.hideMenu();
-        }
-    }
-
     function clickItem(position, files) {
         var item = that.items[position],
             group = item.options('group'),
@@ -268,14 +245,41 @@ Ox.Menu = function(options, self) {
         if ($target.is('.OxCell')) {
             position = $parent.data('position');
             item = that.items[position];
-            if (!item.options('disabled') && position != self.options.selected) {
-                selectItem(position);
+            if (position != self.options.selected) {
+                if (!item.options('disabled')) {
+                    selectItem(position);
+                } else {
+                    mouseleave();
+                }
             }
         } else {
             mouseleave();
         }
     }
 
+    function mouseup(event) {
+        var item,
+            position,
+            $target = $(event.target),
+            $parent = $target.parent();
+        // necessary for highlight
+        if ($parent.is('.OxCell')) {
+            $target = $parent;
+            $parent = $target.parent();
+        }
+        if ($target.is('.OxCell')) {
+            position = $parent.data('position');
+            item = that.items[position];
+            if (!item.options('disabled')) {
+                clickItem(position);
+            } else {
+                that.hideMenu();
+            }
+        } else {
+            that.hideMenu();
+        }
+    }
+
     function mousewheel(e, delta, deltaX, deltaY) {
         var $scrollbar;
         if (deltaY && !$(e.target).is('.OxScrollbar')) {
@@ -376,9 +380,6 @@ Ox.Menu = function(options, self) {
         return $('<div/>', {
             'class': 'OxScrollbar Ox' + Ox.toTitleCase(direction),
             html: Ox.SYMBOLS['triangle_' + direction],
-            click: function() { // fixme: do we need to listen to click event?
-                return false;
-            },
             mousedown: function() {
                 self.scrollSpeed = 2;
                 return false;
@@ -808,7 +809,7 @@ Ox.Menu = function(options, self) {
     };
 
     /*@
-    setItemTitle <f> setItemTitle 
+    setItemTitle <f> setItemTitle
         (id, title) -> <o>  set item title
     @*/
     that.setItemTitle = function(id, title) {
@@ -835,7 +836,7 @@ Ox.Menu = function(options, self) {
             that.gainFocus();
             that.$layer = Ox.Layer({type: 'menu'})
                 .css({top: self.options.mainmenu ? '20px' : 0})
-                .bindEvent({click: clickLayer})
+                .on({mouseup: clickLayer})
                 .show();
         }
         return that;