compare indexes for render order on mouseover.

lib/widget.js

@@ -28,6 +28,8 @@ function Node(options) {
   this.parent = options.parent || null; // this.screen;
   this.children = [];
   this.$ = this._ = this.data = {};
+  this.uid = Node.uid++;
+  this._index = -1;
 
   if (this.parent) {
     this.parent.append(this);
@@ -49,6 +51,8 @@ function Node(options) {
   });
 }
 
+Node.uid = 0;
+
 Node.prototype.__proto__ = EventEmitter.prototype;
 
 Node.prototype.type = 'node';
@@ -174,6 +178,28 @@ Node.prototype.emitDescendants = function() {
   })(this);
 };
 
+Node.prototype.hasDescendant = function(target) {
+  return (function find(el) {
+    for (var i = 0; i < el.children.length; i++) {
+      if (el.children[i] === target) {
+        return true;
+      }
+      if (find(el.children[i]) === true) {
+        return true;
+      }
+    }
+    return false;
+  })(this);
+};
+
+Node.prototype.hasAncestor = function(target) {
+  var el = this;
+  while (el = el.parent) {
+    if (el === target) return true;
+  }
+  return false;
+};
+
 Node.prototype.gon = function(type, callback) {
   var self = this
     , events = this._events || {}
@@ -231,6 +257,8 @@ function Screen(options) {
   this.grabKeys = false;
   this.lockKeys = false;
 
+  this._ci = -1;
+
   this.alloc();
 
   this.program.on('resize', function() {
@@ -344,6 +372,10 @@ Screen.prototype._listenMouse = function(el) {
           el.emit('click', data);
           self.emit('element click', el, data);
         } else if (data.action === 'mousemove') {
+          //if (el.hasAncestor(self.hover)) {
+          if (self.hover && self.getIndex(el) > self.getIndex(self.hover)) {
+            set = false;
+          }
           if (self.hover !== el && !set) {
             if (self.hover) {
               self.hover.emit('mouseout', data);
@@ -452,15 +484,19 @@ Screen.prototype.alloc = function() {
 };
 
 Screen.prototype.render = function() {
+  var self = this;
   // TODO: Could possibly drop .dirty and just clear the `lines` buffer every
   // time before a screen.render. This way clearRegion doesn't have to be
   // called in arbitrary places for the sake of clearing a spot where an
   // element used to be (e.g. when an element moves or is hidden). There could
   // be some overhead though.
   // this.screen.clearRegion(0, this.cols, 0, this.rows);
+  this._ci = 0;
   this.children.forEach(function(el) {
+    el._index = self._ci++;
     el.render();
   });
+  this._ci = -1;
   this.draw(0, this.rows - 1);
   this.emit('draw');
 };
@@ -773,6 +809,49 @@ Screen.prototype.fillRegion = function(attr, ch, xi, xl, yi, yl) {
   }
 };
 
+// Get the element's index in order of rendering.
+Screen.prototype.getIndex = function(target) {
+  return target._index;
+};
+
+// Get the element's index in order of rendering.
+Screen.prototype.getIndex_ = function(target) {
+  var pos = target._lastPos || {}
+    , hash;
+
+  //hash = pos.xi + ':' + pos.xl + ':'
+  //  + pos.yi + ':' + pos.yl + ':'
+  //  + target.parent.uid + ':'
+  //  + (target.parent ? target.parent.children.indexOf(target) : '');
+
+  if (!target.parent) return -1;
+
+  hash = target.parent.uid + ':'
+    + (target.parent ? target.parent.children.indexOf(target) : '');
+
+  if (target._ihash === hash) {
+    return target._index;
+  }
+  target._ihash = hash;
+
+  var self = this;
+
+  this._ei = 0;
+
+  return (function find(el) {
+    for (var i = 0; i < el.children.length; i++) {
+      if (el.children[i] === target) {
+        return target._index = self._ei;
+      }
+      self._ei++;
+      if (find(el.children[i]) !== -1) {
+        return target._index = self._ei;
+      }
+    }
+    return target._index = -1;
+  })(this);
+};
+
 /**
  * Element
  */
@@ -1692,6 +1771,9 @@ outer:
   }
 
   this.children.forEach(function(el) {
+    if (el.screen._ci !== -1) {
+      el._index = el.screen._ci++;
+    }
     el.render();
   });