Container sort (#244)

6 files changed, 156 insertions, 26 deletions

diff --git a/src/enum.js b/src/enum.js
new file mode 100644
index 0000000..b435091
--- /dev/null
+++ b/src/enum.js
@@ -0,0 +1,11 @@
+module.exports = {
+  ContainerState: {
+    created: 'created',
+    restarting: 'restarting',
+    running: 'running',
+    removing: 'removing',
+    paused: 'paused',
+    exited: 'exited',
+    dead: 'dead'
+  }
+}
diff --git a/src/screen.js b/src/screen.js
index 10b836e..aa3dad6 100644
--- a/src/screen.js
+++ b/src/screen.js
@@ -11,16 +11,17 @@ const MODES = require('../lib/modes')
 // from the user (index.js)
 const CONTAINERS_GRID_LAYOUT = {
   'actionsMenu': [4, 4, 4, 4],
-  'searchInput': [11, 0, 1, 12],
-  'actionStatus': [6, 0, 1, 10],
+  'help': [4, 4, 4, 4],
   'containerInfo': [2, 2, 8, 8],
+  'containerSortList': [4, 5, 3, 2],
   'containerList': [0, 0, 6, 10],
-  'containerLogs': [7, 0, 4, 12],
+  'actionStatus': [6, 0, 1, 10],
   'containerStatus': [0, 10, 2, 2],
   'containerUtilization': [2, 10, 3, 2],
   'containerVsImages': [5, 10, 2, 2],
-  'help': [4, 4, 4, 4],
-  'toolbar': [11, 0, 1, 12]
+  'containerLogs': [7, 0, 4, 12],
+  'toolbar': [11, 0, 1, 12],
+  'searchInput': [11, 0, 1, 12]
 }
 
 const SERVICES_GRID_LAYOUT = {
@@ -208,6 +209,7 @@ class screen {
       this.clearWidgets()
       this.toggleMode()
       this.screen.destroy()
+      // TODO refactor this so that all of the assets aren't reloaded on screen switch
       this.init()
     })
   }
