2022-08-14 16:19:40 +00:00
|
|
|
/************************************************************//**
|
|
|
|
*
|
|
|
|
* @file: ui.c
|
|
|
|
* @author: Martin Fouilleul
|
|
|
|
* @date: 08/08/2022
|
|
|
|
* @revision:
|
|
|
|
*
|
|
|
|
*****************************************************************/
|
|
|
|
#include"memory.h"
|
|
|
|
#include"hash.h"
|
|
|
|
#include"platform_clock.h"
|
|
|
|
#include"ui.h"
|
|
|
|
|
|
|
|
#define LOG_SUBSYSTEM "UI"
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// context
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
|
|
|
|
const u32 UI_MAX_INPUT_CHAR_PER_FRAME = 64;
|
|
|
|
|
|
|
|
typedef struct ui_input_text
|
|
|
|
{
|
|
|
|
u8 count;
|
|
|
|
utf32 codePoints[UI_MAX_INPUT_CHAR_PER_FRAME];
|
|
|
|
|
|
|
|
} ui_input_text;
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
typedef struct ui_style_attr
|
|
|
|
{
|
|
|
|
ui_style_tag tag;
|
|
|
|
ui_style_selector selector;
|
|
|
|
union
|
|
|
|
{
|
|
|
|
ui_size size;
|
|
|
|
mg_color color;
|
|
|
|
mg_font font;
|
|
|
|
f32 value;
|
2022-08-15 22:01:07 +00:00
|
|
|
u32 flags;
|
2022-08-15 08:20:29 +00:00
|
|
|
};
|
|
|
|
} ui_style_attr;
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
typedef struct ui_stack_elt ui_stack_elt;
|
|
|
|
struct ui_stack_elt
|
|
|
|
{
|
|
|
|
ui_stack_elt* parent;
|
|
|
|
union
|
|
|
|
{
|
|
|
|
ui_box* box;
|
|
|
|
ui_size size;
|
|
|
|
mp_rect clip;
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_style_attr attr;
|
2022-08-14 16:19:40 +00:00
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
const u64 UI_BOX_MAP_BUCKET_COUNT = 1024;
|
|
|
|
|
|
|
|
typedef struct ui_context
|
|
|
|
{
|
|
|
|
bool init;
|
|
|
|
|
|
|
|
f32 width;
|
|
|
|
f32 height;
|
|
|
|
|
|
|
|
u64 frameCounter;
|
|
|
|
f64 frameTime;
|
|
|
|
f64 lastFrameDuration;
|
|
|
|
|
|
|
|
mem_arena frameArena;
|
|
|
|
mem_pool boxPool;
|
|
|
|
list_info boxMap[UI_BOX_MAP_BUCKET_COUNT];
|
|
|
|
|
|
|
|
ui_box* root;
|
|
|
|
ui_box* overlay;
|
|
|
|
ui_stack_elt* boxStack;
|
|
|
|
ui_stack_elt* clipStack;
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_stack_elt* sizeStack[UI_AXIS_COUNT];
|
|
|
|
ui_stack_elt* bgColorStack;
|
|
|
|
ui_stack_elt* fgColorStack;
|
|
|
|
ui_stack_elt* borderColorStack;
|
|
|
|
ui_stack_elt* fontColorStack;
|
|
|
|
ui_stack_elt* fontStack;
|
|
|
|
ui_stack_elt* fontSizeStack;
|
|
|
|
ui_stack_elt* borderSizeStack;
|
|
|
|
ui_stack_elt* roundnessStack;
|
|
|
|
ui_stack_elt* animationTimeStack;
|
2022-08-15 22:01:07 +00:00
|
|
|
ui_stack_elt* animationFlagsStack;
|
2022-08-15 08:20:29 +00:00
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
u32 z;
|
|
|
|
ui_box* hovered;
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_box* focus;
|
2023-03-05 14:59:57 +00:00
|
|
|
i32 editCursor;
|
|
|
|
i32 editMark;
|
|
|
|
i32 editFirstDisplayedChar;
|
2022-08-15 08:20:29 +00:00
|
|
|
f64 editCursorBlinkStart;
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
} ui_context;
|
|
|
|
|
2022-08-15 21:11:00 +00:00
|
|
|
__thread ui_context __uiThreadContext = {0};
|
|
|
|
__thread ui_context* __uiCurrentContext = 0;
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_context* ui_get_context(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-15 21:11:00 +00:00
|
|
|
return(__uiCurrentContext);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_set_context(ui_context* context)
|
|
|
|
{
|
|
|
|
__uiCurrentContext = context;
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// stacks
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
ui_stack_elt* ui_stack_push(ui_context* ui, ui_stack_elt** stack)
|
|
|
|
{
|
|
|
|
ui_stack_elt* elt = mem_arena_alloc_type(&ui->frameArena, ui_stack_elt);
|
|
|
|
memset(elt, 0, sizeof(ui_stack_elt));
|
|
|
|
elt->parent = *stack;
|
|
|
|
*stack = elt;
|
|
|
|
return(elt);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_stack_pop(ui_stack_elt** stack)
|
|
|
|
{
|
|
|
|
if(*stack)
|
|
|
|
{
|
|
|
|
*stack = (*stack)->parent;
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
LOG_ERROR("ui stack underflow\n");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
mp_rect ui_intersect_rects(mp_rect lhs, mp_rect rhs)
|
|
|
|
{
|
|
|
|
//NOTE(martin): intersect with current clip
|
|
|
|
f32 x0 = maximum(lhs.x, rhs.x);
|
|
|
|
f32 y0 = maximum(lhs.y, rhs.y);
|
|
|
|
f32 x1 = minimum(lhs.x + lhs.w, rhs.x + rhs.w);
|
|
|
|
f32 y1 = minimum(lhs.y + lhs.h, rhs.y + rhs.h);
|
|
|
|
mp_rect r = {x0, y0, maximum(0, x1-x0), maximum(0, y1-y0)};
|
|
|
|
return(r);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
mp_rect ui_clip_top(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
mp_rect r = {-FLT_MAX/2, -FLT_MAX/2, FLT_MAX, FLT_MAX};
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_stack_elt* elt = ui->clipStack;
|
|
|
|
if(elt)
|
|
|
|
{
|
|
|
|
r = elt->clip;
|
|
|
|
}
|
|
|
|
return(r);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_clip_push(mp_rect clip)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
mp_rect current = ui_clip_top();
|
|
|
|
ui_stack_elt* elt = ui_stack_push(ui, &ui->clipStack);
|
|
|
|
elt->clip = ui_intersect_rects(current, clip);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_clip_pop(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_stack_pop(&ui->clipStack);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* ui_box_top(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_stack_elt* elt = ui->boxStack;
|
|
|
|
ui_box* box = elt ? elt->box : 0;
|
|
|
|
return(box);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_push(ui_box* box)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_stack_elt* elt = ui_stack_push(ui, &ui->boxStack);
|
|
|
|
elt->box = box;
|
|
|
|
if(box->flags & UI_FLAG_CLIP)
|
|
|
|
{
|
|
|
|
ui_clip_push(box->rect);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_box_pop(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_box* box = ui_box_top();
|
2023-03-03 16:13:03 +00:00
|
|
|
if(box)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
if(box->flags & UI_FLAG_CLIP)
|
|
|
|
{
|
|
|
|
ui_clip_pop();
|
|
|
|
}
|
|
|
|
ui_stack_pop(&ui->boxStack);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_style_attr* ui_push_style_attr(ui_context* ui, ui_stack_elt** stack)
|
|
|
|
{
|
|
|
|
ui_stack_elt* elt = ui_stack_push(ui, stack);
|
|
|
|
return(&elt->attr);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_push_size(ui_axis axis, ui_size_kind kind, f32 value, f32 strictness)
|
|
|
|
{
|
|
|
|
ui_push_size_ext(UI_STYLE_TAG_ANY, UI_STYLE_SEL_ANY, axis, kind, value, strictness);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_push_size_ext(ui_style_tag tag, ui_style_selector selector, ui_axis axis, ui_size_kind kind, f32 value, f32 strictness)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_style_attr* attr = ui_push_style_attr(ui, &ui->sizeStack[axis]);
|
|
|
|
attr->tag = tag;
|
|
|
|
attr->selector = selector;
|
|
|
|
attr->size = (ui_size){kind, value, strictness};
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_pop_size(ui_axis axis)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_stack_pop(&ui->sizeStack[axis]);
|
|
|
|
}
|
|
|
|
|
|
|
|
#define UI_STYLE_STACK_OP_DEF(name, stack, type, arg) \
|
|
|
|
void _cat3_(ui_push_, name, _ext)(ui_style_tag tag, ui_style_selector selector, type arg) \
|
|
|
|
{ \
|
|
|
|
ui_context* ui = ui_get_context(); \
|
|
|
|
ui_style_attr* attr = ui_push_style_attr(ui, &ui->stack); \
|
|
|
|
attr->tag = tag; \
|
|
|
|
attr->selector = selector; \
|
|
|
|
attr->arg = arg; \
|
|
|
|
} \
|
|
|
|
void _cat2_(ui_push_, name)(type arg) \
|
|
|
|
{ \
|
|
|
|
_cat3_(ui_push_, name, _ext)(UI_STYLE_TAG_ANY, UI_STYLE_SEL_ANY, arg); \
|
|
|
|
} \
|
2022-08-19 17:46:31 +00:00
|
|
|
void _cat2_(ui_pop_, name)(void) \
|
2022-08-15 08:20:29 +00:00
|
|
|
{ \
|
|
|
|
ui_context* ui = ui_get_context(); \
|
|
|
|
ui_stack_pop(&ui->stack); \
|
|
|
|
}
|
|
|
|
|
|
|
|
UI_STYLE_STACK_OP_DEF(bg_color, bgColorStack, mg_color, color)
|
|
|
|
UI_STYLE_STACK_OP_DEF(fg_color, fgColorStack, mg_color, color)
|
|
|
|
UI_STYLE_STACK_OP_DEF(border_color, borderColorStack, mg_color, color)
|
|
|
|
UI_STYLE_STACK_OP_DEF(font_color, fontColorStack, mg_color, color)
|
|
|
|
UI_STYLE_STACK_OP_DEF(font, fontStack, mg_font, font)
|
|
|
|
UI_STYLE_STACK_OP_DEF(font_size, fontSizeStack, f32, value)
|
|
|
|
UI_STYLE_STACK_OP_DEF(border_size, borderSizeStack, f32, value)
|
|
|
|
UI_STYLE_STACK_OP_DEF(roundness, roundnessStack, f32, value)
|
|
|
|
UI_STYLE_STACK_OP_DEF(animation_time, animationTimeStack, f32, value)
|
2022-08-15 22:01:07 +00:00
|
|
|
UI_STYLE_STACK_OP_DEF(animation_flags, animationFlagsStack, u32, flags)
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
ui_style_attr* ui_style_attr_query(ui_stack_elt* stack, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style_attr* result = 0;
|
|
|
|
while(stack)
|
|
|
|
{
|
|
|
|
ui_style_attr* attr = &stack->attr;
|
|
|
|
bool matchTag = (attr->tag == UI_STYLE_TAG_ANY)
|
|
|
|
||(attr->tag == tag);
|
|
|
|
|
|
|
|
bool matchSel = attr->selector & selector;
|
|
|
|
|
|
|
|
if(matchTag && matchSel)
|
|
|
|
{
|
|
|
|
result = attr;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
stack = stack->parent;
|
|
|
|
}
|
|
|
|
return(result);
|
|
|
|
}
|
|
|
|
|
|
|
|
mg_color ui_style_color_query(ui_stack_elt* stack, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style_attr* attr = ui_style_attr_query(stack, tag, selector);
|
|
|
|
if(attr)
|
|
|
|
{
|
|
|
|
return(attr->color);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
return((mg_color){});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
mg_font ui_style_font_query(ui_stack_elt* stack, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style_attr* attr = ui_style_attr_query(stack, tag, selector);
|
|
|
|
if(attr)
|
|
|
|
{
|
|
|
|
return(attr->font);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
return(mg_font_nil());
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
f32 ui_style_float_query(ui_stack_elt* stack, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style_attr* attr = ui_style_attr_query(stack, tag, selector);
|
|
|
|
if(attr)
|
|
|
|
{
|
|
|
|
return(attr->value);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
return(0);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-15 22:01:07 +00:00
|
|
|
u32 ui_style_flags_query(ui_stack_elt* stack, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style_attr* attr = ui_style_attr_query(stack, tag, selector);
|
|
|
|
if(attr)
|
|
|
|
{
|
|
|
|
return(attr->flags);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
return(0);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_size ui_style_size_query(ui_stack_elt* stack, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style_attr* attr = ui_style_attr_query(stack, tag, selector);
|
|
|
|
if(attr)
|
|
|
|
{
|
|
|
|
return(attr->size);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
return((ui_size){});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_style* ui_collate_style(ui_context* context, ui_style_tag tag, ui_style_selector selector)
|
|
|
|
{
|
|
|
|
ui_style* style = mem_arena_alloc_type(&context->frameArena, ui_style);
|
|
|
|
|
|
|
|
style->size[UI_AXIS_X] = ui_style_size_query(context->sizeStack[UI_AXIS_X], tag, selector);
|
|
|
|
style->size[UI_AXIS_Y] = ui_style_size_query(context->sizeStack[UI_AXIS_Y], tag, selector);
|
|
|
|
style->bgColor = ui_style_color_query(context->bgColorStack, tag, selector);
|
|
|
|
style->fgColor = ui_style_color_query(context->fgColorStack, tag, selector);
|
|
|
|
style->borderColor = ui_style_color_query(context->borderColorStack, tag, selector);
|
|
|
|
style->fontColor = ui_style_color_query(context->fontColorStack, tag, selector);
|
|
|
|
style->font = ui_style_font_query(context->fontStack, tag, selector);
|
|
|
|
style->fontSize = ui_style_float_query(context->fontSizeStack, tag, selector);
|
|
|
|
style->borderSize = ui_style_float_query(context->borderSizeStack, tag, selector);
|
|
|
|
style->roundness = ui_style_float_query(context->roundnessStack, tag, selector);
|
|
|
|
style->animationTime = ui_style_float_query(context->animationTimeStack, tag, selector);
|
2022-08-15 22:01:07 +00:00
|
|
|
style->animationFlags = ui_style_flags_query(context->animationFlagsStack, tag, selector);
|
2022-08-15 08:20:29 +00:00
|
|
|
return(style);
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// key hashing and caching
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
ui_key ui_key_from_string(str8 string)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
u64 seed = 0;
|
|
|
|
ui_box* parent = ui_box_top();
|
|
|
|
if(parent)
|
|
|
|
{
|
|
|
|
seed = parent->key.hash;
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_key key = {};
|
|
|
|
key.hash = mp_hash_aes_string_seed(string, seed);
|
|
|
|
return(key);
|
|
|
|
}
|
|
|
|
|
|
|
|
bool ui_key_equal(ui_key a, ui_key b)
|
|
|
|
{
|
|
|
|
return(a.hash == b.hash);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_cache(ui_context* ui, ui_box* box)
|
|
|
|
{
|
|
|
|
u64 index = box->key.hash & (UI_BOX_MAP_BUCKET_COUNT-1);
|
|
|
|
ListAppend(&(ui->boxMap[index]), &box->bucketElt);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* ui_box_lookup_with_key(ui_context* ui, ui_key key)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
u64 index = key.hash & (UI_BOX_MAP_BUCKET_COUNT-1);
|
|
|
|
|
|
|
|
for_each_in_list(&ui->boxMap[index], box, ui_box, bucketElt)
|
|
|
|
{
|
|
|
|
if(ui_key_equal(key, box->key))
|
|
|
|
{
|
|
|
|
return(box);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return(0);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* ui_box_lookup_str8(str8 string)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_key key = ui_key_from_string(string);
|
|
|
|
return(ui_box_lookup_with_key(ui, key));
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_box* ui_box_lookup(const char* string)
|
|
|
|
{
|
|
|
|
return(ui_box_lookup_str8(str8_from_cstring((char*)string)));
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// ui boxes
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
|
|
|
|
bool ui_rect_hit(mp_rect r, vec2 p)
|
|
|
|
{
|
|
|
|
return( (p.x > r.x)
|
|
|
|
&&(p.x < r.x + r.w)
|
|
|
|
&&(p.y > r.y)
|
|
|
|
&&(p.y < r.y + r.h));
|
|
|
|
}
|
|
|
|
|
|
|
|
bool ui_box_hovering(ui_box* box, vec2 p)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
mp_rect clip = ui_clip_top();
|
|
|
|
mp_rect rect = ui_intersect_rects(clip, box->rect);
|
|
|
|
bool hit = ui_rect_hit(rect, p);
|
|
|
|
bool result = hit && (!ui->hovered || box->z >= ui->hovered->z);
|
|
|
|
return(result);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
vec2 ui_mouse_position(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
2023-03-04 18:24:30 +00:00
|
|
|
vec2 mousePos = mp_mouse_position();
|
2022-08-14 16:19:40 +00:00
|
|
|
mousePos.y = ui->height - mousePos.y;
|
|
|
|
return(mousePos);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
vec2 ui_mouse_delta(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
2023-03-04 18:24:30 +00:00
|
|
|
vec2 delta = mp_mouse_delta();
|
2022-08-14 16:19:40 +00:00
|
|
|
delta.y *= -1.;
|
|
|
|
return(delta);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
vec2 ui_mouse_wheel(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
2023-03-04 18:24:30 +00:00
|
|
|
vec2 delta = mp_mouse_wheel();
|
2022-08-14 16:19:40 +00:00
|
|
|
delta.y *= -1.;
|
|
|
|
return(delta);
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_box* ui_box_make_str8(str8 string, ui_flags flags)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
ui_key key = ui_key_from_string(string);
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* box = ui_box_lookup_with_key(ui, key);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
if(!box)
|
|
|
|
{
|
|
|
|
box = mem_pool_alloc_type(&ui->boxPool, ui_box);
|
|
|
|
memset(box, 0, sizeof(ui_box));
|
|
|
|
|
|
|
|
box->key = key;
|
2022-08-16 07:58:16 +00:00
|
|
|
box->fresh = true;
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_box_cache(ui, box);
|
|
|
|
}
|
2022-08-16 07:58:16 +00:00
|
|
|
else
|
|
|
|
{
|
|
|
|
box->fresh = false;
|
|
|
|
}
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
//NOTE: setup hierarchy
|
2022-08-21 15:07:54 +00:00
|
|
|
if(box->frameCounter != ui->frameCounter)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-21 15:07:54 +00:00
|
|
|
ListInit(&box->children);
|
|
|
|
box->parent = ui_box_top();
|
|
|
|
if(box->parent)
|
|
|
|
{
|
|
|
|
ListAppend(&box->parent->children, &box->listElt);
|
|
|
|
box->parentClosed = box->parent->closed || box->parent->parentClosed;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
//maybe this should be a warning that we're trying to make the box twice in the same frame?
|
|
|
|
LOG_WARNING("trying to make ui box '%.*s' multiple times in the same frame\n", (int)box->string.len, box->string.ptr);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
//NOTE: setup per-frame state
|
|
|
|
box->frameCounter = ui->frameCounter;
|
|
|
|
box->string = str8_push_copy(&ui->frameArena, string);
|
|
|
|
box->flags = flags;
|
|
|
|
|
|
|
|
box->floating[UI_AXIS_X] = false;
|
|
|
|
box->floating[UI_AXIS_Y] = false;
|
|
|
|
box->layout = box->parent ? box->parent->layout : (ui_layout){0};
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
//NOTE: compute style
|
|
|
|
ui_style_selector selector = UI_STYLE_SEL_NORMAL;
|
|
|
|
if(box->hot)
|
|
|
|
{
|
|
|
|
selector = UI_STYLE_SEL_HOT;
|
|
|
|
}
|
|
|
|
if(box->active)
|
|
|
|
{
|
|
|
|
selector = UI_STYLE_SEL_ACTIVE;
|
|
|
|
}
|
|
|
|
box->targetStyle = ui_collate_style(ui, box->tag, selector);
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
return(box);
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_box* ui_box_make(const char* cstring, ui_flags flags)
|
|
|
|
{
|
|
|
|
str8 string = str8_from_cstring((char*)cstring);
|
|
|
|
return(ui_box_make_str8(string, flags));
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_box* ui_box_begin_str8(str8 string, ui_flags flags)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_box* box = ui_box_make_str8(string, flags);
|
|
|
|
ui_box_push(box);
|
|
|
|
return(box);
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_box* ui_box_begin(const char* cstring, ui_flags flags)
|
|
|
|
{
|
|
|
|
str8 string = str8_from_cstring((char*)cstring);
|
|
|
|
return(ui_box_begin_str8(string, flags));
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* ui_box_end(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_box* box = ui_box_top();
|
|
|
|
DEBUG_ASSERT(box, "box stack underflow");
|
|
|
|
|
|
|
|
ui_box_pop();
|
|
|
|
return(box);
|
|
|
|
}
|
|
|
|
|
2022-08-15 15:20:44 +00:00
|
|
|
void ui_box_set_render_proc(ui_box* box, ui_box_render_proc proc, void* data)
|
|
|
|
{
|
|
|
|
box->renderProc = proc;
|
|
|
|
box->renderData = data;
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
void ui_box_set_layout(ui_box* box, ui_axis axis, ui_align alignX, ui_align alignY)
|
|
|
|
{
|
|
|
|
box->layout = (ui_layout){axis, {alignX, alignY}};
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_set_size(ui_box* box, ui_axis axis, ui_size_kind kind, f32 value, f32 strictness)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
box->targetStyle->size[axis] = (ui_size){kind, value, strictness};
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_set_floating(ui_box* box, ui_axis axis, f32 pos)
|
|
|
|
{
|
|
|
|
box->floating[axis] = true;
|
2022-08-15 22:01:07 +00:00
|
|
|
box->floatTarget.c[axis] = pos;
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_set_closed(ui_box* box, bool closed)
|
|
|
|
{
|
|
|
|
box->closed = closed;
|
|
|
|
}
|
|
|
|
|
|
|
|
bool ui_box_closed(ui_box* box)
|
|
|
|
{
|
|
|
|
return(box->closed);
|
|
|
|
}
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
void ui_box_activate(ui_box* box)
|
|
|
|
{
|
|
|
|
box->active = true;
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_deactivate(ui_box* box)
|
|
|
|
{
|
|
|
|
box->active = false;
|
|
|
|
}
|
|
|
|
|
|
|
|
bool ui_box_active(ui_box* box)
|
|
|
|
{
|
|
|
|
return(box->active);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_set_hot(ui_box* box, bool hot)
|
|
|
|
{
|
|
|
|
box->hot = hot;
|
|
|
|
}
|
|
|
|
|
|
|
|
bool ui_box_hot(ui_box* box)
|
|
|
|
{
|
|
|
|
return(box->hot);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_box_set_tag(ui_box* box, ui_style_tag tag)
|
|
|
|
{
|
|
|
|
box->tag = tag;
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_sig ui_box_sig(ui_box* box)
|
|
|
|
{
|
2022-08-19 17:46:31 +00:00
|
|
|
//NOTE: compute input signals
|
|
|
|
ui_sig sig = {0};
|
|
|
|
|
|
|
|
sig.box = box;
|
|
|
|
|
|
|
|
if(!box->closed && !box->parentClosed)
|
|
|
|
{
|
|
|
|
vec2 mousePos = ui_mouse_position();
|
|
|
|
|
|
|
|
sig.hovering = ui_box_hovering(box, mousePos);
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_CLICKABLE)
|
|
|
|
{
|
|
|
|
if(sig.hovering)
|
|
|
|
{
|
2023-03-04 18:24:30 +00:00
|
|
|
sig.pressed = mp_mouse_pressed(MP_MOUSE_LEFT);
|
2022-08-19 17:46:31 +00:00
|
|
|
if(sig.pressed)
|
|
|
|
{
|
|
|
|
box->dragging = true;
|
|
|
|
}
|
2023-03-04 18:24:30 +00:00
|
|
|
sig.doubleClicked = mp_mouse_double_clicked(MP_MOUSE_LEFT);
|
|
|
|
sig.rightPressed = mp_mouse_pressed(MP_MOUSE_RIGHT);
|
2022-08-19 17:46:31 +00:00
|
|
|
}
|
|
|
|
|
2023-03-04 18:24:30 +00:00
|
|
|
sig.released = mp_mouse_released(MP_MOUSE_LEFT);
|
2022-08-19 17:46:31 +00:00
|
|
|
if(sig.released)
|
|
|
|
{
|
|
|
|
if(box->dragging && sig.hovering)
|
|
|
|
{
|
2023-03-04 18:24:30 +00:00
|
|
|
sig.clicked = true;
|
2022-08-19 17:46:31 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-03-04 18:24:30 +00:00
|
|
|
if(!mp_mouse_down(MP_MOUSE_LEFT))
|
2022-08-19 17:46:31 +00:00
|
|
|
{
|
|
|
|
box->dragging = false;
|
|
|
|
}
|
|
|
|
|
|
|
|
sig.dragging = box->dragging;
|
|
|
|
}
|
|
|
|
|
|
|
|
sig.mouse = (vec2){mousePos.x - box->rect.x, mousePos.y - box->rect.y};
|
|
|
|
sig.delta = ui_mouse_delta();
|
|
|
|
sig.wheel = ui_mouse_wheel();
|
|
|
|
}
|
|
|
|
return(sig);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
bool ui_box_hidden(ui_box* box)
|
|
|
|
{
|
|
|
|
return(box->closed || box->parentClosed);
|
|
|
|
}
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// Auto-layout
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
|
|
|
|
void ui_animate_f32(ui_context* ui, f32* value, f32 target, f32 animationTime)
|
|
|
|
{
|
|
|
|
if( animationTime < 1e-6
|
|
|
|
|| fabs(*value - target) < 0.001)
|
|
|
|
{
|
|
|
|
*value = target;
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
|
|
|
|
/*NOTE:
|
|
|
|
we use the euler approximation for df/dt = alpha(target - f)
|
|
|
|
the implicit form is f(t) = target*(1-e^(-alpha*t)) for the rising front,
|
|
|
|
and f(t) = e^(-alpha*t) for the falling front (e.g. classic RC circuit charge/discharge)
|
|
|
|
|
|
|
|
Here we bake alpha = 1/tau = -ln(0.05)/tr, with tr the rise time to 95% of target
|
|
|
|
*/
|
|
|
|
f32 alpha = 3/animationTime;
|
|
|
|
f32 dt = ui->lastFrameDuration;
|
|
|
|
|
|
|
|
*value += (target - *value)*alpha*dt;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_animate_color(ui_context* ui, mg_color* color, mg_color target, f32 animationTime)
|
|
|
|
{
|
|
|
|
for(int i=0; i<4; i++)
|
|
|
|
{
|
|
|
|
ui_animate_f32(ui, &color->c[i], target.c[i], animationTime);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_animate_ui_size(ui_context* ui, ui_size* size, ui_size target, f32 animationTime)
|
|
|
|
{
|
|
|
|
size->kind = target.kind;
|
|
|
|
ui_animate_f32(ui, &size->value, target.value, animationTime);
|
|
|
|
ui_animate_f32(ui, &size->strictness, target.strictness, animationTime);
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
void ui_box_compute_styling(ui_context* ui, ui_box* box)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_style* targetStyle = box->targetStyle;
|
2022-08-14 16:19:40 +00:00
|
|
|
DEBUG_ASSERT(targetStyle);
|
|
|
|
|
|
|
|
f32 animationTime = targetStyle->animationTime;
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
//NOTE: interpolate based on transition values
|
|
|
|
u32 flags = box->targetStyle->animationFlags;
|
2022-08-15 22:01:07 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(box->fresh)
|
2022-08-15 22:01:07 +00:00
|
|
|
{
|
2022-08-16 07:58:16 +00:00
|
|
|
box->computedStyle = *targetStyle;
|
2022-08-15 22:01:07 +00:00
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
2022-08-19 17:46:31 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_SIZE_X)
|
|
|
|
{
|
|
|
|
ui_animate_ui_size(ui, &box->computedStyle.size[UI_AXIS_X], targetStyle->size[UI_AXIS_X], animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.size[UI_AXIS_X] = targetStyle->size[UI_AXIS_X];
|
|
|
|
}
|
|
|
|
|
|
|
|
if(flags & UI_STYLE_ANIMATE_SIZE_Y)
|
|
|
|
{
|
|
|
|
ui_animate_ui_size(ui, &box->computedStyle.size[UI_AXIS_Y], targetStyle->size[UI_AXIS_Y], animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.size[UI_AXIS_Y] = targetStyle->size[UI_AXIS_Y];
|
|
|
|
}
|
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_BG_COLOR)
|
|
|
|
{
|
|
|
|
ui_animate_color(ui, &box->computedStyle.bgColor, targetStyle->bgColor, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.bgColor = targetStyle->bgColor;
|
|
|
|
}
|
2022-08-15 22:01:07 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_FG_COLOR)
|
|
|
|
{
|
|
|
|
ui_animate_color(ui, &box->computedStyle.fgColor, targetStyle->fgColor, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.fgColor = targetStyle->fgColor;
|
|
|
|
}
|
2022-08-15 22:01:07 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_BORDER_COLOR)
|
|
|
|
{
|
|
|
|
ui_animate_color(ui, &box->computedStyle.borderColor, targetStyle->borderColor, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.borderColor = targetStyle->borderColor;
|
|
|
|
}
|
2022-08-15 22:01:07 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_FONT_COLOR)
|
|
|
|
{
|
|
|
|
ui_animate_color(ui, &box->computedStyle.fontColor, targetStyle->fontColor, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.fontColor = targetStyle->fontColor;
|
|
|
|
}
|
2022-08-15 22:01:07 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_FONT_SIZE)
|
|
|
|
{
|
|
|
|
ui_animate_f32(ui, &box->computedStyle.fontSize, targetStyle->fontSize, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.fontSize = targetStyle->fontSize;
|
|
|
|
}
|
2022-08-15 22:01:07 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_BORDER_SIZE)
|
|
|
|
{
|
|
|
|
ui_animate_f32(ui, &box->computedStyle.borderSize, targetStyle->borderSize, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.borderSize = targetStyle->borderSize;
|
|
|
|
}
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
if(flags & UI_STYLE_ANIMATE_ROUNDNESS)
|
|
|
|
{
|
|
|
|
ui_animate_f32(ui, &box->computedStyle.roundness, targetStyle->roundness, animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
box->computedStyle.roundness = targetStyle->roundness;
|
|
|
|
}
|
|
|
|
box->computedStyle.font = targetStyle->font;
|
2022-08-15 22:01:07 +00:00
|
|
|
}
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_prepass(ui_context* ui, ui_box* box)
|
|
|
|
{
|
|
|
|
if(ui_box_hidden(box))
|
|
|
|
{
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
//NOTE: compute styling and static sizes
|
|
|
|
ui_box_compute_styling(ui, box);
|
|
|
|
|
|
|
|
ui_style* style = &box->computedStyle;
|
|
|
|
|
|
|
|
mp_rect textBox = {};
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_size desiredSize[2] = {box->computedStyle.size[UI_AXIS_X],
|
|
|
|
box->computedStyle.size[UI_AXIS_Y]};
|
|
|
|
|
|
|
|
if( desiredSize[UI_AXIS_X].kind == UI_SIZE_TEXT
|
|
|
|
||desiredSize[UI_AXIS_Y].kind == UI_SIZE_TEXT)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
textBox = mg_text_bounding_box(style->font, style->fontSize, box->string);
|
|
|
|
}
|
|
|
|
|
|
|
|
for(int i=0; i<UI_AXIS_COUNT; i++)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_size size = desiredSize[i];
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
if(size.kind == UI_SIZE_TEXT)
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
box->rect.c[2+i] = textBox.c[2+i] + desiredSize[i].value*2;
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
else if(size.kind == UI_SIZE_PIXELS)
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
box->rect.c[2+i] = size.value;
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
|
|
|
ui_layout_prepass(ui, child);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_upward_dependent_size(ui_context* ui, ui_box* box, int axis)
|
|
|
|
{
|
|
|
|
if(ui_box_hidden(box))
|
|
|
|
{
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_size* size = &box->computedStyle.size[axis];
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
if(size->kind == UI_SIZE_PARENT_RATIO)
|
|
|
|
{
|
|
|
|
ui_box* parent = box->parent;
|
|
|
|
if( parent
|
2022-08-15 08:20:29 +00:00
|
|
|
&& parent->computedStyle.size[axis].kind != UI_SIZE_CHILDREN)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
box->rect.c[2+axis] = parent->rect.c[2+axis] * size->value;
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
//TODO else?
|
|
|
|
}
|
|
|
|
|
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
|
|
|
ui_layout_upward_dependent_size(ui, child, axis);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_downward_dependent_size(ui_context* ui, ui_box* box, int axis)
|
|
|
|
{
|
|
|
|
f32 sum = 0;
|
|
|
|
if(box->layout.axis == axis)
|
|
|
|
{
|
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
|
|
|
if(!ui_box_hidden(child))
|
|
|
|
{
|
|
|
|
ui_layout_downward_dependent_size(ui, child, axis);
|
|
|
|
if(!child->floating[axis])
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
sum += child->rect.c[2+axis];
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
|
|
|
if(!ui_box_hidden(child))
|
|
|
|
{
|
|
|
|
ui_layout_downward_dependent_size(ui, child, axis);
|
|
|
|
if(!child->floating[axis])
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
sum = maximum(sum, child->rect.c[2+axis]);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
box->childrenSum[axis] = sum;
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_size* size = &box->computedStyle.size[axis];
|
2022-08-14 16:19:40 +00:00
|
|
|
if(size->kind == UI_SIZE_CHILDREN)
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
box->rect.c[2+axis] = sum + size->value*2;
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_solve_conflicts(ui_context* ui, ui_box* box, int axis)
|
|
|
|
{
|
|
|
|
//TODO
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_compute_rect(ui_context* ui, ui_box* box, vec2 pos)
|
|
|
|
{
|
|
|
|
if(ui_box_hidden(box))
|
|
|
|
{
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2022-08-15 22:01:07 +00:00
|
|
|
box->rect.x = pos.x;
|
|
|
|
box->rect.y = pos.y;
|
2022-08-14 16:19:40 +00:00
|
|
|
box->z = ui->z;
|
|
|
|
ui->z++;
|
|
|
|
|
|
|
|
ui_axis layoutAxis = box->layout.axis;
|
|
|
|
ui_axis secondAxis = (layoutAxis == UI_AXIS_X) ? UI_AXIS_Y : UI_AXIS_X;
|
|
|
|
ui_align* align = box->layout.align;
|
|
|
|
|
2022-08-15 22:01:07 +00:00
|
|
|
vec2 origin = {box->rect.x - box->scroll.x,
|
|
|
|
box->rect.y - box->scroll.y};
|
2022-08-14 16:19:40 +00:00
|
|
|
vec2 currentPos = origin;
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
vec2 margin = {0, 0};
|
|
|
|
for(int i=0; i<UI_AXIS_COUNT; i++)
|
|
|
|
{
|
|
|
|
if(box->computedStyle.size[i].kind == UI_SIZE_CHILDREN)
|
|
|
|
{
|
|
|
|
margin.c[i] = box->computedStyle.size[i].value;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
currentPos.x += margin.x;
|
|
|
|
currentPos.y += margin.y;
|
|
|
|
|
2022-08-15 22:01:07 +00:00
|
|
|
vec2 contentsSize = {maximum(box->rect.w, box->childrenSum[UI_AXIS_X]),
|
|
|
|
maximum(box->rect.h, box->childrenSum[UI_AXIS_Y])};
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
for(int i=0; i<UI_AXIS_COUNT; i++)
|
|
|
|
{
|
|
|
|
if(align[i] == UI_ALIGN_END)
|
|
|
|
{
|
2022-08-19 17:46:31 +00:00
|
|
|
currentPos.c[i] += contentsSize.c[i] - box->childrenSum[i] - margin.c[i];
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
if(align[layoutAxis] == UI_ALIGN_CENTER)
|
|
|
|
{
|
|
|
|
currentPos.c[layoutAxis] += 0.5*(contentsSize.c[layoutAxis] - box->childrenSum[layoutAxis]);
|
|
|
|
}
|
|
|
|
|
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
|
|
|
if(align[secondAxis] == UI_ALIGN_CENTER)
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
currentPos.c[secondAxis] = origin.c[secondAxis] + 0.5*(contentsSize.c[secondAxis] - child->rect.c[2+secondAxis]);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
vec2 childPos = currentPos;
|
|
|
|
for(int i=0; i<UI_AXIS_COUNT; i++)
|
|
|
|
{
|
|
|
|
if(child->floating[i])
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
ui_style* style = child->targetStyle;
|
2022-08-16 07:58:16 +00:00
|
|
|
if((child->targetStyle->animationFlags & UI_STYLE_ANIMATE_POS)
|
|
|
|
&& !child->fresh)
|
2022-08-15 22:01:07 +00:00
|
|
|
{
|
|
|
|
ui_animate_f32(ui, &child->floatPos.c[i], child->floatTarget.c[i], style->animationTime);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
child->floatPos.c[i] = child->floatTarget.c[i];
|
|
|
|
}
|
|
|
|
childPos.c[i] = origin.c[i] + child->floatPos.c[i];
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_layout_compute_rect(ui, child, childPos);
|
|
|
|
|
|
|
|
if(!child->floating[layoutAxis])
|
|
|
|
{
|
2022-08-15 22:01:07 +00:00
|
|
|
currentPos.c[layoutAxis] += child->rect.c[2+layoutAxis];
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_find_next_hovered_recursive(ui_context* ui, ui_box* box, vec2 p)
|
|
|
|
{
|
|
|
|
if(ui_box_hidden(box))
|
|
|
|
{
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
bool hit = ui_rect_hit(box->rect, p);
|
|
|
|
if(hit && (box->flags & UI_FLAG_BLOCK_MOUSE))
|
|
|
|
{
|
|
|
|
ui->hovered = box;
|
|
|
|
}
|
|
|
|
if(hit || !(box->flags & UI_FLAG_CLIP))
|
|
|
|
{
|
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
|
|
|
ui_layout_find_next_hovered_recursive(ui, child, p);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_layout_find_next_hovered(ui_context* ui, vec2 p)
|
|
|
|
{
|
|
|
|
ui->hovered = 0;
|
|
|
|
ui_layout_find_next_hovered_recursive(ui, ui->root, p);
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_solve_layout(ui_context* ui)
|
|
|
|
{
|
|
|
|
ui_layout_prepass(ui, ui->root);
|
|
|
|
|
|
|
|
for(int axis=0; axis<UI_AXIS_COUNT; axis++)
|
|
|
|
{
|
|
|
|
ui_layout_upward_dependent_size(ui, ui->root, axis);
|
|
|
|
ui_layout_downward_dependent_size(ui, ui->root, axis);
|
|
|
|
ui_layout_solve_conflicts(ui, ui->root, axis);
|
|
|
|
}
|
|
|
|
ui_layout_compute_rect(ui, ui->root, (vec2){0, 0});
|
|
|
|
|
|
|
|
vec2 p = ui_mouse_position();
|
|
|
|
ui_layout_find_next_hovered(ui, p);
|
|
|
|
}
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// Drawing
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
void ui_rectangle_fill(mp_rect rect, f32 roundness)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
if(roundness)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_rounded_rectangle_fill(rect.x, rect.y, rect.w, rect.h, roundness);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_rectangle_fill(rect.x, rect.y, rect.w, rect.h);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
void ui_rectangle_stroke(mp_rect rect, f32 roundness)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
if(roundness)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_rounded_rectangle_stroke(rect.x, rect.y, rect.w, rect.h, roundness);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_rectangle_stroke(rect.x, rect.y, rect.w, rect.h);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
void ui_draw_box(ui_box* box)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
if(ui_box_hidden(box))
|
|
|
|
{
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_style* style = &box->computedStyle;
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_CLIP)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_clip_push(box->rect.x, box->rect.y, box->rect.w, box->rect.h);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_DRAW_BACKGROUND)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_set_color(style->bgColor);
|
|
|
|
ui_rectangle_fill(box->rect, style->roundness);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
if((box->flags & UI_FLAG_DRAW_RENDER_PROC) && box->renderProc)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
box->renderProc(box, box->renderData);
|
2022-08-19 17:46:31 +00:00
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
for_each_in_list(&box->children, child, ui_box, listElt)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
ui_draw_box(child);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_DRAW_FOREGROUND)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_set_color(style->fgColor);
|
|
|
|
ui_rectangle_fill(box->rect, style->roundness);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_DRAW_TEXT)
|
|
|
|
{
|
|
|
|
mp_rect textBox = mg_text_bounding_box(style->font, style->fontSize, box->string);
|
|
|
|
|
|
|
|
f32 x = box->rect.x + 0.5*(box->rect.w - textBox.w);
|
|
|
|
f32 y = box->rect.y + 0.5*(box->rect.h - textBox.h) - textBox.y;
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_set_font(style->font);
|
|
|
|
mg_set_font_size(style->fontSize);
|
|
|
|
mg_set_color(style->fontColor);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_move_to(x, y);
|
|
|
|
mg_text_outlines(box->string);
|
|
|
|
mg_fill();
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_CLIP)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_clip_pop();
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
if(box->flags & UI_FLAG_DRAW_BORDER)
|
|
|
|
{
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_set_width(style->borderSize);
|
|
|
|
mg_set_color(style->borderColor);
|
|
|
|
ui_rectangle_stroke(box->rect, style->roundness);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
void ui_draw()
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
//NOTE: draw
|
|
|
|
mg_mat2x3 transform = {1, 0, 0,
|
|
|
|
0, -1, ui->height};
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
bool oldTextFlip = mg_get_text_flip();
|
|
|
|
mg_set_text_flip(true);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_matrix_push(transform);
|
|
|
|
ui_draw_box(ui->root);
|
|
|
|
mg_matrix_pop();
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
mg_set_text_flip(oldTextFlip);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
//TODO: restore flip??
|
|
|
|
}
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// frame begin/end
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
|
|
|
|
void ui_begin_frame(u32 width, u32 height, ui_style defaultStyle)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
mem_arena_clear(&ui->frameArena);
|
|
|
|
|
|
|
|
ui->width = width;
|
|
|
|
ui->height = height;
|
|
|
|
ui->frameCounter++;
|
|
|
|
f64 time = mp_get_time(MP_CLOCK_MONOTONIC);
|
|
|
|
ui->lastFrameDuration = time - ui->frameTime;
|
|
|
|
ui->frameTime = time;
|
|
|
|
|
|
|
|
ui->boxStack = 0;
|
|
|
|
ui->sizeStack[UI_AXIS_X] = 0;
|
|
|
|
ui->sizeStack[UI_AXIS_Y] = 0;
|
2022-08-15 08:20:29 +00:00
|
|
|
ui->bgColorStack = 0;
|
|
|
|
ui->fgColorStack = 0;
|
|
|
|
ui->borderColorStack = 0;
|
|
|
|
ui->fontColorStack = 0;
|
|
|
|
ui->fontStack = 0;
|
|
|
|
ui->fontSizeStack = 0;
|
|
|
|
ui->borderSizeStack = 0;
|
|
|
|
ui->roundnessStack = 0;
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
ui->clipStack = 0;
|
|
|
|
ui->z = 0;
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
for(int i=0; i<UI_AXIS_COUNT; i++)
|
|
|
|
{
|
|
|
|
ui_push_size(i,
|
|
|
|
defaultStyle.size[i].kind,
|
|
|
|
defaultStyle.size[i].value,
|
|
|
|
defaultStyle.size[i].strictness);
|
|
|
|
}
|
|
|
|
ui_push_bg_color(defaultStyle.bgColor);
|
|
|
|
ui_push_fg_color(defaultStyle.fgColor);
|
|
|
|
ui_push_border_color(defaultStyle.borderColor);
|
|
|
|
ui_push_font_color(defaultStyle.fontColor);
|
|
|
|
ui_push_font(defaultStyle.font);
|
|
|
|
ui_push_font_size(defaultStyle.fontSize);
|
|
|
|
ui_push_border_size(defaultStyle.borderSize);
|
|
|
|
ui_push_roundness(defaultStyle.roundness);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
ui_push_size(UI_AXIS_X, UI_SIZE_PIXELS, width, 0);
|
|
|
|
ui_push_size(UI_AXIS_Y, UI_SIZE_PIXELS, height, 0);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
ui->root = ui_box_begin("_root_", 0);
|
|
|
|
|
|
|
|
ui_box* contents = ui_box_make("_contents_", 0);
|
|
|
|
ui_box_set_floating(contents, UI_AXIS_X, 0);
|
|
|
|
ui_box_set_floating(contents, UI_AXIS_Y, 0);
|
|
|
|
ui_box_set_layout(contents, UI_AXIS_Y, UI_ALIGN_START, UI_ALIGN_START);
|
|
|
|
|
|
|
|
ui->overlay = ui_box_make("_overlay_", 0);
|
|
|
|
ui_box_set_floating(ui->overlay, UI_AXIS_X, 0);
|
|
|
|
ui_box_set_floating(ui->overlay, UI_AXIS_Y, 0);
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_pop_size(UI_AXIS_X);
|
|
|
|
ui_pop_size(UI_AXIS_Y);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
ui_box_push(contents);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_end_frame(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
ui_box_pop();
|
|
|
|
|
|
|
|
ui_box* box = ui_box_end();
|
|
|
|
DEBUG_ASSERT(box == ui->root, "unbalanced box stack");
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
//TODO: check balancing of style stacks
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
//NOTE: layout
|
|
|
|
ui_solve_layout(ui);
|
|
|
|
|
|
|
|
//NOTE: prune unused boxes
|
|
|
|
for(int i=0; i<UI_BOX_MAP_BUCKET_COUNT; i++)
|
|
|
|
{
|
|
|
|
for_each_in_list_safe(&ui->boxMap[i], box, ui_box, bucketElt)
|
|
|
|
{
|
|
|
|
if(box->frameCounter < ui->frameCounter)
|
|
|
|
{
|
|
|
|
ListRemove(&ui->boxMap[i], &box->bucketElt);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// Init / cleanup
|
|
|
|
//-----------------------------------------------------------------------------
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_init(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-15 21:11:00 +00:00
|
|
|
ui_context* ui = &__uiThreadContext;
|
2022-08-14 16:19:40 +00:00
|
|
|
if(!ui->init)
|
|
|
|
{
|
2022-08-15 21:11:00 +00:00
|
|
|
__uiCurrentContext = &__uiThreadContext;
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
memset(ui, 0, sizeof(ui_context));
|
|
|
|
mem_arena_init(&ui->frameArena);
|
|
|
|
mem_pool_init(&ui->boxPool, sizeof(ui_box));
|
|
|
|
ui->init = true;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_cleanup(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
mem_arena_release(&ui->frameArena);
|
|
|
|
mem_pool_release(&ui->boxPool);
|
|
|
|
ui->init = false;
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
// Basic helpers
|
|
|
|
//-----------------------------------------------------------------------------
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_sig ui_label_str8(str8 label)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_flags flags = UI_FLAG_CLIP
|
|
|
|
| UI_FLAG_DRAW_TEXT;
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* box = ui_box_make_str8(label, flags);
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_box_set_size(box, UI_AXIS_X, UI_SIZE_TEXT, 0, 0);
|
|
|
|
ui_box_set_size(box, UI_AXIS_Y, UI_SIZE_TEXT, 0, 0);
|
|
|
|
|
|
|
|
ui_sig sig = ui_box_sig(box);
|
|
|
|
return(sig);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_sig ui_label(const char* label)
|
|
|
|
{
|
|
|
|
return(ui_label_str8(str8_from_cstring((char*)label)));
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_sig ui_button_str8(str8 label)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_flags flags = UI_FLAG_CLICKABLE
|
|
|
|
| UI_FLAG_CLIP
|
|
|
|
| UI_FLAG_DRAW_FOREGROUND
|
|
|
|
| UI_FLAG_DRAW_BORDER
|
|
|
|
| UI_FLAG_DRAW_TEXT
|
|
|
|
| UI_FLAG_HOT_ANIMATION
|
|
|
|
| UI_FLAG_ACTIVE_ANIMATION;
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_box* box = ui_box_make_str8(label, flags);
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_box_set_tag(box, UI_STYLE_TAG_BUTTON);
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_sig sig = ui_box_sig(box);
|
|
|
|
|
|
|
|
if(sig.hovering)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_box_set_hot(box, true);
|
2022-08-14 16:19:40 +00:00
|
|
|
if(sig.dragging)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_box_activate(box);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
}
|
2022-08-15 08:20:29 +00:00
|
|
|
else
|
|
|
|
{
|
|
|
|
ui_box_set_hot(box, false);
|
|
|
|
}
|
|
|
|
if(!sig.dragging)
|
|
|
|
{
|
|
|
|
ui_box_deactivate(box);
|
|
|
|
}
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
return(sig);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_sig ui_button(const char* label)
|
|
|
|
{
|
|
|
|
return(ui_button_str8(str8_from_cstring((char*)label)));
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_box* ui_scrollbar(const char* label, f32 thumbRatio, f32* scrollValue)
|
|
|
|
{
|
|
|
|
ui_box* frame = ui_box_begin(label, 0);
|
|
|
|
{
|
|
|
|
ui_axis trackAxis = (frame->rect.w > frame->rect.h) ? UI_AXIS_X : UI_AXIS_Y;
|
|
|
|
ui_axis secondAxis = (trackAxis == UI_AXIS_Y) ? UI_AXIS_X : UI_AXIS_Y;
|
|
|
|
|
|
|
|
f32 roundness = 0.5*frame->rect.c[2+secondAxis];
|
|
|
|
f32 animationTime = 0.5;
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_push_bg_color((mg_color){0, 0, 0, 0});
|
|
|
|
ui_push_fg_color((mg_color){0, 0, 0, 0});
|
|
|
|
ui_push_roundness(roundness);
|
|
|
|
|
|
|
|
ui_push_bg_color_ext(UI_STYLE_TAG_ANY, UI_STYLE_SEL_HOT|UI_STYLE_SEL_ACTIVE, (mg_color){0, 0, 0, 0.5});
|
|
|
|
ui_push_fg_color_ext(UI_STYLE_TAG_ANY, UI_STYLE_SEL_HOT|UI_STYLE_SEL_ACTIVE, (mg_color){0, 0, 0, 0.7});
|
|
|
|
ui_push_roundness_ext(UI_STYLE_TAG_ANY, UI_STYLE_SEL_HOT|UI_STYLE_SEL_ACTIVE, roundness);
|
|
|
|
ui_push_animation_time_ext(UI_STYLE_TAG_ANY, UI_STYLE_SEL_ANY, 1.);
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_push_animation_flags_ext(UI_STYLE_TAG_ANY, UI_STYLE_SEL_ANY, UI_STYLE_ANIMATE_BG_COLOR|UI_STYLE_ANIMATE_FG_COLOR);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
ui_flags trackFlags = UI_FLAG_CLIP
|
|
|
|
| UI_FLAG_DRAW_BACKGROUND
|
|
|
|
| UI_FLAG_HOT_ANIMATION
|
|
|
|
| UI_FLAG_ACTIVE_ANIMATION;
|
|
|
|
|
|
|
|
ui_box* track = ui_box_begin("track", trackFlags);
|
|
|
|
|
|
|
|
ui_box_set_size(track, trackAxis, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
ui_box_set_size(track, secondAxis, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
ui_box_set_layout(track, trackAxis, UI_ALIGN_START, UI_ALIGN_START);
|
|
|
|
|
|
|
|
f32 beforeRatio = (*scrollValue) * (1. - thumbRatio);
|
|
|
|
f32 afterRatio = (1. - *scrollValue) * (1. - thumbRatio);
|
|
|
|
|
|
|
|
ui_box* beforeSpacer = ui_box_make("before", 0);
|
|
|
|
ui_box_set_size(beforeSpacer, trackAxis, UI_SIZE_PARENT_RATIO, beforeRatio, 0);
|
|
|
|
ui_box_set_size(beforeSpacer, secondAxis, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
|
|
|
|
ui_flags thumbFlags = UI_FLAG_CLICKABLE
|
|
|
|
| UI_FLAG_DRAW_FOREGROUND
|
|
|
|
| UI_FLAG_HOT_ANIMATION
|
|
|
|
| UI_FLAG_ACTIVE_ANIMATION;
|
|
|
|
|
|
|
|
ui_box* thumb = ui_box_make("thumb", thumbFlags);
|
|
|
|
ui_box_set_size(thumb, trackAxis, UI_SIZE_PARENT_RATIO, thumbRatio, 0);
|
|
|
|
ui_box_set_size(thumb, secondAxis, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
|
|
|
|
ui_box* afterSpacer = ui_box_make("after", 0);
|
|
|
|
ui_box_set_size(afterSpacer, trackAxis, UI_SIZE_PARENT_RATIO, afterRatio, 0);
|
|
|
|
ui_box_set_size(afterSpacer, secondAxis, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
|
|
|
|
ui_box_end();
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_pop_bg_color();
|
|
|
|
ui_pop_fg_color();
|
|
|
|
ui_pop_roundness();
|
|
|
|
ui_pop_bg_color();
|
|
|
|
ui_pop_fg_color();
|
|
|
|
ui_pop_roundness();
|
|
|
|
ui_pop_animation_time();
|
2022-08-19 17:46:31 +00:00
|
|
|
ui_pop_animation_flags();
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
//NOTE: interaction
|
|
|
|
ui_sig thumbSig = ui_box_sig(thumb);
|
|
|
|
if(thumbSig.dragging)
|
|
|
|
{
|
|
|
|
f32 trackExtents = track->rect.c[2+trackAxis] - thumb->rect.c[2+trackAxis];
|
|
|
|
f32 delta = thumbSig.delta.c[trackAxis]/trackExtents;
|
|
|
|
f32 oldValue = *scrollValue;
|
|
|
|
|
|
|
|
*scrollValue += delta;
|
|
|
|
*scrollValue = Clamp(*scrollValue, 0, 1);
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_sig trackSig = ui_box_sig(track);
|
2022-08-15 16:28:13 +00:00
|
|
|
|
|
|
|
if(ui_box_active(frame))
|
|
|
|
{
|
|
|
|
//NOTE: activated from outside
|
|
|
|
ui_box_set_hot(track, true);
|
|
|
|
ui_box_set_hot(thumb, true);
|
|
|
|
ui_box_activate(track);
|
|
|
|
ui_box_activate(thumb);
|
|
|
|
}
|
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
if(trackSig.hovering)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_box_set_hot(track, true);
|
|
|
|
ui_box_set_hot(thumb, true);
|
|
|
|
}
|
2022-08-15 16:28:13 +00:00
|
|
|
else if(thumbSig.wheel.c[trackAxis] == 0)
|
2022-08-15 08:20:29 +00:00
|
|
|
{
|
|
|
|
ui_box_set_hot(track, false);
|
|
|
|
ui_box_set_hot(thumb, false);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
2022-08-15 08:20:29 +00:00
|
|
|
|
2022-08-14 16:19:40 +00:00
|
|
|
if(thumbSig.dragging)
|
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_box_activate(track);
|
|
|
|
ui_box_activate(thumb);
|
|
|
|
}
|
2022-08-15 16:28:13 +00:00
|
|
|
else if(thumbSig.wheel.c[trackAxis] == 0)
|
2022-08-15 08:20:29 +00:00
|
|
|
{
|
|
|
|
ui_box_deactivate(track);
|
|
|
|
ui_box_deactivate(thumb);
|
2022-08-15 16:28:13 +00:00
|
|
|
ui_box_deactivate(frame);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
} ui_box_end();
|
|
|
|
|
|
|
|
return(frame);
|
|
|
|
}
|
|
|
|
|
2022-08-15 15:20:44 +00:00
|
|
|
ui_box* ui_panel_begin(const char* name)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_flags panelFlags = UI_FLAG_DRAW_BACKGROUND
|
|
|
|
| UI_FLAG_DRAW_BORDER
|
|
|
|
| UI_FLAG_CLIP
|
|
|
|
| UI_FLAG_BLOCK_MOUSE;
|
|
|
|
ui_box* panel = ui_box_begin(name, panelFlags);
|
|
|
|
|
2022-08-15 15:20:44 +00:00
|
|
|
return(panel);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
void ui_panel_end()
|
|
|
|
{
|
|
|
|
ui_box* panel = ui_box_top();
|
2022-08-15 16:28:13 +00:00
|
|
|
ui_sig sig = ui_box_sig(panel);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
f32 contentsW = ClampLowBound(panel->childrenSum[0], panel->rect.w);
|
|
|
|
f32 contentsH = ClampLowBound(panel->childrenSum[1], panel->rect.h);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
contentsW = ClampLowBound(contentsW, 1);
|
|
|
|
contentsH = ClampLowBound(contentsH, 1);
|
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
ui_box* scrollBarX = 0;
|
|
|
|
ui_box* scrollBarY = 0;
|
|
|
|
|
|
|
|
if(contentsW > panel->rect.w)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-15 16:28:13 +00:00
|
|
|
f32 thumbRatioX = panel->rect.w / contentsW;
|
|
|
|
f32 sliderX = panel->scroll.x /(contentsW - panel->rect.w);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
scrollBarX = ui_scrollbar("scrollerX", thumbRatioX, &sliderX);
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_box_set_size(scrollBarX, UI_AXIS_X, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
ui_box_set_size(scrollBarX, UI_AXIS_Y, UI_SIZE_PIXELS, 10, 0);
|
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
panel->scroll.x = sliderX * (contentsW - panel->rect.w);
|
|
|
|
if(sig.hovering)
|
|
|
|
{
|
|
|
|
panel->scroll.x += sig.wheel.x;
|
|
|
|
ui_box_activate(scrollBarX);
|
|
|
|
}
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
if(contentsH > panel->rect.h)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-15 16:28:13 +00:00
|
|
|
f32 thumbRatioY = panel->rect.h / contentsH;
|
|
|
|
f32 sliderY = panel->scroll.y /(contentsH - panel->rect.h);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
scrollBarY = ui_scrollbar("scrollerY", thumbRatioY, &sliderY);
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_box_set_size(scrollBarY, UI_AXIS_X, UI_SIZE_PIXELS, 10, 0);
|
|
|
|
ui_box_set_size(scrollBarY, UI_AXIS_Y, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
panel->scroll.y = sliderY * (contentsH - panel->rect.h);
|
|
|
|
if(sig.hovering)
|
|
|
|
{
|
|
|
|
panel->scroll.y += sig.wheel.y;
|
|
|
|
ui_box_activate(scrollBarY);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-16 07:58:16 +00:00
|
|
|
panel->scroll.x = Clamp(panel->scroll.x, 0, contentsW - panel->rect.w);
|
|
|
|
panel->scroll.y = Clamp(panel->scroll.y, 0, contentsH - panel->rect.h);
|
|
|
|
|
2022-08-15 16:28:13 +00:00
|
|
|
if(scrollBarX)
|
|
|
|
{
|
|
|
|
ui_box_set_floating(scrollBarX, UI_AXIS_X, panel->scroll.x);
|
|
|
|
ui_box_set_floating(scrollBarX, UI_AXIS_Y, panel->scroll.y + panel->rect.h - 12);
|
|
|
|
}
|
|
|
|
|
|
|
|
if(scrollBarY)
|
|
|
|
{
|
|
|
|
ui_box_set_floating(scrollBarY, UI_AXIS_X, panel->scroll.x + panel->rect.w - 12);
|
|
|
|
ui_box_set_floating(scrollBarY, UI_AXIS_Y, panel->scroll.y);
|
2022-08-14 16:19:40 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
ui_box_end();
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_sig ui_tooltip_begin(const char* name)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_box_push(ui->overlay);
|
|
|
|
|
|
|
|
vec2 p = ui_mouse_position();
|
|
|
|
|
|
|
|
ui_flags flags = UI_FLAG_DRAW_BACKGROUND
|
|
|
|
| UI_FLAG_DRAW_BORDER;
|
|
|
|
|
|
|
|
ui_box* tooltip = ui_box_make(name, flags);
|
|
|
|
ui_box_set_size(tooltip, UI_AXIS_X, UI_SIZE_CHILDREN, 0, 0);
|
|
|
|
ui_box_set_size(tooltip, UI_AXIS_Y, UI_SIZE_CHILDREN, 0, 0);
|
|
|
|
ui_box_set_floating(tooltip, UI_AXIS_X, p.x);
|
|
|
|
ui_box_set_floating(tooltip, UI_AXIS_Y, p.y);
|
|
|
|
ui_box_push(tooltip);
|
|
|
|
|
|
|
|
return(ui_box_sig(tooltip));
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_tooltip_end(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_box_pop(); // tooltip
|
|
|
|
ui_box_pop(); // ui->overlay
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_menu_bar_begin(const char* name)
|
|
|
|
{
|
|
|
|
ui_box* bar = ui_box_begin(name, UI_FLAG_DRAW_BACKGROUND);
|
|
|
|
ui_box_set_size(bar, UI_AXIS_X, UI_SIZE_PARENT_RATIO, 1., 0);
|
|
|
|
ui_box_set_size(bar, UI_AXIS_Y, UI_SIZE_CHILDREN, 0, 0);
|
|
|
|
ui_box_set_layout(bar, UI_AXIS_X, UI_ALIGN_START, UI_ALIGN_START);
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_push_size(UI_AXIS_X, UI_SIZE_TEXT, 0, 0);
|
|
|
|
ui_push_size(UI_AXIS_Y, UI_SIZE_TEXT, 0, 0);
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
ui_sig sig = ui_box_sig(bar);
|
2023-03-04 18:24:30 +00:00
|
|
|
if(!sig.hovering && mp_mouse_released(MP_MOUSE_LEFT))
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_box_deactivate(bar);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_menu_bar_end(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_pop_size(UI_AXIS_X);
|
|
|
|
ui_pop_size(UI_AXIS_Y);
|
2022-08-14 16:19:40 +00:00
|
|
|
ui_box_end(); // menu bar
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_menu_begin(const char* label)
|
|
|
|
{
|
|
|
|
ui_box* button = ui_box_make(label, UI_FLAG_CLICKABLE | UI_FLAG_DRAW_TEXT);
|
|
|
|
ui_box* bar = button->parent;
|
|
|
|
|
|
|
|
ui_sig sig = ui_box_sig(button);
|
|
|
|
ui_sig barSig = ui_box_sig(bar);
|
|
|
|
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
ui_box_push(ui->overlay);
|
|
|
|
|
|
|
|
ui_flags flags = UI_FLAG_DRAW_BACKGROUND
|
|
|
|
| UI_FLAG_DRAW_BORDER;
|
|
|
|
|
|
|
|
ui_box* menu = ui_box_make(label, flags);
|
|
|
|
ui_box_set_size(menu, UI_AXIS_X, UI_SIZE_CHILDREN, 0, 0);
|
|
|
|
ui_box_set_size(menu, UI_AXIS_Y, UI_SIZE_CHILDREN, 0, 0);
|
|
|
|
ui_box_set_floating(menu, UI_AXIS_X, button->rect.x);
|
|
|
|
ui_box_set_floating(menu, UI_AXIS_Y, button->rect.y + button->rect.h);
|
|
|
|
ui_box_set_layout(menu, UI_AXIS_Y, UI_ALIGN_START, UI_ALIGN_START);
|
|
|
|
|
|
|
|
if(ui_box_active(bar))
|
|
|
|
{
|
|
|
|
if(sig.hovering)
|
|
|
|
{
|
|
|
|
ui_box_activate(button);
|
|
|
|
}
|
|
|
|
else if(barSig.hovering)
|
|
|
|
{
|
|
|
|
ui_box_deactivate(button);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
ui_box_deactivate(button);
|
|
|
|
if(sig.pressed)
|
|
|
|
{
|
|
|
|
ui_box_activate(bar);
|
|
|
|
ui_box_activate(button);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_box_set_closed(menu, !ui_box_active(button));
|
|
|
|
ui_box_push(menu);
|
|
|
|
}
|
|
|
|
|
2022-08-19 17:46:31 +00:00
|
|
|
void ui_menu_end(void)
|
2022-08-14 16:19:40 +00:00
|
|
|
{
|
|
|
|
ui_box_pop(); // menu
|
|
|
|
ui_box_pop(); // overlay;
|
|
|
|
}
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
////////////////////////////////////////////////////////////////////////////////////////////////
|
|
|
|
|
|
|
|
/*
|
|
|
|
void ui_edit_set_cursor_from_mouse(ui_context* gui, ui_style* style, f32 textStartX)
|
|
|
|
{
|
|
|
|
mp_graphics_font_extents fontExtents;
|
|
|
|
mp_graphics_font_get_extents(gui->graphics, style->font, &fontExtents);
|
|
|
|
f32 fontScale = mp_graphics_font_get_scale_for_em_pixels(gui->graphics, style->font, style->fontSize);
|
|
|
|
|
|
|
|
//NOTE(martin): find cursor position from mouse position
|
|
|
|
gui->editCursor = gui->editBufferSize;
|
|
|
|
|
|
|
|
mp_graphics_text_extents glyphExtents[UI_EDIT_BUFFER_MAX_SIZE];
|
|
|
|
mp_string32 codePoints = {gui->editBufferSize, gui->editBuffer};
|
|
|
|
mp_string32 glyphs = mp_graphics_font_push_glyph_indices(gui->graphics, style->font, mem_scratch(), codePoints);
|
|
|
|
mp_graphics_font_get_glyph_extents(gui->graphics, style->font, glyphs, glyphExtents);
|
|
|
|
|
|
|
|
mp_graphics_set_font(gui->graphics, style->font);
|
|
|
|
vec2 dimToFirst = mp_graphics_get_glyphs_dimensions(gui->graphics, mp_string32_slice(glyphs, 0, gui->firstDisplayedChar));
|
|
|
|
|
|
|
|
ui_transform tr = ui_transform_top(gui);
|
|
|
|
f32 x = gui->input.mouse.x + tr.x - textStartX;
|
|
|
|
f32 glyphX = -dimToFirst.x;
|
|
|
|
|
|
|
|
for(int i=0; i<gui->editBufferSize; i++)
|
|
|
|
{
|
|
|
|
if(x < glyphX + glyphExtents[i].xAdvance*fontScale/2)
|
|
|
|
{
|
|
|
|
gui->editCursor = i;
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
glyphX += glyphExtents[i].xAdvance*fontScale;
|
|
|
|
}
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
*/
|
|
|
|
|
|
|
|
str32 ui_edit_replace_selection_with_codepoints(ui_context* ui, str32 codepoints, str32 input)
|
|
|
|
{
|
|
|
|
u32 start = minimum(ui->editCursor, ui->editMark);
|
|
|
|
u32 end = maximum(ui->editCursor, ui->editMark);
|
|
|
|
|
|
|
|
str32 before = str32_slice(codepoints, 0, start);
|
|
|
|
str32 after = str32_slice(codepoints, end, codepoints.len);
|
|
|
|
|
|
|
|
str32_list list = {};
|
|
|
|
str32_list_push(&ui->frameArena, &list, before);
|
|
|
|
str32_list_push(&ui->frameArena, &list, input);
|
|
|
|
str32_list_push(&ui->frameArena, &list, after);
|
|
|
|
|
|
|
|
codepoints = str32_list_join(&ui->frameArena, list);
|
|
|
|
|
|
|
|
ui->editCursor = start + input.len;
|
|
|
|
ui->editMark = ui->editCursor;
|
|
|
|
return(codepoints);
|
|
|
|
}
|
|
|
|
|
|
|
|
str32 ui_edit_delete_selection(ui_context* ui, str32 codepoints)
|
|
|
|
{
|
|
|
|
return(ui_edit_replace_selection_with_codepoints(ui, codepoints, (str32){0}));
|
|
|
|
}
|
|
|
|
|
|
|
|
void ui_edit_copy_selection_to_clipboard(ui_context* ui, str32 codepoints)
|
|
|
|
{
|
|
|
|
if(ui->editCursor == ui->editMark)
|
|
|
|
{
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
u32 start = minimum(ui->editCursor, ui->editMark);
|
|
|
|
u32 end = maximum(ui->editCursor, ui->editMark);
|
|
|
|
str32 selection = str32_slice(codepoints, start, end);
|
|
|
|
str8 string = utf8_push_from_codepoints(&ui->frameArena, selection);
|
|
|
|
|
|
|
|
mp_clipboard_clear();
|
|
|
|
mp_clipboard_set_string(string);
|
|
|
|
}
|
|
|
|
|
|
|
|
str32 ui_edit_replace_selection_with_clipboard(ui_context* ui, str32 codepoints)
|
|
|
|
{
|
|
|
|
str8 string = mp_clipboard_get_string(&ui->frameArena);
|
|
|
|
str32 input = utf8_push_to_codepoints(&ui->frameArena, string);
|
|
|
|
str32 result = ui_edit_replace_selection_with_codepoints(ui, codepoints, input);
|
|
|
|
return(result);
|
|
|
|
}
|
|
|
|
|
|
|
|
typedef enum {
|
|
|
|
UI_EDIT_MOVE,
|
|
|
|
UI_EDIT_SELECT,
|
|
|
|
UI_EDIT_SELECT_EXTEND,
|
|
|
|
UI_EDIT_DELETE,
|
|
|
|
UI_EDIT_CUT,
|
|
|
|
UI_EDIT_COPY,
|
|
|
|
UI_EDIT_PASTE,
|
|
|
|
UI_EDIT_SELECT_ALL } ui_edit_op;
|
|
|
|
|
|
|
|
typedef enum {
|
|
|
|
UI_EDIT_MOVE_NONE = 0,
|
|
|
|
UI_EDIT_MOVE_ONE,
|
|
|
|
UI_EDIT_MOVE_WORD,
|
|
|
|
UI_EDIT_MOVE_LINE } ui_edit_move;
|
|
|
|
|
|
|
|
typedef struct ui_edit_command
|
|
|
|
{
|
|
|
|
mp_key_code key;
|
2023-03-04 18:24:30 +00:00
|
|
|
mp_keymod_flags mods;
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
ui_edit_op operation;
|
|
|
|
ui_edit_move move;
|
|
|
|
int direction;
|
|
|
|
|
|
|
|
} ui_edit_command;
|
|
|
|
|
|
|
|
const ui_edit_command UI_EDIT_COMMANDS[] = {
|
|
|
|
//NOTE(martin): move one left
|
|
|
|
{
|
|
|
|
.key = MP_KEY_LEFT,
|
|
|
|
.operation = UI_EDIT_MOVE,
|
|
|
|
.move = UI_EDIT_MOVE_ONE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
//NOTE(martin): move one right
|
|
|
|
{
|
|
|
|
.key = MP_KEY_RIGHT,
|
|
|
|
.operation = UI_EDIT_MOVE,
|
|
|
|
.move = UI_EDIT_MOVE_ONE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
//NOTE(martin): move start
|
|
|
|
{
|
|
|
|
.key = MP_KEY_Q,
|
|
|
|
.mods = MP_KEYMOD_CTRL,
|
|
|
|
.operation = UI_EDIT_MOVE,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
{
|
|
|
|
.key = MP_KEY_UP,
|
|
|
|
.operation = UI_EDIT_MOVE,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
//NOTE(martin): move end
|
|
|
|
{
|
|
|
|
.key = MP_KEY_E,
|
|
|
|
.mods = MP_KEYMOD_CTRL,
|
|
|
|
.operation = UI_EDIT_MOVE,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
{
|
|
|
|
.key = MP_KEY_DOWN,
|
|
|
|
.operation = UI_EDIT_MOVE,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
//NOTE(martin): select one left
|
|
|
|
{
|
|
|
|
.key = MP_KEY_LEFT,
|
|
|
|
.mods = MP_KEYMOD_SHIFT,
|
|
|
|
.operation = UI_EDIT_SELECT,
|
|
|
|
.move = UI_EDIT_MOVE_ONE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
//NOTE(martin): select one right
|
|
|
|
{
|
|
|
|
.key = MP_KEY_RIGHT,
|
|
|
|
.mods = MP_KEYMOD_SHIFT,
|
|
|
|
.operation = UI_EDIT_SELECT,
|
|
|
|
.move = UI_EDIT_MOVE_ONE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
//NOTE(martin): extend select to start
|
|
|
|
{
|
|
|
|
.key = MP_KEY_Q,
|
|
|
|
.mods = MP_KEYMOD_CTRL | MP_KEYMOD_SHIFT,
|
|
|
|
.operation = UI_EDIT_SELECT_EXTEND,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
{
|
|
|
|
.key = MP_KEY_UP,
|
|
|
|
.mods = MP_KEYMOD_SHIFT,
|
|
|
|
.operation = UI_EDIT_SELECT_EXTEND,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
//NOTE(martin): extend select to end
|
|
|
|
{
|
|
|
|
.key = MP_KEY_E,
|
|
|
|
.mods = MP_KEYMOD_CTRL | MP_KEYMOD_SHIFT,
|
|
|
|
.operation = UI_EDIT_SELECT_EXTEND,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
{
|
|
|
|
.key = MP_KEY_DOWN,
|
|
|
|
.mods = MP_KEYMOD_SHIFT,
|
|
|
|
.operation = UI_EDIT_SELECT_EXTEND,
|
|
|
|
.move = UI_EDIT_MOVE_LINE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
//NOTE(martin): select all
|
|
|
|
{
|
|
|
|
.key = MP_KEY_Q,
|
|
|
|
.mods = MP_KEYMOD_CMD,
|
|
|
|
.operation = UI_EDIT_SELECT_ALL,
|
|
|
|
.move = UI_EDIT_MOVE_NONE
|
|
|
|
},
|
|
|
|
//NOTE(martin): delete
|
|
|
|
{
|
|
|
|
.key = MP_KEY_DELETE,
|
|
|
|
.operation = UI_EDIT_DELETE,
|
|
|
|
.move = UI_EDIT_MOVE_ONE,
|
|
|
|
.direction = 1
|
|
|
|
},
|
|
|
|
//NOTE(martin): backspace
|
|
|
|
{
|
|
|
|
.key = MP_KEY_BACKSPACE,
|
|
|
|
.operation = UI_EDIT_DELETE,
|
|
|
|
.move = UI_EDIT_MOVE_ONE,
|
|
|
|
.direction = -1
|
|
|
|
},
|
|
|
|
//NOTE(martin): cut
|
|
|
|
{
|
|
|
|
.key = MP_KEY_X,
|
|
|
|
.mods = MP_KEYMOD_CMD,
|
|
|
|
.operation = UI_EDIT_CUT,
|
|
|
|
.move = UI_EDIT_MOVE_NONE
|
|
|
|
},
|
|
|
|
//NOTE(martin): copy
|
|
|
|
{
|
|
|
|
.key = MP_KEY_C,
|
|
|
|
.mods = MP_KEYMOD_CMD,
|
|
|
|
.operation = UI_EDIT_COPY,
|
|
|
|
.move = UI_EDIT_MOVE_NONE
|
|
|
|
},
|
|
|
|
//NOTE(martin): paste
|
|
|
|
{
|
|
|
|
.key = MP_KEY_V,
|
|
|
|
.mods = MP_KEYMOD_CMD,
|
|
|
|
.operation = UI_EDIT_PASTE,
|
|
|
|
.move = UI_EDIT_MOVE_NONE
|
|
|
|
}
|
|
|
|
};
|
|
|
|
|
|
|
|
const u32 UI_EDIT_COMMAND_COUNT = sizeof(UI_EDIT_COMMANDS)/sizeof(ui_edit_command);
|
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
void ui_edit_perform_move(ui_context* ui, ui_edit_move move, int direction, u32 textLen)
|
2022-08-15 08:20:29 +00:00
|
|
|
{
|
|
|
|
switch(move)
|
|
|
|
{
|
|
|
|
case UI_EDIT_MOVE_NONE:
|
|
|
|
break;
|
|
|
|
|
|
|
|
case UI_EDIT_MOVE_ONE:
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
if(direction < 0 && ui->editCursor > 0)
|
2022-08-15 08:20:29 +00:00
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
ui->editCursor--;
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
2023-03-03 19:09:44 +00:00
|
|
|
else if(direction > 0 && ui->editCursor < textLen)
|
2022-08-15 08:20:29 +00:00
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
ui->editCursor++;
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_MOVE_LINE:
|
|
|
|
{
|
|
|
|
if(direction < 0)
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
ui->editCursor = 0;
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
else if(direction > 0)
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
ui->editCursor = textLen;
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_MOVE_WORD:
|
|
|
|
DEBUG_ASSERT(0, "not implemented yet");
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
str32 ui_edit_perform_operation(ui_context* ui, ui_edit_op operation, ui_edit_move move, int direction, str32 codepoints)
|
|
|
|
{
|
|
|
|
switch(operation)
|
|
|
|
{
|
|
|
|
case UI_EDIT_MOVE:
|
|
|
|
{
|
|
|
|
//NOTE(martin): we place the cursor on the direction-most side of the selection
|
|
|
|
// before performing the move
|
|
|
|
u32 cursor = direction < 0 ?
|
2023-03-03 19:09:44 +00:00
|
|
|
minimum(ui->editCursor, ui->editMark) :
|
|
|
|
maximum(ui->editCursor, ui->editMark);
|
|
|
|
ui->editCursor = cursor;
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
if(ui->editCursor == ui->editMark || move != UI_EDIT_MOVE_ONE)
|
|
|
|
{
|
|
|
|
//NOTE: we special case move-one when there is a selection
|
|
|
|
// (just place the cursor at begining/end of selection)
|
2023-03-03 19:09:44 +00:00
|
|
|
ui_edit_perform_move(ui, move, direction, codepoints.len);
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
ui->editMark = ui->editCursor;
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_SELECT:
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
ui_edit_perform_move(ui, move, direction, codepoints.len);
|
2022-08-15 08:20:29 +00:00
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_SELECT_EXTEND:
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
if((direction > 0) != (ui->editCursor > ui->editMark))
|
|
|
|
{
|
|
|
|
u32 tmp = ui->editCursor;
|
|
|
|
ui->editCursor = ui->editMark;
|
|
|
|
ui->editMark = tmp;
|
|
|
|
}
|
|
|
|
ui_edit_perform_move(ui, move, direction, codepoints.len);
|
2022-08-15 08:20:29 +00:00
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_DELETE:
|
|
|
|
{
|
|
|
|
if(ui->editCursor == ui->editMark)
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
ui_edit_perform_move(ui, move, direction, codepoints.len);
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
codepoints = ui_edit_delete_selection(ui, codepoints);
|
|
|
|
ui->editMark = ui->editCursor;
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_CUT:
|
|
|
|
{
|
|
|
|
ui_edit_copy_selection_to_clipboard(ui, codepoints);
|
|
|
|
codepoints = ui_edit_delete_selection(ui, codepoints);
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_COPY:
|
|
|
|
{
|
|
|
|
ui_edit_copy_selection_to_clipboard(ui, codepoints);
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_PASTE:
|
|
|
|
{
|
|
|
|
codepoints = ui_edit_replace_selection_with_clipboard(ui, codepoints);
|
|
|
|
} break;
|
|
|
|
|
|
|
|
case UI_EDIT_SELECT_ALL:
|
|
|
|
{
|
|
|
|
ui->editCursor = 0;
|
|
|
|
ui->editMark = codepoints.len;
|
|
|
|
} break;
|
|
|
|
}
|
2022-08-15 15:20:44 +00:00
|
|
|
ui->editCursorBlinkStart = ui->frameTime;
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
return(codepoints);
|
|
|
|
}
|
|
|
|
|
2023-03-03 16:13:03 +00:00
|
|
|
void ui_text_box_render(ui_box* box, void* data)
|
2022-08-15 15:20:44 +00:00
|
|
|
{
|
|
|
|
str32 codepoints = *(str32*)data;
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
u32 firstDisplayedChar = 0;
|
|
|
|
if(ui_box_active(box))
|
|
|
|
{
|
|
|
|
firstDisplayedChar = ui->editFirstDisplayedChar;
|
|
|
|
}
|
|
|
|
|
|
|
|
ui_style* style = &box->computedStyle;
|
|
|
|
mg_font_extents extents = mg_font_get_scaled_extents(style->font, style->fontSize);
|
|
|
|
f32 lineHeight = extents.ascent + extents.descent;
|
|
|
|
|
|
|
|
str32 before = str32_slice(codepoints, 0, firstDisplayedChar);
|
|
|
|
mp_rect beforeBox = mg_text_bounding_box_utf32(style->font, style->fontSize, before);
|
|
|
|
|
|
|
|
f32 textMargin = 5;
|
|
|
|
|
|
|
|
f32 textX = textMargin + box->rect.x - beforeBox.w;
|
|
|
|
f32 textTop = box->rect.y + 0.5*(box->rect.h - lineHeight);
|
|
|
|
f32 textY = textTop + extents.ascent ;
|
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
if(box->active)
|
2022-08-15 15:20:44 +00:00
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
u32 selectStart = minimum(ui->editCursor, ui->editMark);
|
|
|
|
u32 selectEnd = maximum(ui->editCursor, ui->editMark);
|
2022-08-15 15:20:44 +00:00
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
str32 beforeSelect = str32_slice(codepoints, 0, selectStart);
|
|
|
|
mp_rect beforeSelectBox = mg_text_bounding_box_utf32(style->font, style->fontSize, beforeSelect);
|
|
|
|
beforeSelectBox.x += textX + beforeBox.x + beforeBox.w;
|
|
|
|
beforeSelectBox.y += textY;
|
2022-08-15 15:20:44 +00:00
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
if(selectStart != selectEnd)
|
|
|
|
{
|
|
|
|
str32 select = str32_slice(codepoints, selectStart, selectEnd);
|
|
|
|
str32 afterSelect = str32_slice(codepoints, selectEnd, codepoints.len);
|
|
|
|
mp_rect selectBox = mg_text_bounding_box_utf32(style->font, style->fontSize, select);
|
|
|
|
mp_rect afterSelectBox = mg_text_bounding_box_utf32(style->font, style->fontSize, afterSelect);
|
|
|
|
|
|
|
|
selectBox.x += beforeSelectBox.x + beforeSelectBox.w;
|
|
|
|
selectBox.y += textY;
|
|
|
|
|
|
|
|
mg_set_color_rgba(0, 0, 1, 1);
|
|
|
|
mg_rectangle_fill(selectBox.x, selectBox.y, selectBox.w, lineHeight);
|
|
|
|
|
|
|
|
mg_set_font(style->font);
|
|
|
|
mg_set_font_size(style->fontSize);
|
|
|
|
mg_set_color(style->fontColor);
|
|
|
|
|
|
|
|
mg_move_to(textX, textY);
|
|
|
|
mg_codepoints_outlines(beforeSelect);
|
|
|
|
mg_fill();
|
|
|
|
|
|
|
|
mg_set_color_rgba(1, 1, 1, 1);
|
|
|
|
mg_codepoints_outlines(select);
|
|
|
|
mg_fill();
|
|
|
|
|
|
|
|
mg_set_color(style->fontColor);
|
|
|
|
mg_codepoints_outlines(afterSelect);
|
|
|
|
mg_fill();
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
if(!((u64)(2*(ui->frameTime - ui->editCursorBlinkStart)) & 1))
|
|
|
|
{
|
|
|
|
f32 caretX = box->rect.x + textMargin - beforeBox.w + beforeSelectBox.w;
|
|
|
|
f32 caretY = textTop;
|
|
|
|
mg_set_color_rgba(0, 0, 0, 1);
|
|
|
|
mg_rectangle_fill(caretX, caretY, 2, lineHeight);
|
|
|
|
}
|
|
|
|
mg_set_font(style->font);
|
|
|
|
mg_set_font_size(style->fontSize);
|
|
|
|
mg_set_color(style->fontColor);
|
2022-08-15 15:20:44 +00:00
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
mg_move_to(textX, textY);
|
|
|
|
mg_codepoints_outlines(codepoints);
|
|
|
|
mg_fill();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
mg_set_font(style->font);
|
|
|
|
mg_set_font_size(style->fontSize);
|
|
|
|
mg_set_color(style->fontColor);
|
2022-08-15 15:20:44 +00:00
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
mg_move_to(textX, textY);
|
|
|
|
mg_codepoints_outlines(codepoints);
|
|
|
|
mg_fill();
|
|
|
|
}
|
2022-08-15 15:20:44 +00:00
|
|
|
}
|
|
|
|
|
2022-08-15 08:20:29 +00:00
|
|
|
ui_text_box_result ui_text_box(const char* name, mem_arena* arena, str8 text)
|
|
|
|
{
|
|
|
|
ui_context* ui = ui_get_context();
|
|
|
|
|
|
|
|
ui_text_box_result result = {.text = text};
|
|
|
|
|
|
|
|
ui_flags frameFlags = UI_FLAG_CLICKABLE
|
|
|
|
| UI_FLAG_DRAW_BACKGROUND
|
|
|
|
| UI_FLAG_DRAW_BORDER
|
|
|
|
| UI_FLAG_CLIP
|
2022-08-15 15:20:44 +00:00
|
|
|
| UI_FLAG_DRAW_RENDER_PROC
|
2022-08-15 08:20:29 +00:00
|
|
|
| UI_FLAG_SCROLLABLE;
|
|
|
|
|
|
|
|
ui_box* frame = ui_box_make(name, frameFlags);
|
2022-08-15 15:20:44 +00:00
|
|
|
ui_style* style = &frame->computedStyle;
|
|
|
|
mg_font_extents extents = mg_font_get_scaled_extents(style->font, style->fontSize);
|
|
|
|
ui_box_set_size(frame, UI_AXIS_Y, UI_SIZE_PIXELS, extents.ascent+extents.descent+10, 1);
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
ui_sig sig = ui_box_sig(frame);
|
|
|
|
|
|
|
|
if(sig.hovering)
|
|
|
|
{
|
|
|
|
ui_box_set_hot(frame, true);
|
|
|
|
|
|
|
|
if(sig.pressed)
|
|
|
|
{
|
|
|
|
if(!ui_box_active(frame))
|
|
|
|
{
|
|
|
|
ui_box_activate(frame);
|
|
|
|
|
|
|
|
//NOTE: focus
|
|
|
|
ui->focus = frame;
|
|
|
|
ui->editFirstDisplayedChar = 0;
|
|
|
|
ui->editCursor = 0;
|
|
|
|
ui->editMark = 0;
|
|
|
|
}
|
2023-03-05 14:59:57 +00:00
|
|
|
ui->editCursorBlinkStart = ui->frameTime;
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
|
2023-03-05 14:59:57 +00:00
|
|
|
if(sig.pressed || sig.dragging)
|
|
|
|
{
|
|
|
|
//NOTE: set cursor/extend selection on mouse press or drag
|
|
|
|
vec2 pos = ui_mouse_position();
|
|
|
|
f32 textMargin = 5; //TODO parameterize this margin! must be the same as in ui_text_box_render
|
|
|
|
f32 cursorX = pos.x - frame->rect.x - textMargin;
|
|
|
|
|
|
|
|
str32 codepoints = utf8_push_to_codepoints(&ui->frameArena, text);
|
|
|
|
i32 newCursor = codepoints.len;
|
|
|
|
f32 x = 0;
|
|
|
|
for(int i = ui->editFirstDisplayedChar; i<codepoints.len; i++)
|
|
|
|
{
|
|
|
|
mp_rect bbox = mg_text_bounding_box_utf32(style->font, style->fontSize, str32_slice(codepoints, i, i+1));
|
|
|
|
if(x + 0.5*bbox.w > cursorX)
|
|
|
|
{
|
|
|
|
newCursor = i;
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
x += bbox.w;
|
|
|
|
}
|
|
|
|
//NOTE: put cursor the closest to new cursor (this maximizes the resulting selection,
|
|
|
|
// and seems to be the standard behaviour across a number of text editor)
|
|
|
|
if(abs(newCursor - ui->editCursor) > abs(newCursor - ui->editMark))
|
|
|
|
{
|
|
|
|
i32 tmp = ui->editCursor;
|
|
|
|
ui->editCursor = ui->editMark;
|
|
|
|
ui->editMark = tmp;
|
|
|
|
}
|
|
|
|
//NOTE: set the new cursor, and set or leave the mark depending on mode
|
|
|
|
ui->editCursor = newCursor;
|
|
|
|
if(sig.pressed && !(mp_key_mods() & MP_KEYMOD_SHIFT))
|
|
|
|
{
|
|
|
|
ui->editMark = ui->editCursor;
|
|
|
|
}
|
|
|
|
}
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
ui_box_set_hot(frame, false);
|
|
|
|
|
|
|
|
if(sig.pressed)
|
|
|
|
{
|
|
|
|
if(ui_box_active(frame))
|
|
|
|
{
|
|
|
|
ui_box_deactivate(frame);
|
|
|
|
|
|
|
|
//NOTE loose focus
|
|
|
|
ui->focus = 0;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if(ui_box_active(frame))
|
|
|
|
{
|
2023-03-03 19:09:44 +00:00
|
|
|
str32 oldCodepoints = utf8_push_to_codepoints(&ui->frameArena, text);
|
|
|
|
str32 codepoints = oldCodepoints;
|
2022-08-15 08:20:29 +00:00
|
|
|
ui->editCursor = Clamp(ui->editCursor, 0, codepoints.len);
|
|
|
|
ui->editMark = Clamp(ui->editMark, 0, codepoints.len);
|
|
|
|
|
|
|
|
//NOTE replace selection with input codepoints
|
|
|
|
str32 input = mp_input_text_utf32(&ui->frameArena);
|
|
|
|
if(input.len)
|
|
|
|
{
|
|
|
|
codepoints = ui_edit_replace_selection_with_codepoints(ui, codepoints, input);
|
2022-08-15 15:20:44 +00:00
|
|
|
ui->editCursorBlinkStart = ui->frameTime;
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
//NOTE handle shortcuts
|
2023-03-04 18:24:30 +00:00
|
|
|
mp_keymod_flags mods = mp_key_mods();
|
2022-08-15 08:20:29 +00:00
|
|
|
|
|
|
|
for(int i=0; i<UI_EDIT_COMMAND_COUNT; i++)
|
|
|
|
{
|
|
|
|
const ui_edit_command* command = &(UI_EDIT_COMMANDS[i]);
|
2023-03-03 19:09:44 +00:00
|
|
|
|
2023-03-05 15:35:55 +00:00
|
|
|
if( (mp_key_pressed(command->key) || mp_key_repeated(command->key))
|
|
|
|
&& mods == command->mods)
|
2022-08-15 08:20:29 +00:00
|
|
|
{
|
|
|
|
codepoints = ui_edit_perform_operation(ui, command->operation, command->move, command->direction, codepoints);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2022-08-15 15:20:44 +00:00
|
|
|
//NOTE(martin): text box focus shortcuts
|
2023-03-04 18:24:30 +00:00
|
|
|
if(mp_key_pressed(MP_KEY_ENTER))
|
2022-08-15 15:20:44 +00:00
|
|
|
{
|
|
|
|
//TODO(martin): extract in gui_edit_complete() (and use below)
|
|
|
|
ui_box_deactivate(frame);
|
|
|
|
ui->focus = 0;
|
|
|
|
}
|
2022-08-15 08:20:29 +00:00
|
|
|
|
2023-03-03 19:09:44 +00:00
|
|
|
if(oldCodepoints.ptr != codepoints.ptr)
|
|
|
|
{
|
|
|
|
result.changed = true;
|
|
|
|
result.text = utf8_push_from_codepoints(arena, codepoints);
|
|
|
|
}
|
2022-08-15 08:20:29 +00:00
|
|
|
|
2023-03-05 15:35:55 +00:00
|
|
|
//NOTE slide contents
|
|
|
|
{
|
|
|
|
if(ui->editCursor < ui->editFirstDisplayedChar)
|
|
|
|
{
|
|
|
|
ui->editFirstDisplayedChar = ui->editCursor;
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
f32 textMargin = 5.; //TODO: pull this out and make it configurable
|
|
|
|
i32 firstDisplayedChar = ui->editFirstDisplayedChar;
|
|
|
|
str32 firstToCursor = str32_slice(codepoints, firstDisplayedChar, ui->editCursor);
|
|
|
|
mp_rect firstToCursorBox = mg_text_bounding_box_utf32(style->font, style->fontSize, firstToCursor);
|
|
|
|
|
|
|
|
while(firstToCursorBox.w > (frame->rect.w - 2*textMargin))
|
|
|
|
{
|
|
|
|
firstDisplayedChar++;
|
|
|
|
firstToCursor = str32_slice(codepoints, firstDisplayedChar, ui->editCursor);
|
|
|
|
firstToCursorBox = mg_text_bounding_box_utf32(style->font, style->fontSize, firstToCursor);
|
|
|
|
}
|
|
|
|
|
|
|
|
ui->editFirstDisplayedChar = firstDisplayedChar;
|
|
|
|
}
|
|
|
|
}
|
2022-08-15 08:20:29 +00:00
|
|
|
|
2022-08-15 15:20:44 +00:00
|
|
|
//NOTE: set renderer
|
|
|
|
str32* renderCodepoints = mem_arena_alloc_type(&ui->frameArena, str32);
|
|
|
|
*renderCodepoints = str32_push_copy(&ui->frameArena, codepoints);
|
|
|
|
ui_box_set_render_proc(frame, ui_text_box_render, renderCodepoints);
|
|
|
|
}
|
|
|
|
else
|
|
|
|
{
|
|
|
|
//NOTE: set renderer
|
|
|
|
str32* renderCodepoints = mem_arena_alloc_type(&ui->frameArena, str32);
|
|
|
|
*renderCodepoints = utf8_push_to_codepoints(&ui->frameArena, text);
|
|
|
|
ui_box_set_render_proc(frame, ui_text_box_render, renderCodepoints);
|
2022-08-15 08:20:29 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
return(result);
|
|
|
|
}
|
2022-08-14 16:19:40 +00:00
|
|
|
|
|
|
|
|
|
|
|
#undef LOG_SUBSYSTEM
|