refactor: Simplify UI elements and improve layout for Pocket Control Center

pocketcontrol.lua

@@ -143,14 +143,16 @@ local function drawHeader()
     term.setCursorPos(1, 1)
     term.clearLine()
     
-    local title = "POCKET CONTROL CENTER"
+    local title = "POCKET CTRL"
-    term.setCursorPos(math.floor((w - #title) / 2) + 1, 1)
+    term.setCursorPos(2, 1)
     term.write(title)
     
-    -- Show mode indicator
+    -- Show quick stats
     term.setCursorPos(w - 10, 1)
-    local modeText = mode:upper():sub(1, 10)
+    term.write("T:" .. #turtles .. " ")
-    term.write(modeText)
+    if myPosition then
+        term.write("GPS")
+    end
 end
 
 -- Draw mode tabs
@@ -159,19 +161,34 @@ local function drawTabs()
     local tabWidth = math.floor(w / 5)
     local y = 2
     
-    addButton(1, y, tabWidth, 1, "TURTLES", function() mode = "overview" end, 
+    -- Draw tab highlights
-        mode == "overview" and colors.green or colors.gray)
+    term.setCursorPos(1, y)
-    addButton(tabWidth + 1, y, tabWidth, 1, "CONTROL", function() mode = "control" end,
+    term.setBackgroundColor(colors.black)
-        mode == "control" and colors.green or colors.gray)
+    term.clearLine()
-    addButton(tabWidth * 2 + 1, y, tabWidth, 1, "GPS", function() mode = "gps" end,
-        mode == "gps" and colors.green or colors.gray)
-    addButton(tabWidth * 3 + 1, y, tabWidth, 1, "BRIDGE", function() mode = "webbridge" end,
-        mode == "webbridge" and colors.green or colors.gray)
-    addButton(tabWidth * 4 + 1, y, w - tabWidth * 4, 1, "SERVER", function() mode = "server" end,
-        mode == "server" and colors.green or colors.gray)
     
-    for _, btn in ipairs(buttons) do
+    local tabs = {
-        drawButton(btn, false)
+        {name = "TRT", mode = "overview"},
+        {name = "CTL", mode = "control"},
+        {name = "GPS", mode = "gps"},
+        {name = "WEB", mode = "webbridge"},
+        {name = "SRV", mode = "server"}
+    }
+    
+    for i, tab in ipairs(tabs) do
+        local x = (i - 1) * tabWidth + 1
+        addButton(x, y, tabWidth, 1, tab.name, function() mode = tab.mode end, 
+            mode == tab.mode and colors.green or colors.gray)
+        
+        term.setCursorPos(x, y)
+        if mode == tab.mode then
+            term.setBackgroundColor(colors.green)
+            term.setTextColor(colors.white)
+        else
+            term.setBackgroundColor(colors.gray)
+            term.setTextColor(colors.lightGray)
+        end
+        local padding = math.floor((tabWidth - #tab.name) / 2)
+        term.write(string.rep(" ", padding) .. tab.name .. string.rep(" ", tabWidth - padding - #tab.name))
     end
 end
 
@@ -180,43 +197,44 @@ local function drawOverview()
     term.setBackgroundColor(colors.black)
     local y = 4
     
-    term.setTextColor(colors.white)
+    term.setTextColor(colors.lime)
     term.setCursorPos(2, y)
-    term.write("Turtles Online: " .. #turtles)
+    term.write("Online: " .. #turtles)
-    y = y + 2
+    y = y + 1
     
     if #turtles == 0 then
         term.setTextColor(colors.gray)
-        term.setCursorPos(2, y)
+        term.setCursorPos(2, y + 1)
-        term.write("No turtles detected")
+        term.write("No turtles")
     else
         for i, turtle in ipairs(turtles) do
-            if y >= h - 2 then break end
+            if y >= h - 3 then break end
             
             term.setCursorPos(2, y)
             term.setTextColor(colors.yellow)
-            term.write(string.format("Turtle #%-3d", turtle.turtleID))
+            term.write("#" .. turtle.turtleID)
             
             term.setTextColor(colors.lightGray)
-            term.setCursorPos(15, y)
+            term.setCursorPos(8, y)
-            term.write(turtle.mode or "idle")
+            local stateText = (turtle.mode or "idle"):sub(1, 8)
+            term.write(stateText)
             
             if turtle.position then
-                term.setCursorPos(25, y)
+                term.setCursorPos(17, y)
                 term.setTextColor(colors.gray)
-                term.write(string.format("[%d,%d,%d]", turtle.position.x, turtle.position.y, turtle.position.z))
+                term.write(string.format("%d,%d,%d", turtle.position.x, turtle.position.y, turtle.position.z))
             end
             
             y = y + 1
         end
     end
     
-    -- Add select buttons
+    -- Add select button
     local btnY = h - 1
-    addButton(2, btnY, 12, 1, "SELECT", function()
+    addButton(2, btnY, 10, 1, "SELECT", function()
         if #turtles > 0 then
             selectedTurtle = (selectedTurtle or 0) % #turtles + 1
-            addLog("Selected Turtle #" .. turtles[selectedTurtle].turtleID, colors.lime)
+            addLog("Selected #" .. turtles[selectedTurtle].turtleID, colors.lime)
         end
     end, colors.green)
     
@@ -234,54 +252,58 @@ local function drawControl()
         term.write("No turtle selected")
         term.setCursorPos(2, y + 1)
         term.setTextColor(colors.gray)
-        term.write("Go to TURTLES and SELECT")
+        term.write("SELECT from TURTLES")
         return
     end
     
     local turtle = turtles[selectedTurtle]
     term.setTextColor(colors.yellow)
     term.setCursorPos(2, y)
-    term.write("Controlling Turtle #" .. turtle.turtleID)
+    term.write("Turtle #" .. turtle.turtleID)
-    y = y + 2
+    y = y + 1
     
-    -- Movement buttons
+    -- Movement buttons (compact layout)
-    local btnSize = 5
+    local btnW = 4
-    local centerX = math.floor(w / 2)
+    local btnH = 1
-    local centerY = 10
+    local centerX = math.floor(w / 2) - 2
+    local centerY = 8
     
-    addButton(centerX - btnSize / 2, centerY - btnSize - 1, btnSize, 2, "FWD", function()
+    -- Movement controls
+    addButton(centerX, centerY - 2, btnW, btnH, "FWD", function()
         sendCommand(turtle.turtleID, "forward")
     end, colors.blue)
     
-    addButton(centerX - btnSize / 2, centerY + 2, btnSize, 2, "BACK", function()
+    addButton(centerX, centerY + 2, btnW, btnH, "BCK", function()
         sendCommand(turtle.turtleID, "back")
     end, colors.blue)
     
-    addButton(centerX - btnSize - 2, centerY, btnSize, 2, "LEFT", function()
+    addButton(centerX - btnW - 1, centerY, btnW, btnH, "LFT", function()
         sendCommand(turtle.turtleID, "turnLeft")
     end, colors.blue)
     
-    addButton(centerX + 2, centerY, btnSize, 2, "RIGHT", function()
+    addButton(centerX + btnW + 1, centerY, btnW, btnH, "RGT", function()
         sendCommand(turtle.turtleID, "turnRight")
     end, colors.blue)
     
-    addButton(centerX - btnSize / 2, centerY - 1, btnSize, 2, "UP", function()
+    addButton(centerX, centerY, btnW, btnH, "UP", function()
         sendCommand(turtle.turtleID, "up")
     end, colors.green)
     
-    addButton(2, centerY + 5, 7, 2, "DOWN", function()
+    -- Action buttons (bottom row)
+    local btnY = h - 3
+    addButton(2, btnY, 6, 1, "DOWN", function()
         sendCommand(turtle.turtleID, "down")
     end, colors.green)
     
-    addButton(10, centerY + 5, 7, 2, "DIG", function()
+    addButton(9, btnY, 6, 1, "DIG", function()
         sendCommand(turtle.turtleID, "dig")
     end, colors.red)
     
-    addButton(18, centerY + 5, 7, 2, "MINE", function()
+    addButton(16, btnY, 6, 1, "MINE", function()
         sendCommand(turtle.turtleID, "mineStart")
     end, colors.orange)
     
-    addButton(26, centerY + 5, 7, 2, "HOME", function()
+    addButton(23, btnY, 6, 1, "HOME", function()
         sendCommand(turtle.turtleID, "returnHome")
     end, colors.yellow)
     
@@ -297,25 +319,19 @@ local function drawGPS()
     term.setBackgroundColor(colors.black)
     local y = 4
     
-    term.setTextColor(colors.yellow)
-    term.setCursorPos(2, y)
-    term.write("GPS TRACKING")
-    y = y + 2
-    
-    -- My position
     term.setTextColor(colors.lime)
     term.setCursorPos(2, y)
-    term.write("Your Position:")
+    term.write("GPS Tracking")
     y = y + 1
     
+    -- My position (compact)
+    term.setTextColor(colors.white)
+    term.setCursorPos(2, y)
     if myPosition then
-        term.setTextColor(colors.white)
+        term.write(string.format("You: %d,%d,%d", myPosition.x, myPosition.y, myPosition.z))
-        term.setCursorPos(4, y)
-        term.write(string.format("X: %d  Y: %d  Z: %d", myPosition.x, myPosition.y, myPosition.z))
     else
         term.setTextColor(colors.red)
-        term.setCursorPos(4, y)
+        term.write("GPS: Not available")
-        term.write("GPS not available")
     end
     y = y + 2
     
@@ -330,23 +346,20 @@ local function drawGPS()
             
             term.setTextColor(colors.cyan)
             term.setCursorPos(2, y)
-            term.write(string.format("Turtle #%d distance:", turtle.turtleID))
+            term.write(string.format("Turtle #%d:", turtle.turtleID))
             y = y + 1
             term.setTextColor(colors.white)
-            term.setCursorPos(4, y)
+            term.setCursorPos(2, y)
-            term.write(string.format("%.1f blocks", dist))
+            term.write(string.format("Dist: %.1f blocks", dist))
             y = y + 1
-            term.setCursorPos(4, y)
             term.setTextColor(colors.gray)
+            term.setCursorPos(2, y)
             term.write(string.format("Delta: %d,%d,%d", dx, dy, dz))
         end
     end
     
-    y = y + 2
+    y = h - 2
-    addButton(2, y, 15, 2, "UPDATE GPS", function()
+    addButton(2, y, 13, 1, "UPDATE GPS", function()
-        term.setTextColor(colors.yellow)
-        term.setCursorPos(2, h - 2)
-        term.write("Locating...")
         if updateMyPosition() then
             addLog("GPS updated", colors.lime)
         else
@@ -354,10 +367,10 @@ local function drawGPS()
         end
     end, colors.green)
     
-    addButton(18, y, 15, 2, "GOTO TURTLE", function()
+    addButton(16, y, 13, 1, "GOTO TURTLE", function()
         if selectedTurtle and turtles[selectedTurtle] and turtles[selectedTurtle].position then
             local pos = turtles[selectedTurtle].position
-            addLog(string.format("Turtle at: %d,%d,%d", pos.x, pos.y, pos.z), colors.cyan)
+            addLog(string.format("At: %d,%d,%d", pos.x, pos.y, pos.z), colors.cyan)
         end
     end, colors.blue)
     
@@ -370,22 +383,19 @@ local function drawWebbridge()
     term.setBackgroundColor(colors.black)
     local y = 4
     
-    term.setTextColor(colors.yellow)
+    term.setTextColor(colors.lime)
     term.setCursorPos(2, y)
-    term.write("WEBBRIDGE CONTROL")
+    term.write("Webbridge Control")
-    y = y + 2
+    y = y + 1
     
     if webbridgeStatus then
-        term.setTextColor(colors.lime)
+        term.setTextColor(colors.white)
         term.setCursorPos(2, y)
         term.write("Status: ONLINE")
         y = y + 1
-        term.setTextColor(colors.white)
         term.setCursorPos(2, y)
-        term.write("Messages: " .. (webbridgeStatus.messages or 0))
+        term.write("MSG:" .. (webbridgeStatus.messages or 0) .. 
-        y = y + 1
+                   " CMD:" .. (webbridgeStatus.commands or 0))
-        term.setCursorPos(2, y)
-        term.write("Commands: " .. (webbridgeStatus.commands or 0))
     else
         term.setTextColor(colors.gray)
         term.setCursorPos(2, y)
@@ -394,20 +404,21 @@ local function drawWebbridge()
     
     y = y + 2
     
-    addButton(2, y, 15, 2, "PING", function()
+    -- Compact button layout
+    addButton(2, y, 13, 1, "PING", function()
         sendWebbridgeCommand("ping")
     end, colors.blue)
     
-    addButton(18, y, 15, 2, "RESTART", function()
+    addButton(16, y, 13, 1, "RESTART", function()
         sendWebbridgeCommand("restart")
     end, colors.orange)
     
-    y = y + 3
+    y = y + 2
-    addButton(2, y, 15, 2, "GET STATUS", function()
+    addButton(2, y, 13, 1, "STATUS", function()
         sendWebbridgeCommand("status")
     end, colors.green)
     
-    addButton(18, y, 15, 2, "VIEW LOGS", function()
+    addButton(16, y, 13, 1, "LOGS", function()
         sendWebbridgeCommand("logs")
     end, colors.cyan)
     
@@ -417,14 +428,14 @@ local function drawWebbridge()
         end
     end
     
-    -- Show recent logs
+    -- Show recent logs (compact)
-    y = y + 4
+    y = y + 3
     term.setTextColor(colors.gray)
     term.setCursorPos(2, y)
-    term.write("Recent Activity:")
+    term.write("Activity:")
     y = y + 1
     
-    for i = 1, math.min(5, #logMessages) do
+    for i = 1, math.min(3, #logMessages) do
         if y >= h - 1 then break end
         local log = logMessages[i]
         term.setTextColor(log.color)
@@ -443,48 +454,41 @@ local function drawServer()
     term.setBackgroundColor(colors.black)
     local y = 4
     
-    term.setTextColor(colors.yellow)
+    term.setTextColor(colors.lime)
     term.setCursorPos(2, y)
-    term.write("SERVER INTERFACE")
+    term.write("Server Interface")
-    y = y + 2
+    y = y + 1
     
     if serverStats then
-        term.setTextColor(colors.lime)
+        term.setTextColor(colors.white)
         term.setCursorPos(2, y)
-        term.write("Server: ONLINE")
+        term.write("Status: ONLINE")
         y = y + 1
         
-        term.setTextColor(colors.white)
         term.setCursorPos(2, y)
         term.write("Turtles: " .. (serverStats.turtles or 0))
         y = y + 1
         term.setCursorPos(2, y)
         term.write("Blocks: " .. (serverStats.blocks or 0))
-        y = y + 1
-        term.setCursorPos(2, y)
-        term.write("Uptime: " .. (serverStats.uptime or "?"))
     else
         term.setTextColor(colors.red)
         term.setCursorPos(2, y)
-        term.write("Server: OFFLINE")
+        term.write("Status: OFFLINE")
     end
     
-    y = y + 2
+    y = h - 2
     
-    addButton(2, y, 15, 2, "REFRESH", function()
+    addButton(2, y, 13, 1, "REFRESH", function()
-        term.setTextColor(colors.yellow)
-        term.setCursorPos(2, h - 2)
-        term.write("Fetching...")
         fetchServerStats()
-        addLog("Server stats refreshed", colors.lime)
+        addLog("Stats refreshed", colors.lime)
     end, colors.green)
     
-    addButton(18, y, 15, 2, "VIEW API", function()
+    addButton(16, y, 13, 1, "WEB INFO", function()
         modem.transmit(POCKET_CHANNEL, CHANNEL_RECEIVE, {
             type = "web_interface_request",
             from = os.getComputerID()
         })
-        addLog("Requesting web interface info", colors.cyan)
+        addLog("Requesting info", colors.cyan)
     end, colors.blue)
     
     drawButton(buttons[#buttons-1], false)
@@ -511,20 +515,20 @@ local function draw()
         drawServer()
     end
     
-    -- Status bar
+    -- Status bar (compact)
     term.setBackgroundColor(colors.gray)
     term.setCursorPos(1, h)
     term.clearLine()
     term.setTextColor(colors.white)
     term.setCursorPos(2, h)
-    term.write(string.format("Online:%d", #turtles))
+    term.write(string.format("T:%d", #turtles))
     if selectedTurtle and turtles[selectedTurtle] then
-        term.setCursorPos(15, h)
+        term.setCursorPos(8, h)
-        term.write("T#" .. turtles[selectedTurtle].turtleID)
+        term.write("#" .. turtles[selectedTurtle].turtleID)
     end
     if myPosition then
-        term.setCursorPos(w - 10, h)
+        term.setCursorPos(w - 5, h)
-        term.write("GPS:OK")
+        term.write("GPS")
     end
 end