WIP: Getting styles from lua

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

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 }

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")
 

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

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")

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

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

src/lua/CMakeLists.txt

@@ -3,8 +3,8 @@
 # SPDX-License-Identifier: GPL-3.0-only
 
 idf_component_register(
-  SRCS "lua_thread.cpp" "bridge.cpp" "property.cpp" "lua_database.cpp"
+  SRCS "lua_theme.cpp" "lua_thread.cpp" "bridge.cpp" "property.cpp" "lua_database.cpp"
-  "lua_queue.cpp" "lua_version.cpp" "lua_controls.cpp" "registry.cpp"
+  "lua_queue.cpp" "lua_version.cpp" "lua_theme.cpp" "lua_controls.cpp" "registry.cpp"
   INCLUDE_DIRS "include"
   REQUIRES "drivers" "lvgl" "tinyfsm" "events" "system_fsm" "database"
   "esp_timer" "battery" "esp-idf-lua" "luavgl" "lua-linenoise" "lua-term"

src/lua/bridge.cpp

@@ -20,6 +20,7 @@
 #include "lua_database.hpp"
 #include "lua_queue.hpp"
 #include "lua_version.hpp"
+#include "lua_theme.hpp"
 #include "lvgl.h"
 
 #include "font/lv_font_loader.h"
@@ -84,6 +85,7 @@ auto Bridge::installBaseModules(lua_State* L) -> void {
   RegisterDatabaseModule(L);
   RegisterQueueModule(L);
   RegisterVersionModule(L);
+  RegisterThemeModule(L);
 }
 
 auto Bridge::installLvgl(lua_State* L) -> void {

src/lua/include/lua_theme.hpp

@@ -0,0 +1,15 @@
+/*
+ * Copyright 2024 ailurux <ailuruxx@gmail.com>
+ *
+ * SPDX-License-Identifier: GPL-3.0-only
+ */
+
+#pragma once
+
+#include "lua.hpp"
+
+namespace lua {
+
+auto RegisterThemeModule(lua_State*) -> void;
+
+}  // namespace lua

src/lua/lua_theme.cpp

@@ -0,0 +1,89 @@
+
+/*
+ * Copyright 2023 ailurux <ailuruxx@gmail.com>
+ *
+ * SPDX-License-Identifier: GPL-3.0-only
+ */
+
+#include "lua_version.hpp"
+
+#include <string>
+
+#include "bridge.hpp"
+#include "lua.hpp"
+
+#include "esp_app_desc.h"
+#include "esp_log.h"
+#include "lauxlib.h"
+#include "lua.h"
+#include "lua_thread.hpp"
+#include "luavgl.h"
+#include "themes.hpp"
+
+namespace lua {
+
+static auto set_theme(lua_State* L) -> int {
+  // lv_style_t* style = luavgl_to_style(L, -1);
+  // if (style == NULL) {
+  //   ESP_LOGI("DANIEL", "Style was null or malformed??");
+  //   return 0;
+  // }
+
+  // ESP_LOGI("DANIEL", "GOT ONE!");
+  // themes::Theme::instance()->...;
+
+  /* table is in the stack at index 't' */
+  std::string class_name;
+  lua_pushnil(L);  /* first key */
+  while (lua_next(L, -2) != 0) {
+    /* uses 'key' (at index -2) and 'value' (at index -1) */
+    if (lua_type(L, -2) == LUA_TSTRING) {
+      class_name = lua_tostring(L, -2);
+    }
+    if (lua_type(L, -1) == LUA_TTABLE) {
+      // Nesting
+      lua_pushnil(L); // First key
+      while (lua_next(L, -2) != 0) {
+        // Nesting the second
+        int selector = -1;
+        lv_style_t* style = NULL;
+        lua_pushnil(L); // First key
+        while (lua_next(L, -2) != 0) {
+          int idx = lua_tointeger(L, -2);
+          if (idx == 1) {
+            // Selector
+            selector = lua_tointeger(L, -1);
+          } else if (idx == 2) {
+            // Style
+            lv_style_t* style = luavgl_to_style(L, -1);
+            if (style == NULL) {
+              ESP_LOGI("DANIEL", "Style was null or malformed??");
+              return 0;
+            } else {
+              ESP_LOGI("DANIEL", "Got style for class %s with selector %d", class_name.c_str(), selector);
+            }
+          }
+          lua_pop(L, 1); 
+        }
+        lua_pop(L, 1); 
+      }
+    }
+    /* removes 'value'; keeps 'key' for next iteration */
+    lua_pop(L, 1);
+  }
+  return 0;
+}
+
+static const struct luaL_Reg kThemeFuncs[] = {{"set", set_theme}, {NULL, NULL}};
+
+static auto lua_theme(lua_State* L) -> int {
+  luaL_newlib(L, kThemeFuncs);
+  return 1;
+}
+
+auto RegisterThemeModule(lua_State* L) -> void {
+  luaL_requiref(L, "theme", lua_theme, true);
+  lua_pop(L, 1);
+}
+
+}  // namespace lua

src/ui/CMakeLists.txt

@@ -3,7 +3,7 @@
 # SPDX-License-Identifier: GPL-3.0-only
 
 idf_component_register(
-  SRCS "lvgl_task.cpp" "ui_fsm.cpp" "screen_splash.cpp" "encoder_input.cpp"
+  SRCS "themes copy.cpp" "lvgl_task.cpp" "ui_fsm.cpp" "screen_splash.cpp" "encoder_input.cpp"
   "themes.cpp" "screen.cpp" "modal.cpp"  "screen_lua.cpp"
   "splash.c" "font_fusion_12.c" "font_fusion_10.c"
   INCLUDE_DIRS "include"