auto calculate top for lists.

lib/high.js

@@ -245,7 +245,12 @@ Screen.prototype.draw = function(start, end) {
  */
 
 function Element(options) {
+  options = options || {};
+
   Node.call(this, options);
+
+  this.options = options;
+
   this.screen = options.screen;
   this.parent = options.parent || (function(){throw Error('No parent.')})();
   this.position = {
@@ -298,13 +303,26 @@ Element.prototype.__defineGetter__('left', function() {
     left = (this.parent.width - len) * left | 0;
   }
 
+  var opt = this.options;
+  if (opt.left == null && !left && opt.right != null && this.position.right) {
+    left = this.width - this.position.right;
+  }
+
   return (this.parent.left || 0) + left;
 });
 
+Element.prototype.__defineSetter__('left', function(val) {
+  return this.position.left = val;
+});
+
 Element.prototype.__defineGetter__('right', function() {
   return (this.parent.right || 0) + this.position.right;
 });
 
+Element.prototype.__defineSetter__('right', function(val) {
+  return this.position.right = val;
+});
+
 Element.prototype.__defineGetter__('top', function() {
   var top = this.position.top;
 
@@ -315,13 +333,31 @@ Element.prototype.__defineGetter__('top', function() {
     top = (this.parent.height - len) * top | 0;
   }
 
+  var opt = this.options;
+  if (opt.top == null && !top && opt.bottom != null && this.position.bottom) {
+    top = this.height - this.position.bottom;
+  }
+
+  if (this.parent.childBase != null && ~this.parent.items.indexOf(this)) {
+    top += this.parent.items.indexOf(this);
+    top -= this.parent.childBase;
+  }
+
   return (this.parent.top || 0) + top;
 });
 
+Element.prototype.__defineSetter__('top', function() {
+  return this.position.top = val;
+});
+
 Element.prototype.__defineGetter__('bottom', function() {
   return (this.parent.bottom || 0) + this.position.bottom;
 });
 
+Element.prototype.__defineSetter__('bottom', function(val) {
+  return this.position.bottom = val;
+});
+
 Element.prototype.__defineGetter__('width', function() {
   var width = this.position.width;
   if (typeof width === 'string') {
@@ -342,6 +378,10 @@ Element.prototype.__defineGetter__('width', function() {
   return width;
 });
 
+Element.prototype.__defineSetter__('width', function(val) {
+  return this.position.width = val;
+});
+
 Element.prototype.__defineGetter__('height', function() {
   var height = this.position.height;
   if (typeof height === 'string') {
@@ -362,6 +402,10 @@ Element.prototype.__defineGetter__('height', function() {
   return height;
 });
 
+Element.prototype.__defineSetter__('height', function(val) {
+  return this.position.height = val;
+});
+
 Element.prototype.__defineGetter__('rleft', function() {
   var left = this.position.left;
 
@@ -372,13 +416,26 @@ Element.prototype.__defineGetter__('rleft', function() {
     left = len * left | 0;
   }
 
+  var opt = this.options;
+  if (opt.left == null && !left && opt.right != null && this.position.right) {
+    left = this.width - this.position.right;
+  }
+
   return left;
 });
 
+Element.prototype.__defineSetter__('rleft', function(val) {
+  return this.position.left = val;
+});
+
 Element.prototype.__defineGetter__('rright', function() {
   return this.position.right;
 });
 
+Element.prototype.__defineSetter__('rright', function() {
+  return this.position.right = val;
+});
+
 Element.prototype.__defineGetter__('rtop', function() {
   var top = this.position.top;
 
@@ -389,13 +446,31 @@ Element.prototype.__defineGetter__('rtop', function() {
     top = len * top | 0;
   }
 
+  var opt = this.options;
+  if (opt.top == null && !top && opt.bottom != null && this.position.bottom) {
+    top = this.height - this.position.bottom;
+  }
+
+  if (this.parent.childBase != null && ~this.parent.items.indexOf(this)) {
+    top += this.parent.items.indexOf(this);
+    top -= this.parent.childBase;
+  }
+
   return top;
 });
 
+Element.prototype.__defineSetter__('rtop', function() {
+  return this.position.top = val;
+});
+
 Element.prototype.__defineGetter__('rbottom', function() {
   return this.position.bottom;
 });
 
+Element.prototype.__defineSetter__('rbottom', function() {
+  return this.position.bottom = val;
+});
+
 /**
  * Border Measures
  */
@@ -519,6 +594,7 @@ Box.prototype.render = function() {
 function Text(options) {
   Element.call(this, options);
   this.full = options.full;
+  this.noOverflow = options.noOverflow;
 }
 
 Text.prototype.__proto__ = Element.prototype;
@@ -548,16 +624,15 @@ Text.prototype.render = function() {
     xl = xi + this.parent.width - (this.parent.border ? 2 : 0) - this.rleft - this.rright;
   }
 
-  if (this.parent.childBase != null && ~this.parent.items.indexOf(this)) {
+  if (this.noOverflow) {
     var rtop = this.rtop - (this.parent.border ? 1 : 0)
       , visible = this.parent.height - (this.parent.border ? 2 : 0);
 
-    yi -= this.parent.childBase;
-
-    if (rtop - this.parent.childBase < 0) {
+    if (rtop < 0) {
       return;
     }
-    if (rtop - this.parent.childBase >= visible) {
+
+    if (rtop >= visible) {
       return;
     }
   }
@@ -636,9 +711,10 @@ List.prototype.add = function(item) {
     fg: this.fg,
     bg: this.bg,
     content: item.content || item,
-    top: this.items.length + (this.border ? 1 : 0),
+    top: 0,
     left: (this.border ? 1 : 0) + 1,
     full: true,
+    noOverflow: true,
     height: 1
   });
   this.append(item);