Mouse support in tabber elements

Click to switch tab, scroll over the tab list to quickly switch to the
previous or next tab.

1 files changed, 23 insertions, 0 deletions

diff --git a/ui.js b/ui.js
index f5880df..20e59e8 100644
--- a/ui.js
+++ b/ui.js
@@ -1733,6 +1733,10 @@ class Tabber extends FocusElement {
 
     this.listElement = new TabberList(this)
     this.addChild(this.listElement)
+
+    this.listElement.on('selected', item => this.selectTab(item))
+    this.listElement.on('next tab', () => this.nextTab())
+    this.listElement.on('previous tab', () => this.previousTab())
   }
 
   fixLayout() {
@@ -1858,6 +1862,7 @@ class TabberList extends ListScrollForm {
       const element = new TabberListItem(item, this.tabber)
       this.addInput(element)
       element.fixLayout()
+      element.on('selected', () => this.emit('selected', item))
     }
 
     this.scrollToEnd()
@@ -1887,6 +1892,16 @@ class TabberList extends ListScrollForm {
     }
   }
 
+  clicked(button) {
+    if (button === 'scroll-up') {
+      this.emit('previous tab')
+      return false
+    } else if (button === 'scroll-down') {
+      this.emit('next tab')
+      return false
+    }
+  }
+
   // TODO: Be less hacky about these! Right now the tabber list is totally not
   // interactive.
   get curIndex() { return this.tabber.currentElementIndex }
@@ -1903,6 +1918,7 @@ class TabberListItem extends FocusElement {
 
   fixLayout() {
     this.w = ansi.measureColumns(this.text) + 3
+    this.h = 1
   }
 
   drawTo(writable) {
@@ -1917,6 +1933,13 @@ class TabberListItem extends FocusElement {
     }
   }
 
+  clicked(button) {
+    if (button === 'left') {
+      this.emit('selected')
+      return false
+    }
+  }
+
   get text() {
     return this.tab.tabberLabel || 'a(n) ' + this.tab.constructor.name
   }