listbar scrolling work.

lib/widget.js

@@ -1737,6 +1737,8 @@ function Element(options) {
 
   this.position = options.position;
 
+  this.noOverflow = options.noOverflow;
+
   this.style = options.style;
 
   if (!this.style) {
@@ -3022,6 +3024,21 @@ Element.prototype._getCoords = function(get) {
     if (xi >= xl) return;
   }
 
+  if (this.noOverflow && this.parent.lpos) {
+    if (xi < this.parent.lpos.xi - this.parent.ileft) {
+      xi = this.parent.lpos.xi - this.parent.ileft;
+    }
+    if (xl > this.parent.lpos.xl - this.parent.iright) {
+      xl = this.parent.lpos.xl - this.parent.iright;
+    }
+    if (yi < this.parent.lpos.yi - this.parent.itop) {
+      yi = this.parent.lpos.yi - this.parent.itop;
+    }
+    if (yl > this.parent.lpos.yl - this.parent.ibottom) {
+      yl = this.parent.lpos.yl - this.parent.ibottom;
+    }
+  }
+
   return {
     xi: xi,
     xl: xl,
@@ -5713,6 +5730,15 @@ function Listbar(options) {
 
   Box.call(this, options);
 
+  this._.debug = new Box({
+    parent: this.screen,
+    top: 0,
+    left: 0,
+    height: 'shrink',
+    width: 'shrink',
+    content: '...'
+  });
+
   if (options.commands || options.items) {
     this.setItems(options.commands || options.items);
   }
@@ -5880,7 +5906,8 @@ Listbar.prototype.appendItem = function(item, callback) {
     autoFocus: false,
     tags: true,
     mouse: true,
-    style: merge({}, this.style.item)
+    style: merge({}, this.style.item),
+    noOverflow: true
   };
 
   if (!this.screen.autoPadding) {
@@ -5948,7 +5975,7 @@ Listbar.prototype.render = function() {
 
   this.items.forEach(function(el, i) {
     // XXX Ugly workaround - no need for .scrollable though
-    el.width = el.getText().length + 2;
+    if (0) el.width = el.getText().length + 2;
 
     if (i < self.leftBase) {
       el.hide();
@@ -5956,15 +5983,21 @@ Listbar.prototype.render = function() {
       el.rleft = drawn + 1;
 
       // XXX Ugly workaround - no need for .scrollable though
-      if (drawn + el.width + 2 > lpos.xl - lpos.xi - self.iwidth) {
-        if (i === self.items.length - 1 && self.selected === i) {
+      if (0) if (drawn + el.width + 2 > lpos.xl - lpos.xi - self.iwidth) {
+        //if (i === self.items.length - 1 && self.selected === i) {
+        if (self.selected === i) {
           redo = true;
           return;
         }
-        el.width -= ((drawn + el.width + 0) // could be 2 without the autopadding check
-          - (lpos.xl - lpos.xi - self.iwidth)
-          // XXX WHY? This seems backwards:
-          + (self.screen.autoPadding ? 1 : 0));
+        // 0 could be 2 without the autopadding check
+        var d = (drawn + el.width + 2) - (lpos.xl - lpos.xi - self.iwidth);
+        // XXX WHY? This seems backwards:
+        //d -= self.screen.autoPadding ? 1 : 0;
+        if (d >= el.width) {
+          el.hide();
+          return;
+        }
+        el.width -= d;
       }
 
       drawn += el.width + 2;
@@ -5973,9 +6006,11 @@ Listbar.prototype.render = function() {
   });
 
   // XXX Ugly workaround - no need for .scrollable though
-  if (redo) {
+  if (0) if (redo) {
     this.leftBase++;
     this.leftOffset--;
+    this.leftBase = Math.min(this.items.length - 1, this.leftBase);
+    this.leftOffset = Math.max(0, this.leftOffset);
     return this.render();
   }
 
@@ -6013,7 +6048,7 @@ Listbar.prototype.select = function(offset) {
   });
 
   var diff = offset - (this.leftBase + this.leftOffset);
-  if (offset > this.leftBase + this.leftOffset) {
+  if (0) if (offset > this.leftBase + this.leftOffset) {
     if (offset - this.leftBase > visible - 1) {
       this.leftOffset -= diff - 1;
       this.leftBase += diff;
@@ -6030,6 +6065,38 @@ Listbar.prototype.select = function(offset) {
       this.leftOffset -= diff;
     }
   }
+
+  var diff = offset - (this.leftBase + this.leftOffset);
+  if (offset > this.leftBase + this.leftOffset) {
+    if (offset > this.leftBase + visible - 1) {
+      //this.leftOffset = visible;
+      //this.leftBase = offset - visible;
+      this.leftOffset = 0;
+      this.leftBase = offset;
+    } else {
+      this.leftOffset += diff;
+    }
+  } else if (offset < this.leftBase + this.leftOffset) {
+    diff = -diff;
+    if (offset < this.leftBase) {
+      this.leftOffset = 0;
+      this.leftBase = offset;
+    } else {
+      this.leftOffset -= diff;
+    }
+  }
+
+  //this.leftOffset = Math.max(0, this.leftOffset);
+  //this.leftBase = Math.max(0, this.leftBase);
+
+  this._.debug.setContent(JSON.stringify({
+    leftOffset: this.leftOffset,
+    leftBase: this.leftBase,
+    drawn: drawn,
+    visible: visible,
+    width: width,
+    diff: diff
+  }, null, 2));
 };
 
 Listbar.prototype.removeItem = function(child) {