diff --git a/widgets/actionsMenu.widget.js b/widgets/actionsMenu.widget.js
index 42b5756..3005853 100644
--- a/widgets/actionsMenu.widget.js
+++ b/widgets/actionsMenu.widget.js
@@ -119,7 +119,7 @@ class myWidget extends baseWidget() {
   }
 
   getWidget () {
-    return this.grid.gridObj.set(...this.grid.gridLayout, this.blessed.list, {
+    return this.blessed.list({
       label: this.label,
       scrollable: true,
       alwaysScroll: true,
@@ -137,7 +137,11 @@ class myWidget extends baseWidget() {
         ch: '|'
       },
       vi: true,
-      align: 'center'
+      align: 'center',
+      left: 'center',
+      top: 'center',
+      width: '33%',
+      height: '33%'
     })
   }
 
diff --git a/widgets/containers/containerList.widget.js b/widgets/containers/containerList.widget.js
index c5d2d02..b482267 100644
--- a/widgets/containers/containerList.widget.js
+++ b/widgets/containers/containerList.widget.js
@@ -5,11 +5,14 @@ const figures = require('figures')
 
 const ListWidget = require('../../src/widgetsTemplates/list.widget.template')
 
+const ContainerState = require('../../src/enum.js').ContainerState
+
 class myWidget extends ListWidget {
   constructor ({ blessed = {}, contrib = {}, screen = {}, grid = {} }) {
     super({ blessed, contrib, screen, grid })
     this.containersList = {}
     this.containersListData = []
+    this.sortBy = ContainerState.running
   }
 
   getLabel () {
@@ -56,6 +59,12 @@ class myWidget extends ListWidget {
     }
   }
 
+  sortContainersByState (state) {
+    this.sortBy = state
+    this.refreshList()
+  }
+
+  // TODO refactor this
   formatList (containers) {
     const containerList = {}
     if (containers) {
@@ -82,12 +91,19 @@ class myWidget extends ListWidget {
       let container = []
 
       container = containerList[key]
+      const status = container[4]
       container[4] = this.formatContainerState(container[4])
       container[5] = this.formatContainerStatus(container[5])
+      container[7] = status
 
       return container
     })
 
+    list.sort(this.sortContainers(this.sortBy))
+    list = list.map(a => {
+      a.pop()
+      return a
+    })
     list.unshift(['Id', 'Name', 'Image', 'Command', 'State', 'Status', 'Ports'])
     this.containersListData = list
     this.containersList = containerList
@@ -141,27 +157,17 @@ class myWidget extends ListWidget {
     return this.widget.getItem(this.widget.selected).getContent().toString().trim().split(' ').shift()
   }
 
-  /**
-   * Sort containers by their state: running, created, then exited.
-   *
-   * @param item left
-   * @param item right
-   * @returns {number} for position
-   */
-  sortContainers (a, b) {
-    if (a[4] === 'running' && b[4] !== 'running') {
-      return -1
-    }
-
-    if (a[4] === 'paused' && b[4] !== 'paused') {
-      return -1
-    }
+  sortContainers (state) {
+    return (a, b) => {
+      if (a[7] === state && b[7] !== state) {
+        return -1
+      }
 
-    if (a[4] === 'exited' && b[4] !== 'exited') {
-      return 1
+      if (b[7] === state && a[7] !== state) {
+        return 1
+      }
+      return 0
     }
-
-    return 0
   }
 }
 
diff --git a/widgets/containers/containerSortList.widget.js b/widgets/containers/containerSortList.widget.js
new file mode 100644
index 0000000..a0dbbc3
--- /dev/null
+++ b/widgets/containers/containerSortList.widget.js
@@ -0,0 +1,103 @@
+const baseWidget = require('../../src/baseWidget')
+const { ContainerState } = require('../../src/enum')
+
+class ContainerSortListWidget extends baseWidget() {
+  constructor ({ blessed = {}, contrib = {}, screen = {}, grid = {} }) {
+    super()
+    this.blessed = blessed
+    this.contrib = contrib
+    this.screen = screen
+    this.grid = grid
+    this.label = 'Sort By:'
+    this.isVisible = false
+    const sortedStates = Object.keys(ContainerState)
+    sortedStates.sort((a, b) => a.length - b.length)
+    this.items = sortedStates
+      .map(state =>
+        ({
+          [`By ${state.charAt(0).toUpperCase()}${state.slice(1)}`]:
+            {
+              handler: () => this.sortContainerList(state)
+            }
+        })
+      ).reduce((accum, obj) => ({ ...accum, ...obj }), {})
+
+    this.widget = this.getWidget()
+  }
+
+  init () {
+    if (!this.widgetsRepo.has('toolbar')) {
+      return null
+    }
+
+    this.registerEscapeKey()
+    this.registerSortHandler()
+    this.registerToolbarKey()
+  }
+
+  sortContainerList (state) {
+    const containerList = this.widgetsRepo.get('containerList')
+    if (!containerList) {
+      // TODO throw error!
+      return
+    }
+    containerList.sortContainersByState(state)
+  }
+
+  registerSortHandler () {
+    this.widget.on('select', (el) => {
+      this.items[el.getText()].handler()
+      this.toggleVisibility()
+    })
+  }
+
+  registerToolbarKey () {
+    const toolbar = this.widgetsRepo.get('toolbar')
+    toolbar.on('key', (keyString) => {
+      if (keyString === 'o') {
+        this.toggleVisibility()
+      }
+    })
+  }
+
+  registerEscapeKey () {
+    this.widget.on('keypress', (ch, key) => {
+      if (key.name === 'escape' || key.name === 'return') {
+        this.toggleVisibility()
+      }
+    })
+  }
+
+  toggleVisibility () {
+    if (this.isVisible) {
+      this.screen.remove(this.widget)
+    } else {
+      this.screen.append(this.widget)
+      this.screen.render()
+      this.widget.focus()
+    }
+    this.isVisible = !this.isVisible
+  }
+
+  getWidget () {
+    return this.blessed.list({
+      label: this.label,
+      keys: true,
+      align: 'center',
+      border: {
+        type: 'line'
+      },
+      left: 'center',
+      top: 'center',
+      width: '16%',
+      height: '25%',
+      style: this.getWidgetStyle(),
+      items: Object.keys(this.items)
+    })
+  }
+
+  renderWidget () {
+  }
+}
+
+module.exports = ContainerSortListWidget
diff --git a/widgets/toolbar.widget.js b/widgets/toolbar.widget.js
index 0cd8716..e45f1f1 100644
--- a/widgets/toolbar.widget.js
+++ b/widgets/toolbar.widget.js
@@ -74,6 +74,10 @@ class myWidget extends baseWidget(EventEmitter) {
       'menu': {
         keys: ['m'],
         callback: () => { this.emit('key', 'm') }
+      },
+      'sort': {
+        keys: ['o'],
+        callback: () => { this.emit('key', 'o') }
       }
     }