WIP: Getting styles from lua

7 files changed, 50 insertions, 24 deletions

diff --git a/lua/browser.lua b/lua/browser.lua
index a7f0c336..e174a05d 100644
--- a/lua/browser.lua
+++ b/lua/browser.lua
@@ -4,7 +4,7 @@ local backstack = require("backstack")
 local font = require("font")
 local queue = require("queue")
 local playing = require("playing")
-local theme = require("theme")
+local styles = require("styles")
 local playback = require("playback")
 
 local browser = {}
@@ -90,7 +90,7 @@ function browser.create(opts)
 
   local back = screen.list:add_btn(nil, "< Back")
   back:onClicked(backstack.pop)
-  back:add_style(theme.list_item)
+  back:add_style(styles.list_item)
 
   screen.focused_item = 0
   screen.last_item = 0
@@ -122,7 +122,7 @@ function browser.create(opts)
         screen.add_item(opts.iterator())
       end
     end)
-    btn:add_style(theme.list_item)
+    btn:add_style(styles.list_item)
   end
 
   for _ = 1, 8 do
diff --git a/lua/licenses.lua b/lua/licenses.lua
index 83437454..b5d1ae88 100644
--- a/lua/licenses.lua
+++ b/lua/licenses.lua
@@ -1,7 +1,7 @@
 local backstack = require("backstack")
 local widgets = require("widgets")
 local font = require("font")
-local theme = require("theme")
+local styles = require("styles")
 
 local function show_license(text)
   backstack.push(function()
@@ -100,7 +100,7 @@ return function()
       w = lvgl.PCT(100),
       h = lvgl.SIZE_CONTENT,
     }
-    row:add_style(theme.list_item)
+    row:add_style(styles.list_item)
     row:Label { text = name, flex_grow = 1 }
     local button = row:Button {}
     button:Label { text = license, text_font = font.fusion_10 }
diff --git a/lua/main.lua b/lua/main.lua
index 5cbbf0a6..5cfba47b 100644
--- a/lua/main.lua
+++ b/lua/main.lua
@@ -1,5 +1,6 @@
 local font = require("font")
 local vol = require("volume")
+local theme = require("theme")
 
 -- Set up property bindings that are used across every screen.
 GLOBAL_BINDINGS = {
@@ -34,6 +35,31 @@ GLOBAL_BINDINGS = {
   end),
 }
 
+local lvgl = require("lvgl")
+local my_theme = {
+  base = {
+    {lvgl.PART.MAIN, lvgl.Style {
+      bg_opa = lvgl.OPA(0),
+      text_font = font.fusion_12,
+      text_color = "#ff0000", -- Red to check it applies
+    }},
+    {lvgl.STATE.FOCUSED, lvgl.Style {
+      bg_opa = lvgl.OPA(100),
+      bg_color = "#0000ff", -- ew
+      text_color = "#ff0000", -- Red to check it applies
+    }},
+  },
+  button = {
+    {lvgl.STATE.FOCUSED, lvgl.Style {
+      bg_color = "#00ff00",
+    }},
+    {lvgl.PART.MAIN, lvgl.Style {
+      bg_color = "#00ff00",
+    }},
+  },
+}
+theme.set(my_theme)
+
 local backstack = require("backstack")
 local main_menu = require("main_menu")
 
diff --git a/lua/main_menu.lua b/lua/main_menu.lua
index 1311f8ea..1a9d9975 100644
--- a/lua/main_menu.lua
+++ b/lua/main_menu.lua
@@ -4,7 +4,7 @@ local database = require("database")
 local backstack = require("backstack")
 local browser = require("browser")
 local playing = require("playing")
-local theme = require("theme")
+local styles = require("styles")
 
 return function()
   local menu = widgets.MenuScreen({})
@@ -19,7 +19,7 @@ return function()
   now_playing:onClicked(function()
     backstack.push(playing)
   end)
-  now_playing:add_style(theme.list_item)
+  now_playing:add_style(styles.list_item)
 
   local indexes = database.indexes()
   for _, idx in ipairs(indexes) do
@@ -32,14 +32,14 @@ return function()
         }
       end)
     end)
-    btn:add_style(theme.list_item)
+    btn:add_style(styles.list_item)
   end
 
   local settings = menu.list:add_btn(nil, "Settings")
   settings:onClicked(function()
     backstack.push(require("settings").root)
   end)
-  settings:add_style(theme.list_item)
+  settings:add_style(styles.list_item)
 
   return menu
 end
