Add request increment/decrement

itemcontroller.lua

@@ -6,6 +6,7 @@ local List = require("gfx.list")
 local Event = require("gfx.event")
 local Padding = require("gfx.padding")
 local Container = require("gfx.container")
+local Element = require("gfx.element")
 local Progress = require("gfx.progress")
 local Children = require("gfx.prop.children")
 local Orientation = require("gfx.prop.orientation")
@@ -442,11 +443,13 @@ local PAGES = {
       state:setPage("MAIN")
       return NOOP
     end
-    local paddingSide = 0
-    local paddingTop = 0
 
-    local itemName = fitText(group:getSimpleName(), state.width - (paddingSide * 2))
+    local pageState = state:currentPageState({
-    local itemLeftPad, itemRightPad = getCenterPad(#itemName, state.width - (paddingSide * 2))
+      request = 0
+    })
+
+    local itemName = fitText(group:getSimpleName(), state.width)
+    local itemLeftPad, itemRightPad = getCenterPad(#itemName, state.width)
 
     local paddedTitle = Padding:new{
       top = 1,
@@ -454,20 +457,120 @@ local PAGES = {
       right = itemRightPad,
       bottom = 1,
       element = Text:new{
-        id = "title",
         text = itemName,
         bgColor = colors.gray
       },
-      bgColor = colors.gray,
+      bgColor = colors.gray
-      onClick = function(e, x, y, s)
-        local title = e:findById("title")
-        title:setText("Clicked")
-        local newLeftPad, newRightPad = getCenterPad(#("Clicked"), state.width - (paddingSide * 2))
-        e:setPadding{ left = newLeftPad, right = newRightPad }
-        return true
-      end
     }
 
+    local function makeRequestButton(increment)
+      local text = increment > 0 and ("+"..tostring(increment)) or tostring(increment)
+      return Text:new{ id = text, text = text }
+    end
+
+    local PADDING_RQC_H = 1
+    local paddedRequestCount = Padding:new{
+      top = 3,
+      left = PADDING_RQC_H,
+      right = PADDING_RQC_H,
+      bottom = 0,
+      element = List:new{
+        [Orientation:getId()] = Orientation.VERTICAL,
+        [Children:getId()] = {
+          List:new{
+            [Orientation:getId()] = Orientation.HORIZONTAL,
+            [Children:getId()] = {
+              Text:new{ text = "Request" },
+              Padding:new{
+                top = 0,
+                bottom = 0,
+                left = math.floor((state.width - (PADDING_RQC_H * 2) - #("Request") - #("Available")) / 2),
+                right = math.ceil((state.width - (PADDING_RQC_H * 2) - #("Request") - #("Available")) / 2),
+                element = { Text:new{ text = "/" } }
+              },
+              Text:new{ text = "Available" },
+            }
+          },
+          List:new{
+            [Orientation:getId()] = Orientation.HORIZONTAL,
+            [Children:getId()] = {
+              Text:new{ id = "data_request", text = tostring(pageState.request) },
+              Padding:new{
+                id = "data_divider",
+                top = 0,
+                bottom = 0,
+                left = math.floor((state.width - (PADDING_RQC_H * 2) - #tostring(pageState.request) - #tostring(group:getItemCount())) / 2),
+                right = math.ceil((state.width - (PADDING_RQC_H * 2) - #tostring(pageState.request) - #tostring(group:getItemCount())) / 2),
+                element = { Text:new{ text = "/" } }
+              },
+              Text:new{ id = "data_available", text = tostring(group:getItemCount()) },
+            }
+          },
+          Progress:new{
+            id = "request_capacity",
+            [Orientation:getId()] = Orientation.HORIZONTAL,
+            width = state.width - (PADDING_RQC_H * 2),
+            height = 1,
+            progress = pageState.request / group:getItemCount()
+          },
+          Element:new{
+            height = 1,
+            width = 0
+          },
+          Padding:new{
+            top = 0,
+            bottom = 0,
+            left = math.floor((state.width - 12)/2),
+            right = math.ceil((state.width - 12)/2),
+            element = List:new{
+              [Orientation:getId()] = Orientation.HORIZONTAL,
+              [Children:getId()] = {
+                makeRequestButton(-5),
+                Element:new{ width = 1 },
+                makeRequestButton(-1),
+                Element:new{ width = 2 },
+                makeRequestButton(1),
+                Element:new{ width = 1 },
+                makeRequestButton(5),
+              }
+            }
+          }
+        }
+      }
+    }
+
+    local function updateDisplayState()
+      local dataRequestText = paddedRequestCount:findById("data_request")
+      local dataDividerPad = paddedRequestCount:findById("data_divider")
+      local dataAvailableText = paddedRequestCount:findById("data_available")
+      local requestCapProgress = paddedRequestCount:findById("request_capacity")
+
+      dataRequestText:setText(tostring(pageState.request))
+      dataDividerPad:setPadding{
+        left = math.floor((state.width - (PADDING_RQC_H * 2) - #tostring(pageState.request) - #tostring(group:getItemCount())) / 2),
+        right = math.ceil((state.width - (PADDING_RQC_H * 2) - #tostring(pageState.request) - #tostring(group:getItemCount())) / 2)
+      }
+      dataAvailableText:setText(tostring(group:getItemCount()))
+      requestCapProgress:setProgress(pageState.request / group:getItemCount())
+    end
+
+    local function bindRequestButton(increment)
+      local id = increment > 0 and ("+"..tostring(increment)) or tostring(increment)
+      paddedRequestCount:findById(id):setOnClick(function(e, x, y, s)
+        local newValue = pageState.request + increment
+        if newValue >= 0 and newValue <= group:getItemCount() then
+          pageState.request = newValue
+          updateDisplayState()
+        end
+        return true
+      end)
+    end
+
+    bindRequestButton(-5)
+    bindRequestButton(-1)
+    bindRequestButton(1)
+    bindRequestButton(5)
+
     local stuffContainer = Container:new{
       [Children:getId()] = {
         paddedTitle