Stub tabber

1 files changed, 63 insertions, 3 deletions

diff --git a/ui.js b/ui.js
index 13774cd..01e5b1a 100644
--- a/ui.js
+++ b/ui.js
@@ -43,9 +43,12 @@ class AppElement extends FocusElement {
     this.paneRight = new Pane()
     this.form.addChild(this.paneRight)
 
+    this.tabber = new Tabber()
+    this.paneLeft.addChild(this.tabber)
+    this.form.addInput(this.tabber, false)
+
     this.grouplikeListingElement = new GrouplikeListingElement(this.recordStore)
-    this.paneLeft.addChild(this.grouplikeListingElement)
-    this.form.addInput(this.grouplikeListingElement, false)
+    this.tabber.addTab(this.grouplikeListingElement)
 
     const handleSelectFromMain = item => {
       if (isGroup(item)) {
@@ -195,7 +198,8 @@ class AppElement extends FocusElement {
     this.playbackPane.w = this.contentW
     this.playbackPane.h = this.contentH - this.playbackPane.y
 
-    this.grouplikeListingElement.fillParent()
+    this.tabber.fillParent()
+    this.tabber.fixLayout()
     this.queueListingElement.fillParent()
     this.playbackInfoElement.fillParent()
   }
@@ -1006,4 +1010,60 @@ class AlertDialog extends Dialog {
   }
 }
 
+class Tabber extends FocusElement {
+  constructor() {
+    super()
+
+    this.tabberElements = []
+    this.currentElementIndex = 0
+  }
+
+  fixLayout() {
+    if (this.currentElement) {
+      this.currentElement.fillParent()
+      this.currentElement.fixLayout()
+    }
+  }
+
+  addTab(element) {
+    this.tabberElements.push(element)
+    this.addChild(element)
+  }
+
+  nextTab() {
+    this.currentElementIndex++
+    this.updateVisibleElement()
+  }
+
+  previousTab() {
+    this.currentElementIndex--
+    this.updateVisibleElement()
+  }
+
+  updateVisibleElement() {
+    const len = this.tabberElements.length
+    this.currentElementIndex = Math.min(len, Math.max(0, this.currentElementIndex))
+
+    this.tabberElements.forEach((el, i) => {
+      el.visible = (i === this.currentElementIndex)
+    })
+
+    this.fixLayout()
+  }
+
+  selected() {
+    if (this.currentElement) {
+      this.root.select(this.currentElement)
+    }
+  }
+
+  get selectable() {
+    return this.currentElement && this.currentElement.selectable
+  }
+
+  get currentElement() {
+    return this.tabberElements[this.currentElementIndex] || null
+  }
+}
+
 module.exports.AppElement = AppElement