reorganize themes, see #42

luigi/engine/alpha.lua

@@ -0,0 +1,251 @@
+local RESOURCE = (...):gsub('%.', '/') .. '/'
+
+return function (config)
+    config = config or {}
+    local resources = assert(config.resources, 'missing config.resources')
+    local backColor = config.backColor or { 240, 240, 240 }
+    local lineColor = config.lineColor or { 220, 220, 220 }
+    local textColor = config.textColor or { 0, 0, 0 }
+    local highlight = config.highlight or { 0x19, 0xAE, 0xFF }
+
+    local button_pressed = resources .. 'button_pressed.png'
+    local button_focused = resources .. 'button_focused.png'
+    local button_hovered = resources .. 'button_hovered.png'
+    local button = resources .. 'button.png'
+
+    local check_checked_pressed = resources .. 'check_checked_pressed.png'
+    local check_unchecked_pressed = resources .. 'check_unchecked_pressed.png'
+    local check_checked_focused = resources .. 'check_checked_focused.png'
+    local check_unchecked_focused = resources .. 'check_unchecked_focused.png'
+    local check_checked = resources .. 'check_checked.png'
+    local check_unchecked = resources .. 'check_unchecked.png'
+
+    local radio_checked_pressed = resources .. 'radio_checked_pressed.png'
+    local radio_unchecked_pressed = resources .. 'radio_unchecked_pressed.png'
+    local radio_checked_focused = resources .. 'radio_checked_focused.png'
+    local radio_unchecked_focused = resources .. 'radio_unchecked_focused.png'
+    local radio_checked = resources .. 'radio_checked.png'
+    local radio_unchecked = resources .. 'radio_unchecked.png'
+
+    local triangle_left = resources .. 'triangle_left.png'
+    local triangle_up = resources .. 'triangle_up.png'
+    local triangle_right = resources .. 'triangle_right.png'
+    local triangle_down = resources .. 'triangle_down.png'
+
+    local text_focused = resources .. 'text_focused.png'
+    local text = resources .. 'text.png'
+
+    local function getButtonSlices (self)
+        return self.pressed.left and button_pressed
+            or self.focused and button_focused
+            or self.hovered and button_hovered
+            or button
+    end
+
+    local function getCheckIcon (self)
+        if self.pressed.left then
+            return self.value and check_checked_pressed
+                or check_unchecked_pressed
+        end
+        if self.focused then
+            return self.value and check_checked_focused
+                or check_unchecked_focused
+        end
+        return self.value and check_checked or check_unchecked
+    end
+
+    local function getControlHeight (self)
+        return self.flow == 'x' and self._defaultDimension
+    end
+
+    local function getControlWidth (self)
+        return self.flow ~= 'x' and self._defaultDimension
+    end
+
+    local function getMenuItemBackground (self)
+        return self.active and highlight
+    end
+
+    local function getRadioIcon (self)
+        if self.pressed.left then
+            return self.value and radio_checked_pressed
+                or radio_unchecked_pressed
+        end
+        if self.focused then
+            return self.value and radio_checked_focused
+                or radio_unchecked_focused
+        end
+        return self.value and radio_checked or radio_unchecked
+    end
+
+    local function getSashBackground (self)
+        return self.hovered and highlight or lineColor
+    end
+
+    local function getSashHeight (self)
+        return self.parent and self.parent.flow ~= 'x' and 4
+    end
+
+    local function getSashWidth (self)
+        return self.parent and self.parent.flow == 'x' and 4
+    end
+
+    local function getSliderThumbWidth (self)
+        return self.parent.flow == 'x' and 32 or false
+    end
+
+    local function getSliderThumbHeight (self)
+        return self.parent.flow ~= 'x' and 32 or false
+    end
+
+    local function getStepperBeforeIcon (self)
+        return self.parent.flow == 'x' and triangle_left or triangle_up
+    end
+
+    local function getStepperAfterIcon (self)
+        return self.parent.flow == 'x' and triangle_right or triangle_down
+    end
+
+    local function getTextSlices (self)
+        return self.focused and text_focused or text
+    end
+
+    return {
+
+        -- generic types for widgets to inherit
+
+        Control = {
+            flow = 'x',
+            height = getControlHeight,
+            width = getControlWidth,
+            color = textColor,
+            align = 'center middle',
+            margin = 2,
+            color = textColor,
+            solid = true,
+            _defaultDimension = 36,
+        },
+
+        Line = {
+            margin = 0,
+            padding = 4,
+            align = 'left middle',
+            _defaultDimension = 24,
+        },
+
+        -- widget types
+
+        button = {
+            type = { 'Control' },
+            padding = 6,
+            slices = getButtonSlices,
+            focusable = true,
+        },
+        check = {
+            type = { 'Line', 'Control' },
+            focusable = true,
+            icon = getCheckIcon,
+        },
+        label = {
+            type = { 'Line', 'Control' },
+        },
+        menu = {
+            flow = 'x',
+            height = 24,
+            background = backColor,
+            color = textColor,
+        },
+        ['menu.expander'] = {
+            icon = resources .. 'triangle_right.png',
+        },
+        ['menu.item'] = {
+            padding = 4,
+            height = 24,
+            align = 'left middle',
+            background = getMenuItemBackground,
+        },
+        panel = {
+            padding = 2,
+            background = backColor,
+            color = textColor,
+            solid = true,
+        },
+        progress = {
+            type = { 'Control' },
+            slices = resources .. 'button_pressed.png',
+        },
+        ['progress.bar'] = {
+            slices = resources .. 'progress.png',
+            minwidth = 12,
+            minheight = 22,
+        },
+        radio = {
+            type = { 'Line', 'Control' },
+            focusable = true,
+            icon = getRadioIcon,
+        },
+        sash = {
+            background = getSashBackground,
+            height = getSashHeight,
+            width = getSashWidth,
+        },
+        slider = {
+            type = { 'Control' },
+            slices = resources .. 'button_pressed.png',
+        },
+        ['slider.thumb'] = {
+            type = { 'button' },
+            align = 'middle center',
+            margin = 0,
+            width = getSliderThumbWidth,
+            height = getSliderThumbHeight,
+        },
+        status = {
+            type = { 'Line', 'Control' },
+            background = backColor,
+            color = textColor,
+        },
+        stepper = {
+            type = { 'Control' },
+            slices = resources .. 'button_pressed.png',
+        },
+        ['stepper.after'] = {
+            type = { 'button' },
+            icon = getStepperAfterIcon,
+            margin = 0,
+            minwidth = 32,
+            minheight = 32,
+        },
+        ['stepper.before'] = {
+            type = { 'button' },
+            icon = getStepperBeforeIcon,
+            margin = 0,
+            minwidth = 32,
+            minheight = 32,
+        },
+        ['stepper.item'] = {
+            align = 'center middle',
+            color = textColor,
+        },
+        ['stepper.view'] = {
+            margin = 4,
+        },
+        submenu = {
+            padding = 10,
+            margin = -10,
+            slices = resources .. 'submenu.png',
+            color = textColor,
+            solid = true,
+        },
+        text = {
+            type = { 'Control' },
+            align = 'left middle',
+            slices = getTextSlices,
+            padding = 6,
+            focusable = true,
+            cursor = 'ibeam',
+            highlight = highlight,
+        },
+    }
+
+end

