From 0ad84c9fc7a7782cb2046c9697bf4a563cebade5 Mon Sep 17 00:00:00 2001 From: Krzosa Karol Date: Fri, 17 Jan 2025 10:59:35 +0100 Subject: [PATCH] new ui conception rect_cut+ryan memes --- src/core/core.h | 16 ++-- src/core/core_math.gen.c | 168 ++++++++++++++++++++++++++++++++++++++ src/core/core_math_gen.py | 42 ++++++++++ src/wasm_app/ui.c | 142 ++++++++++++++++++++++++++++---- src/wasm_app/ui.h | 42 +++++++--- 5 files changed, 378 insertions(+), 32 deletions(-) diff --git a/src/core/core.h b/src/core/core.h index 0f755f7..d5ff668 100644 --- a/src/core/core.h +++ b/src/core/core.h @@ -67,10 +67,14 @@ typedef double f64; #define defer_if(begin, cond_end) for (b32 PASTE(_i_, __LINE__) = !!begin; PASTE(_i_, __LINE__); PASTE(_i_, __LINE__) = (cond_end, 0)) #define defer_block(begin, end) for (i32 PASTE(_i_, __LINE__) = (begin, 0); !PASTE(_i_, __LINE__); PASTE(_i_, __LINE__) += (end, 1)) + #define stack_t(type, size) struct { type data[size]; i32 len; } -#define STACK_PUSH(stack, ...) (assert((stack).len < lengthof((stack).data)), (stack).data[(stack).len++] = __VA_ARGS__) -#define STACK_POP(stack) (assert((stack).len > 0), (stack).data[--(stack).len]) -#define STACK_TOP(stack) (assert((stack).len > 0), (stack).data[((stack).len-1)]) +#define STACK_CAP(stack) (lengthof((stack).data)) +#define STACK_EMPTY(stack) ((stack).len == 0) +#define STACK_FULL(stack) ((stack).len == STACK_CAP(stack)) +#define STACK_PUSH(stack, ...) (assert(!STACK_FULL(stack)), (stack).data[(stack).len++] = __VA_ARGS__) +#define STACK_POP(stack) (assert(!STACK_EMPTY(stack)), (stack).data[--(stack).len]) +#define STACK_TOP(stack) (assert(!STACK_EMPTY(stack)), (stack).data[((stack).len-1)]) #define STRINGIFY_(S) #S #define STRINGIFY(S) STRINGIFY_(S) @@ -89,11 +93,11 @@ typedef double f64; #endif #if PLATFORM_CL - #define fn_force_inline __forceinline + #define fn_inline __forceinline #elif PLATFORM_CLANG || PLATFORM_GCC - #define fn_force_inline __attribute__((always_inline)) + #define fn_inline __attribute__((always_inline)) #else - #define fn_force_inline + #define fn_inline #endif #ifndef FILE_AND_LINE_GCC_FORMAT diff --git a/src/core/core_math.gen.c b/src/core/core_math.gen.c index 47756d2..169fdc3 100644 --- a/src/core/core_math.gen.c +++ b/src/core/core_math.gen.c @@ -217,6 +217,48 @@ r2f32_t r2f32_cut_bottom(r2f32_t *r, f32 value) { /* Y is down */ return (r2f32_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; } +r2f32_t r2f32_cut_left_no_squash(r2f32_t *r, f32 value) { + f32 minx = r->min.x; + r->min.x = r->min.x + value; + return (r2f32_t){ .min = {.x = minx, .y = r->min.y}, .max = {.x = r->min.x, .y =r->max.y} }; +} +r2f32_t r2f32_cut_right_no_squash(r2f32_t *r, f32 value) { + f32 maxx = r->max.x; + r->max.x = r->max.x - value; + return (r2f32_t){ .min = {.x = r->max.x, .y = r->min.y}, .max = {.x = maxx, .y = r->max.y} }; +} +r2f32_t r2f32_cut_top_no_squash(r2f32_t *r, f32 value) { /* Y is down */ + f32 miny = r->min.y; + r->min.y = r->min.y + value; + return (r2f32_t){ .min = {.x = r->min.x, .y = miny}, .max = {.x = r->max.x, .y = r->min.y} }; +} +r2f32_t r2f32_cut_bottom_no_squash(r2f32_t *r, f32 value) { /* Y is down */ + f32 maxy = r->max.y; + r->max.y = r->max.y - value; + return (r2f32_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; +} + +r2f32_t r2f32_add_left(r2f32_t *r, f32 value) { + r2f32_t result = { .min = {r->min.x - value, r->min.y}, .max = {r->min.x, r->max.y} }; + r->min.x -= value; + return result; +} +r2f32_t r2f32_add_right(r2f32_t *r, f32 value) { + r2f32_t result = { .min = {r->max.x, r->min.y}, .max = {r->max.x + value, r->max.y} }; + r->max.x += value; + return result; +} +r2f32_t r2f32_add_top(r2f32_t *r, f32 value) { + r2f32_t result = { .min = {r->min.x, r->min.y - value}, .max = {r->max.x, r->min.y} }; + r->min.y -= value; + return result; +} +r2f32_t r2f32_add_bottom(r2f32_t *r, f32 value) { + r2f32_t result = { .min = {r->min.x, r->max.y}, .max = {r->max.x, r->max.y + value} }; + r->max.y += value; + return result; +} + // get past left r2f32_t r2f32_getp_left(const r2f32_t *rect, f32 value) { r2f32_t result = r2f32(rect->min.x - value, rect->min.y, rect->min.x, rect->max.y); @@ -285,6 +327,48 @@ r2f64_t r2f64_cut_bottom(r2f64_t *r, f64 value) { /* Y is down */ return (r2f64_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; } +r2f64_t r2f64_cut_left_no_squash(r2f64_t *r, f64 value) { + f64 minx = r->min.x; + r->min.x = r->min.x + value; + return (r2f64_t){ .min = {.x = minx, .y = r->min.y}, .max = {.x = r->min.x, .y =r->max.y} }; +} +r2f64_t r2f64_cut_right_no_squash(r2f64_t *r, f64 value) { + f64 maxx = r->max.x; + r->max.x = r->max.x - value; + return (r2f64_t){ .min = {.x = r->max.x, .y = r->min.y}, .max = {.x = maxx, .y = r->max.y} }; +} +r2f64_t r2f64_cut_top_no_squash(r2f64_t *r, f64 value) { /* Y is down */ + f64 miny = r->min.y; + r->min.y = r->min.y + value; + return (r2f64_t){ .min = {.x = r->min.x, .y = miny}, .max = {.x = r->max.x, .y = r->min.y} }; +} +r2f64_t r2f64_cut_bottom_no_squash(r2f64_t *r, f64 value) { /* Y is down */ + f64 maxy = r->max.y; + r->max.y = r->max.y - value; + return (r2f64_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; +} + +r2f64_t r2f64_add_left(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->min.x - value, r->min.y}, .max = {r->min.x, r->max.y} }; + r->min.x -= value; + return result; +} +r2f64_t r2f64_add_right(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->max.x, r->min.y}, .max = {r->max.x + value, r->max.y} }; + r->max.x += value; + return result; +} +r2f64_t r2f64_add_top(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->min.x, r->min.y - value}, .max = {r->max.x, r->min.y} }; + r->min.y -= value; + return result; +} +r2f64_t r2f64_add_bottom(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->min.x, r->max.y}, .max = {r->max.x, r->max.y + value} }; + r->max.y += value; + return result; +} + // get past left r2f64_t r2f64_getp_left(const r2f64_t *rect, f64 value) { r2f64_t result = r2f64(rect->min.x - value, rect->min.y, rect->min.x, rect->max.y); @@ -353,6 +437,48 @@ r2i32_t r2i32_cut_bottom(r2i32_t *r, i32 value) { /* Y is down */ return (r2i32_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; } +r2i32_t r2i32_cut_left_no_squash(r2i32_t *r, i32 value) { + i32 minx = r->min.x; + r->min.x = r->min.x + value; + return (r2i32_t){ .min = {.x = minx, .y = r->min.y}, .max = {.x = r->min.x, .y =r->max.y} }; +} +r2i32_t r2i32_cut_right_no_squash(r2i32_t *r, i32 value) { + i32 maxx = r->max.x; + r->max.x = r->max.x - value; + return (r2i32_t){ .min = {.x = r->max.x, .y = r->min.y}, .max = {.x = maxx, .y = r->max.y} }; +} +r2i32_t r2i32_cut_top_no_squash(r2i32_t *r, i32 value) { /* Y is down */ + i32 miny = r->min.y; + r->min.y = r->min.y + value; + return (r2i32_t){ .min = {.x = r->min.x, .y = miny}, .max = {.x = r->max.x, .y = r->min.y} }; +} +r2i32_t r2i32_cut_bottom_no_squash(r2i32_t *r, i32 value) { /* Y is down */ + i32 maxy = r->max.y; + r->max.y = r->max.y - value; + return (r2i32_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; +} + +r2i32_t r2i32_add_left(r2i32_t *r, i32 value) { + r2i32_t result = { .min = {r->min.x - value, r->min.y}, .max = {r->min.x, r->max.y} }; + r->min.x -= value; + return result; +} +r2i32_t r2i32_add_right(r2i32_t *r, i32 value) { + r2i32_t result = { .min = {r->max.x, r->min.y}, .max = {r->max.x + value, r->max.y} }; + r->max.x += value; + return result; +} +r2i32_t r2i32_add_top(r2i32_t *r, i32 value) { + r2i32_t result = { .min = {r->min.x, r->min.y - value}, .max = {r->max.x, r->min.y} }; + r->min.y -= value; + return result; +} +r2i32_t r2i32_add_bottom(r2i32_t *r, i32 value) { + r2i32_t result = { .min = {r->min.x, r->max.y}, .max = {r->max.x, r->max.y + value} }; + r->max.y += value; + return result; +} + // get past left r2i32_t r2i32_getp_left(const r2i32_t *rect, i32 value) { r2i32_t result = r2i32(rect->min.x - value, rect->min.y, rect->min.x, rect->max.y); @@ -421,6 +547,48 @@ r2i64_t r2i64_cut_bottom(r2i64_t *r, i64 value) { /* Y is down */ return (r2i64_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; } +r2i64_t r2i64_cut_left_no_squash(r2i64_t *r, i64 value) { + i64 minx = r->min.x; + r->min.x = r->min.x + value; + return (r2i64_t){ .min = {.x = minx, .y = r->min.y}, .max = {.x = r->min.x, .y =r->max.y} }; +} +r2i64_t r2i64_cut_right_no_squash(r2i64_t *r, i64 value) { + i64 maxx = r->max.x; + r->max.x = r->max.x - value; + return (r2i64_t){ .min = {.x = r->max.x, .y = r->min.y}, .max = {.x = maxx, .y = r->max.y} }; +} +r2i64_t r2i64_cut_top_no_squash(r2i64_t *r, i64 value) { /* Y is down */ + i64 miny = r->min.y; + r->min.y = r->min.y + value; + return (r2i64_t){ .min = {.x = r->min.x, .y = miny}, .max = {.x = r->max.x, .y = r->min.y} }; +} +r2i64_t r2i64_cut_bottom_no_squash(r2i64_t *r, i64 value) { /* Y is down */ + i64 maxy = r->max.y; + r->max.y = r->max.y - value; + return (r2i64_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; +} + +r2i64_t r2i64_add_left(r2i64_t *r, i64 value) { + r2i64_t result = { .min = {r->min.x - value, r->min.y}, .max = {r->min.x, r->max.y} }; + r->min.x -= value; + return result; +} +r2i64_t r2i64_add_right(r2i64_t *r, i64 value) { + r2i64_t result = { .min = {r->max.x, r->min.y}, .max = {r->max.x + value, r->max.y} }; + r->max.x += value; + return result; +} +r2i64_t r2i64_add_top(r2i64_t *r, i64 value) { + r2i64_t result = { .min = {r->min.x, r->min.y - value}, .max = {r->max.x, r->min.y} }; + r->min.y -= value; + return result; +} +r2i64_t r2i64_add_bottom(r2i64_t *r, i64 value) { + r2i64_t result = { .min = {r->min.x, r->max.y}, .max = {r->max.x, r->max.y + value} }; + r->max.y += value; + return result; +} + // get past left r2i64_t r2i64_getp_left(const r2i64_t *rect, i64 value) { r2i64_t result = r2i64(rect->min.x - value, rect->min.y, rect->min.x, rect->max.y); diff --git a/src/core/core_math_gen.py b/src/core/core_math_gen.py index 2f5c5d5..692a4e8 100644 --- a/src/core/core_math_gen.py +++ b/src/core/core_math_gen.py @@ -223,6 +223,48 @@ r2f64_t r2f64_cut_bottom(r2f64_t *r, f64 value) { /* Y is down */ return (r2f64_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; } +r2f64_t r2f64_cut_left_no_squash(r2f64_t *r, f64 value) { + f64 minx = r->min.x; + r->min.x = r->min.x + value; + return (r2f64_t){ .min = {.x = minx, .y = r->min.y}, .max = {.x = r->min.x, .y =r->max.y} }; +} +r2f64_t r2f64_cut_right_no_squash(r2f64_t *r, f64 value) { + f64 maxx = r->max.x; + r->max.x = r->max.x - value; + return (r2f64_t){ .min = {.x = r->max.x, .y = r->min.y}, .max = {.x = maxx, .y = r->max.y} }; +} +r2f64_t r2f64_cut_top_no_squash(r2f64_t *r, f64 value) { /* Y is down */ + f64 miny = r->min.y; + r->min.y = r->min.y + value; + return (r2f64_t){ .min = {.x = r->min.x, .y = miny}, .max = {.x = r->max.x, .y = r->min.y} }; +} +r2f64_t r2f64_cut_bottom_no_squash(r2f64_t *r, f64 value) { /* Y is down */ + f64 maxy = r->max.y; + r->max.y = r->max.y - value; + return (r2f64_t){ .min = {.x = r->min.x, .y = r->max.y}, .max = {.x = r->max.x, .y = maxy} }; +} + +r2f64_t r2f64_add_left(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->min.x - value, r->min.y}, .max = {r->min.x, r->max.y} }; + r->min.x -= value; + return result; +} +r2f64_t r2f64_add_right(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->max.x, r->min.y}, .max = {r->max.x + value, r->max.y} }; + r->max.x += value; + return result; +} +r2f64_t r2f64_add_top(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->min.x, r->min.y - value}, .max = {r->max.x, r->min.y} }; + r->min.y -= value; + return result; +} +r2f64_t r2f64_add_bottom(r2f64_t *r, f64 value) { + r2f64_t result = { .min = {r->min.x, r->max.y}, .max = {r->max.x, r->max.y + value} }; + r->max.y += value; + return result; +} + // get past left r2f64_t r2f64_getp_left(const r2f64_t *rect, f64 value) { r2f64_t result = r2f64(rect->min.x - value, rect->min.y, rect->min.x, rect->max.y); diff --git a/src/wasm_app/ui.c b/src/wasm_app/ui.c index 2577a6e..2f1e912 100644 --- a/src/wasm_app/ui.c +++ b/src/wasm_app/ui.c @@ -66,8 +66,17 @@ fn void ui_push_box(ui_box_t *parent, ui_box_t *box) { parent->node_count += 1; } -fn void ui_push_top(ui_box_t *new_top) { ui->top = new_top; } -fn void ui_pop_top(void) { ui->top = ui->top->parent; } +fn r2f32_t ui_next_rect(ui_op_t layout_op, r2f32_t *rect, v2f32_t required_size) { + switch (layout_op) { + case ui_op_cut_top: return r2f32_cut_top_no_squash(rect, required_size.y); break; + case ui_op_cut_bottom: return r2f32_cut_bottom_no_squash(rect, required_size.y); break; + case ui_op_cut_left: return r2f32_cut_left_no_squash(rect, required_size.x); break; + case ui_op_cut_right: return r2f32_cut_right_no_squash(rect, required_size.x); break; + case ui_op_idle: break; + default_is_invalid; + } + return (r2f32_t){0}; +} fn ui_box_t *ui_build_box_from_id(ui_code_loc_t loc, ui_box_flags_t flags, ui_id_t id) { ui_box_t *box = ui_find_box(id); @@ -86,6 +95,8 @@ fn ui_box_t *ui_build_box_from_id(ui_code_loc_t loc, ui_box_flags_t flags, ui_id box->id = id; box->flags = flags; ui_push_box(ui->top, box); + r2f32_t rect = ui_next_rect(ui->top->layout_op, &ui->top->rect, rn_measure_string(&rn_state.main_font, box->string)); + ui_set_rect(box, rect); return box; } @@ -96,12 +107,19 @@ fn ui_box_t *ui_build_box_from_string(ui_code_loc_t loc, ui_box_flags_t flags, s return box; } +#define ui_boxf(flags, ...) ui__boxf(UILOC, flags, __VA_ARGS__) +fn ui_box_t *ui__boxf(ui_code_loc_t loc, ui_box_flags_t flags, char *str, ...) { + S8_FMT(tcx.temp, str, string); + ui_box_t *box = ui_build_box_from_string(loc, flags, string); + return box; +} + fn ui_signal_t ui_signal_from_box(ui_box_t *box) { ui_signal_t result = {box}; app_event_t *ev = ui->event; b32 move = ev->kind == app_event_kind_mouse_move; - b32 inside = r2f32_contains(box->rect, ev->mouse_pos); + b32 inside = r2f32_contains(box->final_rect, ev->mouse_pos); if (ui_is_active_box(box)) { result.dragging = true; @@ -125,16 +143,39 @@ fn ui_signal_t ui_signal_from_box(ui_box_t *box) { return result; } -fn ui_signal_t ui_button(ui_code_loc_t loc, char *str, ...) { +#define ui_button(...) ui__button(UILOC, __VA_ARGS__) +fn ui_signal_t ui__button(ui_code_loc_t loc, char *str, ...) { S8_FMT(tcx.temp, str, string); ui_box_t *box = ui_build_box_from_string(loc, (ui_box_flags_t){ .draw_rect = true, .draw_text = true }, string); - { - box->full_rect = box->rect = r2f32_cut_top(&ui->top->rect, rn_state.main_font.size); - } ui_signal_t signal = ui_signal_from_box(box); return signal; } +#define ui_label(...) ui__label(UILOC, __VA_ARGS__) +fn ui_box_t *ui__label(ui_code_loc_t loc, char *str, ...) { + S8_FMT(tcx.temp, str, string); + ui_box_t *box = ui_build_box_from_string(loc, (ui_box_flags_t){ .draw_text = true }, string); + return box; +} + +#define ui_begin_expander(...) ui__begin_expander(UILOC, __VA_ARGS__) +fn ui_signal_t ui__begin_expander(ui_code_loc_t loc, char *str, ...) { + S8_FMT(tcx.temp, str, string); + ui_box_t *box = ui_build_box_from_string(loc, (ui_box_flags_t){ .draw_text = true }, string); + if (box->created_new) box->expanded = true; + ui_signal_t signal = ui_signal_from_box(box); + if (signal.clicked) box->expanded = !box->expanded; + signal.clicked = box->expanded; + if ( box->expanded) box->string = s8_printf(tcx.temp, "* %S", box->string); + if (!box->expanded) box->string = s8_printf(tcx.temp, "> %S", box->string); + if (box->expanded) r2f32_cut_left(&ui->top->rect, ui_em(0.5f)); + return signal; +} + +fn void ui_end_expander(void) { + r2f32_add_left(&ui->top->rect, ui_em(0.5f)); +} + fn void ui_begin_build(ui_code_loc_t loc, app_event_t *ev, r2f32_t window_rect) { ui->event = ev; @@ -167,10 +208,15 @@ fn void ui_end_build(void) { } } +fn r2f32_t window_rect_from_frame(app_frame_t *frame) { + r2f32_t window_rect = r2f32(0, 0, frame->window_size.x, frame->window_size.y); + return window_rect; +} + fn void ui_draw(app_frame_t *frame) { for (ui_preorder_iter_t it = ui_iterate_preorder(&ui->root); ui_preorder_iter_is_valid(it); ui_iter_advance_preorder(&it)) { ui_box_t *box = it.box; - r2f32_t clip_rect = box->rect; + box->final_rect = box->full_rect; v4f32_t rect_color = primary_color_global; v4f32_t text_color = black_color_global; @@ -183,15 +229,20 @@ fn void ui_draw(app_frame_t *frame) { text_color = accent1_color_global; } - rn_set_clip(clip_rect); if (box->flags.draw_rect) { - rn_draw_rect(box->rect, rect_color); + rn_draw_rect(box->full_rect, rect_color); } if (box->flags.draw_border) { - rn_draw_rect_border(box->rect, accent2_color_global); + rn_draw_rect_border(box->full_rect, accent2_color_global); } if (box->flags.draw_text) { - rn_draw_string(&rn_state.main_font, box->rect.min, text_color, box->string); + v2f32_t string_size = rn_measure_string(&rn_state.main_font, box->string); + v2f32_t rect_size = r2f32_get_size(box->full_rect); + v2f32_t rect_string_diff = v2f32_sub(rect_size, string_size); + v2f32_t center_pos = v2f32_divs(rect_string_diff, 2); + v2f32_t pos_in_rect = v2f32(box->full_rect.min.x, center_pos.y); + v2f32_t pos = v2f32_add(pos_in_rect, box->full_rect.min); + rn_draw_string(&rn_state.main_font, pos, text_color, box->string); } } } @@ -203,12 +254,75 @@ fn void ui_demo_init(ma_arena_t *arena) { fn void ui_demo_update(app_frame_t *frame) { for (app_event_t *ev = frame->first_event; ev; ev = ev->next) { - ui_begin_build(UILOC, ev, r2f32_mindim(v2f32(0.f, 0.f), frame->window_size)); - ui_button(UILOC, "thing itself##id32"); + ui_begin_build(UILOC, ev, window_rect_from_frame(frame)); + + ui->top->layout_op = ui_op_idle; + ui_box_t *scroller_box = ui_boxf((ui_box_flags_t){.draw_rect = true}, "scroller"); + ui_set_rect(scroller_box, r2f32_cut_right(&ui->top->rect, ui_em(1))); + + ui_box_t *item_box = ui_boxf((ui_box_flags_t){.draw_rect = true}, "item_box"); + ui_set_rect(item_box, r2f32_cut_left(&ui->top->rect, ui_max)); + + static f32 scroller_value; + defer_block(ui_push_top(item_box), ui_pop_top()) { + defer_if (ui_begin_expander("app_event_t").clicked, ui_end_expander()) { + for (int i = 0; i < 10; i += 1) { + ui_label("kind: app_event_kind_t##a%d", i); + ui_label("ctrl: b8##ds%d", i); + ui_label("shift: b8##f%d", i); + defer_if (ui_begin_expander("pos: v3f32_t##gg%d", i).clicked, ui_end_expander()) { + ui_label("x: f64 = value##hgt%d", i); + ui_label("y: f64 = value##r%d", i); + ui_label("z: f64 = value##yr%d", i); + } + defer_if (ui_begin_expander("mouse_pos: v2f32_t##i2%d", i).clicked, ui_end_expander()) { + ui_label("x: f64 = value##i3%d", i); + ui_label("y: f64 = value##i4%d", i); + } + } + } + } + + + defer_block(ui_push_top(scroller_box), ui_pop_top()) { + f32 item_count = (f32)item_box->node_count; + f32 all_items_size = item_count * rn_state.main_font.size; + f32 item_box_size = r2f32_get_size(ui->top->full_rect).y; + f32 scroller_box_size = r2f32_get_size(scroller_box->full_rect).y; + f32 scroller_size = CLAMP(item_box_size / all_items_size, 0, 1.0f); + f32 scrollable_space = (1 - scroller_size); + f32 scroller_norm = scroller_value / (all_items_size); + f32 scroller_percent = scroller_norm * scrollable_space; + f32 scroller_second = scrollable_space - scroller_percent; + + scroller_box->layout_op = ui_op_idle; + r2f32_cut_top(&ui->top->rect, scroller_percent * scroller_box_size); + ui_box_t *box = ui_build_box_from_id(UILOC, (ui_box_flags_t){.draw_border = true, .draw_rect = true}, ui_id_from_string(s8_lit("slider"))); + ui_set_rect(box, r2f32_cut_top(&ui->top->rect, scroller_size * scroller_box_size)); + ui_signal_t signal = ui_signal_from_box(box); + if (signal.dragging) { + scroller_value += (ev->mouse_delta.y / item_box_size * 2) * (all_items_size); + scroller_value = CLAMP(scroller_value, 0, all_items_size); + } + if (ev->kind == app_event_kind_mouse_wheel) { + scroller_value -= ev->mouse_wheel_delta.y; + scroller_value = CLAMP(scroller_value, 0, all_items_size); + } + + + for (ui_box_t *it = item_box->first; it; it = it->next) { + it->full_rect.min.y -= scroller_value; + it->full_rect.max.y -= scroller_value; + it->rect.min.y -= scroller_value; + it->rect.max.y -= scroller_value; + } + } + ui_end_build(); } rn_begin(); + rn_draw_stringf(&rn_state.main_font, v2f32(0, frame->window_size.y - rn_state.main_font.size), black_color_global, "boxes: %d", ui->allocated_boxes); ui_draw(frame); rn_end(frame->window_size, white_color_global); diff --git a/src/wasm_app/ui.h b/src/wasm_app/ui.h index 832e1f0..c0ee8ce 100644 --- a/src/wasm_app/ui.h +++ b/src/wasm_app/ui.h @@ -4,15 +4,12 @@ struct ui_code_loc_t { int line; int counter; }; -#define UILOC (ui_code_loc_t){.file = __FILE__, .line = __LINE__, .counter = __COUNTER__} - typedef struct ui_id_t ui_id_t; struct ui_id_t { u64 value; }; - typedef struct ui_box_flags_t ui_box_flags_t; struct ui_box_flags_t { b8 draw_rect: 1; @@ -20,6 +17,14 @@ struct ui_box_flags_t { b8 draw_text: 1; }; +typedef enum { + ui_op_cut_top, + ui_op_cut_bottom, + ui_op_cut_left, + ui_op_cut_right, + ui_op_idle, +} ui_op_t; + typedef struct ui_box_t ui_box_t; struct ui_box_t { ui_box_t *next; @@ -27,21 +32,24 @@ struct ui_box_t { ui_box_t *first; ui_box_t *last; ui_box_t *parent; - i32 node_count; + i32 node_count; - ui_code_loc_t loc; - s8_t string; - r2f32_t full_rect; - r2f32_t rect; + ui_code_loc_t loc; + s8_t string; + r2f32_t full_rect; + r2f32_t rect; + ui_op_t layout_op; ui_box_flags_t flags; - b8 created_new; + b8 created_new; - ui_id_t id; + ui_id_t id; ui_box_t *hash_next; ui_box_t *hash_prev; - u64 last_touched_event_id; -}; + u64 last_touched_event_id; + r2f32_t final_rect; + b32 expanded; +}; typedef struct ui_signal_t ui_signal_t; struct ui_signal_t { @@ -71,6 +79,7 @@ ui_t *ui; gb_read_only ui_id_t ui_null_id; gb_read_only ui_box_t ui_null_box; +gb_read_only ui_box_flags_t ui_null_flags; fn b32 ui_is_null_id(ui_id_t id) { return id.value == 0; } fn b32 ui_is_null_box(ui_box_t *box) { return box->id.value == 0; } @@ -80,3 +89,12 @@ fn b32 ui_is_active_box(ui_box_t *box) { return !ui_is_null_box(box) && box->id. #define ev_left(ev) ((ev)->mouse_button == app_mouse_button_left) #define ev_left_up(ev) ((ev)->kind == app_event_kind_mouse_up && ev_left(ev)) #define ev_left_down(ev) ((ev)->kind == app_event_kind_mouse_down && ev_left(ev)) + +fn void ui_push_top(ui_box_t *new_top) { assert(new_top->parent == ui->top); ui->top = new_top; } +fn void ui_pop_top(void) { ui->top = ui->top->parent; } +fn void ui_set_rect(ui_box_t *box, r2f32_t rect) { box->rect = box->full_rect = rect; } + +#define UILOC (ui_code_loc_t){.file = __FILE__, .line = __LINE__, .counter = __COUNTER__} +#define ui_em(x) ((x) * rn_state.main_font.size) +#define ui_max 200000000.f +#define ui_box_flags(...) (ui_box_flag_t){__VA_ARGS__}