diff --git a/lua/settings.lua b/lua/settings.lua
index 952292e4..cb726a2a 100644
--- a/lua/settings.lua
+++ b/lua/settings.lua
@@ -1,7 +1,7 @@
 local lvgl = require("lvgl")
 local backstack = require("backstack")
 local widgets = require("widgets")
-local theme = require("theme")
+local styles = require("styles")
 local volume = require("volume")
 local display = require("display")
 local controls = require("controls")
@@ -55,7 +55,7 @@ function settings.bluetooth()
   menu.content:Label {
     text = "Paired Device",
     pad_bottom = 1,
-  }:add_style(theme.settings_title)
+  }:add_style(styles.settings_title)
 
   local paired_container = menu.content:Object {
     flex = {
@@ -81,7 +81,7 @@ function settings.bluetooth()
   menu.content:Label {
     text = "Nearby Devices",
     pad_bottom = 1,
-  }:add_style(theme.settings_title)
+  }:add_style(styles.settings_title)
 
   local devices = menu.content:List {
     w = lvgl.PCT(100),
@@ -121,7 +121,7 @@ function settings.headphones()
 
   menu.content:Label {
     text = "Maximum volume limit",
-  }:add_style(theme.settings_title)
+  }:add_style(styles.settings_title)
 
   local volume_chooser = menu.content:Dropdown {
     options = "Line Level (-10 dB)\nCD Level (+6 dB)\nMaximum (+10dB)",
@@ -136,7 +136,7 @@ function settings.headphones()
 
   menu.content:Label {
     text = "Left/Right balance",
-  }:add_style(theme.settings_title)
+  }:add_style(styles.settings_title)
 
   local balance = menu.content:Slider {
     w = lvgl.PCT(100),
@@ -194,7 +194,7 @@ function settings.display()
   }
   brightness_title:Label { text = "Brightness", flex_grow = 1 }
   local brightness_pct = brightness_title:Label {}
-  brightness_pct:add_style(theme.settings_title)
+  brightness_pct:add_style(styles.settings_title)
 
   local brightness = menu.content:Slider {
     w = lvgl.PCT(100),
@@ -220,7 +220,7 @@ function settings.input()
 
   menu.content:Label {
     text = "Control scheme",
-  }:add_style(theme.settings_title)
+  }:add_style(styles.settings_title)
 
   local schemes = controls.schemes()
   local option_to_scheme = {}
@@ -258,7 +258,7 @@ function settings.input()
 
   menu.content:Label {
     text = "Scroll Sensitivity",
-  }:add_style(theme.settings_title)
+  }:add_style(styles.settings_title)
 
   local slider_scale = 4; -- Power steering
   local sensitivity = menu.content:Slider {
@@ -292,7 +292,7 @@ function settings.database()
     pad_top = 4,
     pad_column = 4,
   }
-  actions_container:add_style(theme.list_item)
+  actions_container:add_style(styles.list_item)
 
   local update = actions_container:Button {}
   update:Label { text = "Update" }
@@ -321,7 +321,7 @@ function settings.root()
   }
 
   local function section(name)
-    menu.list:add_text(name):add_style(theme.list_heading)
+    menu.list:add_text(name):add_style(styles.list_heading)
   end
 
   local function submenu(name, fn)
@@ -329,7 +329,7 @@ function settings.root()
     item:onClicked(function()
       backstack.push(fn)
     end)
-    item:add_style(theme.list_item)
+    item:add_style(styles.list_item)
   end
 
   section("Audio")
diff --git a/lua/theme.lua b/lua/styles.lua
index 9c808946..76ecad2a 100644
--- a/lua/theme.lua
+++ b/lua/styles.lua
@@ -1,7 +1,7 @@
 local lvgl = require("lvgl")
 local font = require("font")
 
-local theme = {
+local styles = {
   list_item = lvgl.Style {
     pad_left = 4,
     pad_right = 4,
@@ -20,4 +20,4 @@ local theme = {
   }
 }
 
-return theme
+return styles
diff --git a/lua/widgets.lua b/lua/widgets.lua
index 8905fa43..8253041b 100644
--- a/lua/widgets.lua
+++ b/lua/widgets.lua
@@ -3,7 +3,7 @@ local power = require("power")
 local bluetooth = require("bluetooth")
 local font = require("font")
 local backstack = require("backstack")
-local theme = require("theme")
+local styles = require("styles")
 local database = require("database")
 
 local widgets = {}
@@ -41,7 +41,7 @@ function widgets.Row(parent, left, right)
     w = lvgl.PCT(100),
     h = lvgl.SIZE_CONTENT,
   }
-  container:add_style(theme.list_item)
+  container:add_style(styles.list_item)
   container:Label { text = left, flex_grow = 1 }
   container:Label { text = right }
 end