luigi/painter.lua

@@ -190,6 +190,7 @@ function Painter:paintIconAndText ()
     -- draw the text
     if text and textX and textY and w > 1 then
         widget.innerHeight = textY - y + widget.textData:getHeight()
+        widget.innerWidth = textX - x + widget.textData:getWidth()
         textX = math.floor(textX - (widget.scrollX or 0))
         textY = math.floor(textY - (widget.scrollY or 0))
         Backend.draw(widget.textData, textX, textY)
@@ -210,7 +211,7 @@ function Painter:paint ()
 
     -- if the drawable area has no width or height, don't paint
     if w < 1 or h < 1 then return end
-    
+
     Event.PreDisplay:emit(widget, { target = widget }, function()
 
         Backend.push()

luigi/theme/dark.lua

@@ -1,5 +1,5 @@
 local RESOURCE = (...):gsub('%.', '/') .. '/'
-local REL = (...):gsub('[^.]*$', '')
+local ROOT = (...):gsub('[^.]*.[^.]*$', '')
 
 return function (config)
     config = config or {}
@@ -8,5 +8,5 @@ return function (config)
     config.lineColor = config.lineColor or { 60, 60, 60 }
     config.textColor = config.textColor or { 240, 240, 240 }
     config.highlight = config.highlight or { 0x00, 0x5c, 0x94 }
-    return require(REL .. 'light')(config)
+    return require(ROOT .. 'engine.alpha')(config)
 end

luigi/theme/light-big.lua

@@ -0,0 +1,13 @@
+local RESOURCE = (...):gsub('%.', '/') .. '/'
+local ROOT = (...):gsub('[^.]*.[^.]*$', '')
+
+return function (config)
+    local theme = require(ROOT .. 'theme.light')()
+    theme.Control._defaultDimension = 44
+    theme.Line._defaultDimension = 32
+    theme.menu.height = 32
+    theme['menu.item'].height = 32
+    theme['menu.item'].padding = 8
+    theme.panel.padding = 8
+    return theme
+end

luigi/theme/light.lua

@@ -1,250 +1,12 @@
 local RESOURCE = (...):gsub('%.', '/') .. '/'
+local ROOT = (...):gsub('[^.]*.[^.]*$', '')
 
 return function (config)
     config = config or {}
-    local resources = config.resources or RESOURCE
+    config.resources = config.resources or RESOURCE
-    local backColor = config.backColor or { 240, 240, 240 }
+    config.backColor = config.backColor or { 240, 240, 240 }
-    local lineColor = config.lineColor or { 220, 220, 220 }
+    config.lineColor = config.lineColor or { 220, 220, 220 }
-    local textColor = config.textColor or { 0, 0, 0 }
+    config.textColor = config.textColor or { 0, 0, 0 }
-    local highlight = config.highlight or { 0x19, 0xAE, 0xFF }
+    config.highlight = config.highlight or { 0x19, 0xAE, 0xFF }
-
+    return require(ROOT .. 'engine.alpha')(config)
-    local button_pressed = resources .. 'button_pressed.png'
-    local button_focused = resources .. 'button_focused.png'
-    local button_hovered = resources .. 'button_hovered.png'
-    local button = resources .. 'button.png'
-
-    local check_checked_pressed = resources .. 'check_checked_pressed.png'
-    local check_unchecked_pressed = resources .. 'check_unchecked_pressed.png'
-    local check_checked_focused = resources .. 'check_checked_focused.png'
-    local check_unchecked_focused = resources .. 'check_unchecked_focused.png'
-    local check_checked = resources .. 'check_checked.png'
-    local check_unchecked = resources .. 'check_unchecked.png'
-
-    local radio_checked_pressed = resources .. 'radio_checked_pressed.png'
-    local radio_unchecked_pressed = resources .. 'radio_unchecked_pressed.png'
-    local radio_checked_focused = resources .. 'radio_checked_focused.png'
-    local radio_unchecked_focused = resources .. 'radio_unchecked_focused.png'
-    local radio_checked = resources .. 'radio_checked.png'
-    local radio_unchecked = resources .. 'radio_unchecked.png'
-
-    local triangle_left = resources .. 'triangle_left.png'
-    local triangle_up = resources .. 'triangle_up.png'
-    local triangle_right = resources .. 'triangle_right.png'
-    local triangle_down = resources .. 'triangle_down.png'
-
-    local text_focused = resources .. 'text_focused.png'
-    local text = resources .. 'text.png'
-
-    local function getButtonSlices (self)
-        return self.pressed.left and button_pressed
-            or self.focused and button_focused
-            or self.hovered and button_hovered
-            or button
-    end
-
-    local function getCheckIcon (self)
-        if self.pressed.left then
-            return self.value and check_checked_pressed
-                or check_unchecked_pressed
-        end
-        if self.focused then
-            return self.value and check_checked_focused
-                or check_unchecked_focused
-        end
-        return self.value and check_checked or check_unchecked
-    end
-
-    local function getControlHeight (self)
-        return self.flow == 'x' and self._defaultDimension
-    end
-
-    local function getControlWidth (self)
-        return self.flow ~= 'x' and self._defaultDimension
-    end
-
-    local function getMenuItemBackground (self)
-        return self.active and highlight
-    end
-
-    local function getRadioIcon (self)
-        if self.pressed.left then
-            return self.value and radio_checked_pressed
-                or radio_unchecked_pressed
-        end
-        if self.focused then
-            return self.value and radio_checked_focused
-                or radio_unchecked_focused
-        end
-        return self.value and radio_checked or radio_unchecked
-    end
-
-    local function getSashBackground (self)
-        return self.hovered and highlight or lineColor
-    end
-
-    local function getSashHeight (self)
-        return self.parent and self.parent.flow ~= 'x' and 4
-    end
-
-    local function getSashWidth (self)
-        return self.parent and self.parent.flow == 'x' and 4
-    end
-
-    local function getSliderThumbWidth (self)
-        return self.parent.flow == 'x' and 32 or false
-    end
-    
-    local function getSliderThumbHeight (self)
-        return self.parent.flow ~= 'x' and 32 or false
-    end
-    
-    local function getStepperBeforeIcon (self)
-        return self.parent.flow == 'x' and triangle_left or triangle_up
-    end
-
-    local function getStepperAfterIcon (self)
-        return self.parent.flow == 'x' and triangle_right or triangle_down
-    end
-
-    local function getTextSlices (self)
-        return self.focused and text_focused or text
-    end
-
-    return {
-
-        -- generic types for widgets to inherit
-
-        Control = {
-            flow = 'x',
-            height = getControlHeight,
-            width = getControlWidth,
-            color = textColor,
-            align = 'center middle',
-            margin = 2,
-            color = textColor,
-            solid = true,
-            _defaultDimension = 36,
-        },
-
-        Line = {
-            margin = 0,
-            padding = 4,
-            align = 'left middle',
-            _defaultDimension = 24,
-        },
-
-        -- widget types
-
-        button = {
-            type = { 'Control' },
-            padding = 6,
-            slices = getButtonSlices,
-            focusable = true,
-        },
-        check = {
-            type = { 'Line', 'Control' },
-            focusable = true,
-            icon = getCheckIcon,
-        },
-        label = {
-            type = { 'Line', 'Control' },
-        },
-        menu = {
-            flow = 'x',
-            height = 24,
-            background = backColor,
-            color = textColor,
-        },
-        ['menu.expander'] = {
-            icon = resources .. 'triangle_right.png',
-        },
-        ['menu.item'] = {
-            padding = 4,
-            align = 'left middle',
-            background = getMenuItemBackground,
-        },
-        panel = {
-            padding = 2,
-            background = backColor,
-            color = textColor,
-            solid = true,
-        },
-        progress = {
-            type = { 'Control' },
-            slices = resources .. 'button_pressed.png',
-        },
-        ['progress.bar'] = {
-            slices = resources .. 'progress.png',
-            minwidth = 12,
-            minheight = 22,
-        },
-        radio = {
-            type = { 'Line', 'Control' },
-            focusable = true,
-            icon = getRadioIcon,
-        },
-        sash = {
-            background = getSashBackground,
-            height = getSashHeight,
-            width = getSashWidth,
-        },
-        slider = {
-            type = { 'Control' },
-            slices = resources .. 'button_pressed.png',
-        },
-        ['slider.thumb'] = {
-            type = { 'button' },
-            align = 'middle center',
-            margin = 0,
-            width = getSliderThumbWidth,
-            height = getSliderThumbHeight,
-        },
-        status = {
-            type = { 'Line', 'Control' },
-            background = backColor,
-            color = textColor,
-        },
-        stepper = {
-            type = { 'Control' },
-            slices = resources .. 'button_pressed.png',
-        },
-        ['stepper.after'] = {
-            type = { 'button' },
-            icon = getStepperAfterIcon,
-            margin = 0,
-            minwidth = 32,
-            minheight = 32,
-        },
-        ['stepper.before'] = {
-            type = { 'button' },
-            icon = getStepperBeforeIcon,
-            margin = 0,
-            minwidth = 32,
-            minheight = 32,
-        },
-        ['stepper.item'] = {
-            align = 'center middle',
-            color = textColor,
-        },
-        ['stepper.view'] = {
-            margin = 4,
-        },
-        submenu = {
-            padding = 10,
-            margin = -10,
-            slices = resources .. 'submenu.png',
-            color = textColor,
-            solid = true,
-        },
-        text = {
-            type = { 'Control' },
-            align = 'left middle',
-            slices = getTextSlices,
-            padding = 6,
-            focusable = true,
-            cursor = 'ibeam',
-            highlight = highlight,
-        },
-    }
-
 end

luigi/widget/menu/item.lua

@@ -179,7 +179,6 @@ local function initialize (self)
         else
             shortcut = Shortcut.stringify(shortcut)
         end
-        self.height = font:getLineHeight() + pad * 2
         self.flow = 'x'
         self:addChild { icon = icon, width = self.height }
         self:addChild { text = text, width = textWidth }
@@ -197,7 +196,9 @@ local function initialize (self)
         self.icon = nil
         self.text = nil
     else
-        self.width = textWidth
+        -- top level menu
+        self.width = textWidth + pad * 2
+        self.align = 'middle center'
     end
 end