From 2feeddc1be525342eeeb66762d582987809a5f1d Mon Sep 17 00:00:00 2001 From: jmug Date: Fri, 25 Apr 2025 17:18:53 -0700 Subject: [PATCH] Functional mode switch that flips the theme on click. Signed-off-by: jmug --- include/mode_switch.h | 3 ++ include/theme.h | 2 ++ src/main.c | 4 ++- src/mode_switch.c | 77 +++++++++++++++++++++++++++++++++++++++++++ src/theme.c | 7 ++++ 5 files changed, 92 insertions(+), 1 deletion(-) create mode 100644 include/mode_switch.h create mode 100644 src/mode_switch.c diff --git a/include/mode_switch.h b/include/mode_switch.h new file mode 100644 index 0000000..da5cfd8 --- /dev/null +++ b/include/mode_switch.h @@ -0,0 +1,3 @@ +#pragma once + +void RenderModeSwitch(); diff --git a/include/theme.h b/include/theme.h index 4fb9a99..7904da8 100644 --- a/include/theme.h +++ b/include/theme.h @@ -9,9 +9,11 @@ enum Theme_Mode { struct Theme_t { Clay_Color backgroundColor; + Clay_Color foregroundColor; Clay_Color textColor; Clay_Color textShadowColor; }; void setThemeMode(enum Theme_Mode m); +enum Theme_Mode getThemeMode(); struct Theme_t getCurrentTheme(); diff --git a/src/main.c b/src/main.c index dbd277e..0cfeeb4 100644 --- a/src/main.c +++ b/src/main.c @@ -9,6 +9,7 @@ #include "clock.h" #include "theme.h" +#include "mode_switch.h" #define RAYLIB_VECTOR2_TO_CLAY_VECTOR2(vector) (Clay_Vector2) { .x = vector.x, .y = vector.y } @@ -43,6 +44,7 @@ Clay_RenderCommandArray CreateLayout() { } }) { RenderClock(520, timeinfo->tm_hour, timeinfo->tm_min, timeinfo->tm_sec % 2 == 0); + RenderModeSwitch(); } return Clay_EndLayout(); } @@ -77,7 +79,7 @@ int main(void) Clay_Raylib_Initialize(GetScreenWidth(), GetScreenHeight(), "PiAlarm", FLAG_VSYNC_HINT | FLAG_FULLSCREEN_MODE | FLAG_MSAA_4X_HINT); HideCursor(); - setThemeMode(DARK_MODE); + setThemeMode(LIGHT_MODE); while (!WindowShouldClose()) { UpdateDrawFrame(NULL); diff --git a/src/mode_switch.c b/src/mode_switch.c new file mode 100644 index 0000000..7807daf --- /dev/null +++ b/src/mode_switch.c @@ -0,0 +1,77 @@ +#include "clay.h" +#include "theme.h" +#include "mode_switch.h" +#include "util.h" +#include + +void handleModeSwitch(Clay_ElementId elementId, Clay_PointerData pointerData, intptr_t userData) { + if (pointerData.state == CLAY_POINTER_DATA_PRESSED_THIS_FRAME) { + enum Theme_Mode cm = getThemeMode(); + if (cm == LIGHT_MODE) { + setThemeMode(DARK_MODE); + } else { + setThemeMode(LIGHT_MODE); + } + } +} + +void RenderModeSwitch() { + Clay_Color bgC = getCurrentTheme().backgroundColor; + Clay_Color fgC = getCurrentTheme().foregroundColor; + + float width = 126; + float height = 36; + float cornerRadius = 18; + float borderWidth = 3; + + CLAY({ + .layout = { + .sizing = { + .width = width, + .height = height, + }, + .layoutDirection = CLAY_LEFT_TO_RIGHT, + }, + .cornerRadius = CLAY_CORNER_RADIUS(cornerRadius), + .border = { + .color = fgC, + .width = {.left = borderWidth, .right = borderWidth, .top = borderWidth, .bottom = borderWidth}, + }, + }) { + Clay_OnHover(handleModeSwitch, 0); + ExpandedSpacer(); + CLAY({ + .backgroundColor = bgC, + .layout = { + .sizing = { + .width = (width - height) / 2, + .height = CLAY_SIZING_GROW(), + } + }, + }) {} + CLAY({ + .backgroundColor = fgC, + .layout = { + .sizing = { + .width = (width - height) / 2, + .height = CLAY_SIZING_GROW(), + } + }, + }) {} + ExpandedSpacer(); + CLAY({ + .backgroundColor = fgC, + .layout = { + .sizing = { + .width = height, + .height = height, + } + }, + .cornerRadius = CLAY_CORNER_RADIUS(height / 2), + .floating = { + .offset = { .x = width - height }, + .attachTo = CLAY_ATTACH_TO_PARENT, + }, + }) {} + } +} diff --git a/src/theme.c b/src/theme.c index b9541e9..76a186b 100644 --- a/src/theme.c +++ b/src/theme.c @@ -1,20 +1,27 @@ #include "theme.h" struct Theme_t currentTheme = {0}; +enum Theme_Mode currentThemeMode = LIGHT_MODE; // TODO: Load from a config file or set based on time. struct Theme_t lightModeTheme = { .backgroundColor = {255, 255, 255, 255}, + .foregroundColor = {0, 0, 0, 255}, .textColor = {0x17, 0x17, 0x17, 255}, .textShadowColor = {0xe6, 0xe6, 0xe6, 255}, }; struct Theme_t darkModeTheme = { .backgroundColor = {0, 0, 0, 255}, + .foregroundColor = {255, 255, 255, 255}, .textColor = {0xef, 0xef, 0xef, 255}, .textShadowColor = {0x27, 0x27, 0x27, 255}, }; +enum Theme_Mode getThemeMode() { + return currentThemeMode; +} void setThemeMode(enum Theme_Mode m) { + currentThemeMode = m; switch (m) { case LIGHT_MODE: currentTheme = lightModeTheme;