From febc94a11b127fd9ebb4153c06c9289949ffaab9 Mon Sep 17 00:00:00 2001 From: spl3g Date: Fri, 10 Oct 2025 13:33:47 +0300 Subject: Move ui out to it's own file --- src/main.c | 101 +++---------------------------------------------------------- src/ui.c | 97 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ src/ui.h | 13 ++++++++ 3 files changed, 114 insertions(+), 97 deletions(-) create mode 100644 src/ui.c create mode 100644 src/ui.h diff --git a/src/main.c b/src/main.c index be84922..d40945b 100644 --- a/src/main.c +++ b/src/main.c @@ -8,6 +8,8 @@ #include #include +#include "ui.h" + #define CLAY_IMPLEMENTATION #include "clay/clay.h" #include "clay/renderers/clay_renderer_SDL3.c" @@ -19,9 +21,6 @@ static const int SCREEN_TICKS_PER_FRAME = 1000 / SCREEN_FPS; static const int FONT_ID = 0; -static const Clay_Color COLOR_BG = (Clay_Color){45, 53, 59, 255}; -static const Clay_Color COLOR_FG = (Clay_Color){211, 198, 170, 255}; - typedef struct { char key; float freq; @@ -170,85 +169,6 @@ SDL_AppResult SDL_AppInit(void **appstate, int argc, char **argv) { return SDL_APP_CONTINUE; } -void draw_white_key(size_t idx, bool pressed) { - Clay_Color fill_color; - Clay_Color border_color; - - if (pressed) { - fill_color = COLOR_BG; - border_color = COLOR_FG; - } else { - fill_color = COLOR_FG; - border_color = COLOR_FG; - } - CLAY(CLAY_IDI("white_key", idx), { - .layout = { - .sizing = {CLAY_SIZING_FIXED(40), .height = CLAY_SIZING_FIXED(100)}, - }, - .backgroundColor = fill_color, - .border = { .width = {1, 1, 1, 1, 0}, .color = border_color}, - }); -} - -void draw_black_key(size_t idx, bool pressed) { - Clay_Color fill_color; - Clay_Color border_color; - - if (pressed) { - fill_color = COLOR_FG; - border_color = COLOR_BG; - } else { - fill_color = COLOR_BG; - border_color = COLOR_FG; - } - CLAY(CLAY_IDI("black_key", idx), { - .layout = { - .sizing = {CLAY_SIZING_FIXED(25), .height = CLAY_SIZING_FIXED(65)}, - }, - - .floating = { - .attachTo = CLAY_ATTACH_TO_ELEMENT_WITH_ID, - .parentId = CLAY_IDI("white_key", idx - 1).id, - .attachPoints = { - .element = CLAY_ATTACH_POINT_CENTER_TOP, - .parent = CLAY_ATTACH_POINT_RIGHT_TOP, - }, - .offset = { - .y = -1, - }, - }, - - .backgroundColor = fill_color, - .border = { .width = {1, 1, 0, 1, 0}, .color = border_color}, - }); -} - -void draw_keyboard(bool *pressed_keys, size_t keys_amount) { - CLAY(CLAY_ID("keyboard"), { - .layout = { - .layoutDirection = CLAY_LEFT_TO_RIGHT, - }, - }) { - for (size_t i = 0; i < keys_amount; i++) { - bool pressed = pressed_keys[i]; - size_t key_idx = i % 12; - if (key_idx <= 4) { - if (i % 2 == 0) { - draw_white_key(i, pressed); - } else { - draw_black_key(i, pressed); - } - } else { - if (i % 2 == 0) { - draw_black_key(i, pressed); - } else { - draw_white_key(i, pressed); - } - } - } - } -} - SDL_AppResult SDL_AppIterate(void *appstate) { app_state *state = appstate; @@ -256,21 +176,8 @@ SDL_AppResult SDL_AppIterate(void *appstate) { Clay_BeginLayout(); - CLAY(CLAY_ID("OuterContainer"), { - .layout = { - .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0)}, - .padding = CLAY_PADDING_ALL(16), - .childGap = 16, - .childAlignment = { - .x = CLAY_ALIGN_X_CENTER, - .y = CLAY_ALIGN_Y_CENTER, - }, - }, - .backgroundColor = COLOR_BG, - }) { - draw_keyboard(state->last_keys, 12); - }; - + draw_ui(state->last_keys, 12); + Clay_RenderCommandArray render_commands = Clay_EndLayout(); SDL_SetRenderDrawColor(state->renderer_data.renderer, 0, 0, 0, 255); diff --git a/src/ui.c b/src/ui.c new file mode 100644 index 0000000..7c90099 --- /dev/null +++ b/src/ui.c @@ -0,0 +1,97 @@ +#include "ui.h" + +void draw_white_key(size_t idx, bool pressed) { + Clay_Color fill_color; + Clay_Color border_color; + + if (pressed) { + fill_color = COLOR_BG; + border_color = COLOR_FG; + } else { + fill_color = COLOR_FG; + border_color = COLOR_FG; + } + CLAY(CLAY_IDI("white_key", idx), { + .layout = { + .sizing = {CLAY_SIZING_FIXED(40), .height = CLAY_SIZING_FIXED(100)}, + }, + .backgroundColor = fill_color, + .border = { .width = {1, 1, 1, 1, 0}, .color = border_color}, + }); +} + +void draw_black_key(size_t idx, bool pressed) { + Clay_Color fill_color; + Clay_Color border_color; + + if (pressed) { + fill_color = COLOR_FG; + border_color = COLOR_BG; + } else { + fill_color = COLOR_BG; + border_color = COLOR_FG; + } + CLAY(CLAY_IDI("black_key", idx), { + .layout = { + .sizing = {CLAY_SIZING_FIXED(25), .height = CLAY_SIZING_FIXED(65)}, + }, + + .floating = { + .attachTo = CLAY_ATTACH_TO_ELEMENT_WITH_ID, + .parentId = CLAY_IDI("white_key", idx - 1).id, + .attachPoints = { + .element = CLAY_ATTACH_POINT_CENTER_TOP, + .parent = CLAY_ATTACH_POINT_RIGHT_TOP, + }, + .offset = { + .y = -1, + }, + }, + + .backgroundColor = fill_color, + .border = { .width = {1, 1, 0, 1, 0}, .color = border_color}, + }); +} + +void draw_keyboard(bool *pressed_keys, size_t keys_amount) { + CLAY(CLAY_ID("keyboard"), { + .layout = { + .layoutDirection = CLAY_LEFT_TO_RIGHT, + }, + }) { + for (size_t i = 0; i < keys_amount; i++) { + bool pressed = pressed_keys[i]; + size_t key_idx = i % 12; + if (key_idx <= 4) { + if (i % 2 == 0) { + draw_white_key(i, pressed); + } else { + draw_black_key(i, pressed); + } + } else { + if (i % 2 == 0) { + draw_black_key(i, pressed); + } else { + draw_white_key(i, pressed); + } + } + } + } +} + +void draw_ui(bool *pressed_keys, size_t keys_amount) { + CLAY(CLAY_ID("OuterContainer"), { + .layout = { + .sizing = {CLAY_SIZING_GROW(0), CLAY_SIZING_GROW(0)}, + .padding = CLAY_PADDING_ALL(16), + .childGap = 16, + .childAlignment = { + .x = CLAY_ALIGN_X_CENTER, + .y = CLAY_ALIGN_Y_CENTER, + }, + }, + .backgroundColor = COLOR_BG, + }) { + draw_keyboard(pressed_keys, keys_amount); + }; +} diff --git a/src/ui.h b/src/ui.h new file mode 100644 index 0000000..f190ad2 --- /dev/null +++ b/src/ui.h @@ -0,0 +1,13 @@ +#ifndef UI_H_ +#define UI_H_ + +#include +#include +#include "clay/clay.h" + +static const Clay_Color COLOR_BG = (Clay_Color){45, 53, 59, 255}; +static const Clay_Color COLOR_FG = (Clay_Color){211, 198, 170, 255}; + +void draw_ui(bool *pressed_keys, size_t keys_amount); + +#endif // UI_H_ -- cgit v1.2.3