X-Git-Url: https://harrygodden.com/git/?a=blobdiff_plain;f=vg%2Fvg_ui.h;h=da50e081c3b53c39aa59297297e1340fb8946299;hb=d7f11d926bc3972eba39b51099e216188e87b3ca;hp=9758d9840c4add9c0fd524b4b3a056730a0aa36a;hpb=1b1332c5be3ffc9a4f59d95d0f087d3a92e3b135;p=fishladder.git diff --git a/vg/vg_ui.h b/vg/vg_ui.h index 9758d98..da50e08 100644 --- a/vg/vg_ui.h +++ b/vg/vg_ui.h @@ -1,21 +1,45 @@ // Copyright (C) 2021 Harry Godden (hgn) - All Rights Reserved -/* - Concurrent UI buffer system - Coordinate space: - - 0,0 --- +(res:x) - | - | - | -+(res:y) +SHADER_DEFINE( shader_ui, + + // VERTEX + "layout (location=0) in vec2 a_co;" // i16, i16, .. ? + "layout (location=1) in vec2 a_uv;" // i8, i8 + "layout (location=2) in vec4 a_colour;" // u32 + "uniform mat3 uPv;" + "" + "out vec2 aTexCoords;" + "out vec4 aColour;" + "" + "void main()" + "{" + "gl_Position = vec4( uPv * vec3( a_co, 1.0 ), 1.0 );" + "aTexCoords = a_uv * 0.01388888888;" + "aColour = a_colour;" + "}", -*/ + // FRAGMENT + "uniform sampler2D uTexGlyphs;" + "out vec4 FragColor;" + "" + "in vec2 aTexCoords;" + "in vec4 aColour;" + "" + "void main()" + "{" + "vec4 glyph = texture( uTexGlyphs, aTexCoords );" + "FragColor = aColour * vec4( 1.0, 1.0, 1.0, glyph.r );" + "}" + , + UNIFORMS({ "uPv", "uTexGlyphs" }) +) #define UI_AUTO_FILL 0 +//#define UI_DEBUG // Types -// ================================================================ +// =========================================================================================================== + typedef i16 ui_px; typedef u32 ui_colour; typedef ui_px ui_rect[4]; @@ -34,6 +58,20 @@ struct ui_ctx } stack[ 32 ]; + #pragma pack(push,1) + struct ui_vert + { + ui_px co[2]; + u8 uv[2]; + u32 colour; + } + *verts; + #pragma pack(pop) + + u32 num_verts; + u16 *indices; + u32 num_indices; + ui_rect cursor; u32 stack_count; u32 capture_mouse_id; @@ -45,8 +83,147 @@ struct ui_ctx int click_state; // 0: released, 1: on down, 2: pressed, 3: on release }; +// Globals +// =========================================================================================================== + +// Opengl +GLuint ui_glyph_texture; +GLuint ui_vao; +GLuint ui_vbo; +GLuint ui_ebo; + +#define UI_BUFFER_SIZE 30000 +#define UI_INDEX_SIZE 20000 + +ui_ctx ui_global_ctx = { .padding = 8 }; + + +// Initialization +// =========================================================================================================== + +static void ui_default_init(void) +{ + // Load font + { + u32 compressed[] = { + #include "fonts/weiholmir.h" + }; + + u32 pixels = 0, total = 72*72, data = 0; + u8 *image = malloc( total ); + + while( pixels < total ) + { + for( int b = 31; b >= 0; b-- ) + { + image[ pixels ++ ] = (compressed[data] & (0x1 << b))? 0xff: 0x00; + + if( pixels >= total ) + { + total = 0; + break; + } + } + data++; + } + + glGenTextures( 1, &ui_glyph_texture ); + glBindTexture( GL_TEXTURE_2D, ui_glyph_texture ); + + glTexImage2D( GL_TEXTURE_2D, 0, GL_R8, 72, 72, 0, GL_RED, GL_UNSIGNED_BYTE, image ); + + vg_tex2d_clamp(); + vg_tex2d_nearest(); + + free( image ); + } + + // Setup OpenGL memory + { + SHADER_INIT( shader_ui ); + + // Generate the buffer we are gonna be drawing to + glGenVertexArrays(1, &ui_vao); + glGenBuffers( 1, &ui_vbo ); + glGenBuffers( 1, &ui_ebo ); + glBindVertexArray( ui_vao ); + + glBindBuffer( GL_ARRAY_BUFFER, ui_vbo ); + + glBufferData( GL_ARRAY_BUFFER, UI_BUFFER_SIZE * sizeof( struct ui_vert ), NULL, GL_DYNAMIC_DRAW ); + glBindVertexArray( ui_vao ); + + glBindBuffer( GL_ELEMENT_ARRAY_BUFFER, ui_ebo ); + glBufferData( GL_ELEMENT_ARRAY_BUFFER, UI_INDEX_SIZE * sizeof( u16 ), NULL, GL_DYNAMIC_DRAW ); + + u32 const stride = sizeof( struct ui_vert ); + + // XY + glVertexAttribPointer( 0, 2, GL_UNSIGNED_SHORT, GL_FALSE, stride, (void *)offsetof( struct ui_vert, co ) ); + glEnableVertexAttribArray( 0 ); + + // UV + glVertexAttribPointer( 1, 2, GL_UNSIGNED_BYTE, GL_FALSE, stride, (void *)offsetof( struct ui_vert, uv ) ); + glEnableVertexAttribArray( 1 ); + + // COLOUR + glVertexAttribPointer( 2, 4, GL_UNSIGNED_BYTE, GL_TRUE, stride, (void *)offsetof( struct ui_vert, colour ) ); + glEnableVertexAttribArray( 2 ); + } + + // Initialize default context + { + ui_global_ctx.verts = (struct ui_vert *)malloc( UI_BUFFER_SIZE * sizeof(struct ui_vert) ); + ui_global_ctx.indices = (u16*)malloc( UI_INDEX_SIZE * sizeof(u16) ); + } +} + +static void ui_default_free(void) +{ + glDeleteTextures( 1, &ui_glyph_texture ); + + glDeleteVertexArrays( 1, &ui_vao ); + glDeleteBuffers( 1, &ui_vbo ); + glDeleteBuffers( 1, &ui_ebo ); + + free( ui_global_ctx.verts ); + free( ui_global_ctx.indices ); +} + +static void ui_draw( ui_ctx *ctx ) +{ + glBindVertexArray( ui_vao ); + + glBindBuffer( GL_ARRAY_BUFFER, ui_vbo ); + glBufferSubData( GL_ARRAY_BUFFER, 0, ctx->num_verts * sizeof( struct ui_vert ), ctx->verts ); + + glBindBuffer( GL_ELEMENT_ARRAY_BUFFER, ui_ebo ); + glBufferSubData( GL_ELEMENT_ARRAY_BUFFER, 0, ctx->num_indices * sizeof( u16 ), ctx->indices ); + + glEnable(GL_BLEND); + glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); + glBlendEquation(GL_FUNC_ADD); + + SHADER_USE( shader_ui ); + + m3x3f view = M3X3_IDENTITY; + m3x3_translate( view, (v3f){ -1.0f, 1.0f, 0.0f } ); + m3x3_scale( view, (v3f){ 1.0f/((float)vg_window_x*0.5f), -1.0f/((float)vg_window_y*0.5f), 1.0f } ); + glUniformMatrix3fv( SHADER_UNIFORM( shader_ui, "uPv" ), 1, GL_FALSE, (float *)view ); + + glActiveTexture( GL_TEXTURE0 ); + glBindTexture( GL_TEXTURE_2D, ui_glyph_texture ); + glUniform1i( SHADER_UNIFORM( shader_ui, "uTexGlyphs" ), 0 ); + + glDrawElements( GL_TRIANGLES, ctx->num_indices, GL_UNSIGNED_SHORT, (void*)(0) ); + + //vg_info( "Verts: %u, Indices: %u\n", ctx->num_verts, ctx->num_indices ); + + glDisable(GL_BLEND); +} + // Rect controls -// ========================================================== +// =========================================================================================================== static void ui_rect_copy( ui_rect src, ui_rect dst ) { @@ -56,7 +233,7 @@ static void ui_rect_copy( ui_rect src, ui_rect dst ) dst[3] = src[3]; } -static void ui_rect_pad( ui_ctx *ctx, ui_rect rect, ui_px pad ) +static void ui_rect_pad( ui_rect rect, ui_px pad ) { rect[0] += pad; rect[1] += pad; @@ -66,6 +243,7 @@ static void ui_rect_pad( ui_ctx *ctx, ui_rect rect, ui_px pad ) static void ui_vis_rect( ui_rect rect, u32 colour ) { + #ifdef UI_DEBUG v2f p0; v2f p1; @@ -78,6 +256,15 @@ static void ui_vis_rect( ui_rect rect, u32 colour ) vg_line( (v2f){p1[0],p0[1]}, p1, colour ); vg_line( p1, (v2f){p0[0],p1[1]}, colour ); vg_line( (v2f){p0[0],p1[1]}, p0, colour ); + #endif +} + +// Stack control +// =========================================================================================================== + +static struct ui_qnode *ui_current( ui_ctx *ctx ) +{ + return &ctx->stack[ ctx->stack_count-1 ]; } static void ui_new_node( ui_ctx *ctx ) @@ -105,7 +292,7 @@ static void ui_new_node( ui_ctx *ctx ) static int ui_hasmouse( ui_ctx *ctx ) { - struct ui_qnode *node = &ctx->stack[ ctx->stack_count-1 ]; + struct ui_qnode *node = ui_current( ctx ); return (node->mouse_over && (node->capture_id == ctx->capture_mouse_id)); } @@ -114,29 +301,59 @@ static void ui_end( ui_ctx *ctx ) struct ui_qnode *node = &ctx->stack[ --ctx->stack_count ]; ui_rect_copy( node->rect, ctx->cursor ); - ui_vis_rect( ctx->cursor, (node->mouse_over && (node->capture_id == ctx->capture_mouse_id))? 0xffff0000: 0xff0000ff ); + ui_vis_rect( ctx->cursor, + (node->mouse_over && (node->capture_id == ctx->capture_mouse_id))? 0xffff0000: 0xff0000ff ); } static void ui_end_down( ui_ctx *ctx ) { - ui_px height = ctx->stack[ ctx->stack_count ].rect[3]; + ui_px height = ui_current( ctx )->rect[3]; ui_end( ctx ); ctx->cursor[1] += height; } static void ui_end_right( ui_ctx *ctx ) { - ui_px width = ctx->stack[ ctx->stack_count ].rect[2]; + ui_px width = ui_current( ctx )->rect[2]; ui_end( ctx ); ctx->cursor[0] += width; } +static void ui_fill_y( ui_ctx *ctx ) +{ + struct ui_qnode *node = ui_current( ctx ); + ctx->cursor[3] = node->rect[3] - (ctx->cursor[1]-node->rect[1]); +} + +static void ui_fill_x( ui_ctx *ctx ) +{ + struct ui_qnode *node = ui_current( ctx ); + ctx->cursor[2] = node->rect[2] - (ctx->cursor[0]-node->rect[0]); +} + +// Alignment: | [] | -> | []| +static void ui_align_bottom( ui_ctx *ctx ) +{ + struct ui_qnode *node = ui_current( ctx ); + ctx->cursor[1] = node->rect[1] + node->rect[3] - ctx->cursor[3]; +} + static void ui_align_right( ui_ctx *ctx ) { - struct ui_qnode *node = &ctx->stack[ ctx->stack_count-1 ]; + struct ui_qnode *node = ui_current( ctx ); ctx->cursor[0] = node->rect[0] + node->rect[2] - ctx->cursor[2]; } +static void ui_align_top( ui_ctx *ctx ) +{ + ctx->cursor[1] = ui_current( ctx )->rect[1]; +} + +static void ui_align_left( ui_ctx *ctx ) +{ + ctx->cursor[0] = ui_current( ctx )->rect[0]; +} + static void ui_clamp_rect( ui_rect parent, ui_rect dest ) { dest[0] = vg_min( parent[0] + parent[2] - dest[2], dest[0] ); @@ -163,6 +380,128 @@ static void ui_capture_mouse( ui_ctx *ctx, u32 id ) } } +// Drawing +// =========================================================================================================== + +static struct ui_vert *ui_fill_rect_uv( ui_ctx *ctx, ui_rect rect, u32 colour, ui_px uv[4] ) +{ + struct ui_vert *vertices = &ctx->verts[ ctx->num_verts ]; + vertices[0].co[0] = rect[0]; + vertices[0].co[1] = rect[1]; + vertices[0].uv[0] = uv[0]; + vertices[0].uv[1] = uv[1]; + vertices[0].colour = colour; + vertices[1].co[0] = rect[0]+rect[2]; + vertices[1].co[1] = rect[1]; + vertices[1].uv[0] = uv[2]; + vertices[1].uv[1] = uv[1]; + vertices[1].colour = colour; + vertices[2].co[0] = rect[0]+rect[2]; + vertices[2].co[1] = rect[1]+rect[3]; + vertices[2].uv[0] = uv[2]; + vertices[2].uv[1] = uv[3]; + vertices[2].colour = colour; + vertices[3].co[0] = rect[0]; + vertices[3].co[1] = rect[1]+rect[3]; + vertices[3].uv[0] = uv[0]; + vertices[3].uv[1] = uv[3]; + vertices[3].colour = colour; + u16 ind_start = ctx->num_verts; + u16 *indices = &ctx->indices[ ctx->num_indices ]; + + indices[0] = ind_start+0; + indices[1] = ind_start+2; + indices[2] = ind_start+1; + + indices[3] = ind_start+0; + indices[4] = ind_start+3; + indices[5] = ind_start+2; + + ctx->num_indices += 6; + ctx->num_verts += 4; + + return vertices; +} + +static struct ui_vert *ui_fill_rect( ui_ctx *ctx, ui_rect rect, u32 colour ) +{ + return ui_fill_rect_uv( ctx, rect, colour, (ui_px[4]){ 66, 66, 66, 66 } ); +} + +static void ui_text( ui_ctx *ctx, const char *str, ui_px scale, int alignment ) +{ + ui_rect text_cursor; + + text_cursor[0] = ctx->cursor[0]; + text_cursor[1] = ctx->cursor[1]; + text_cursor[2] = 7*scale; + text_cursor[3] = 7*scale; + + u32 current_colour = 0xffffffff; + + const char *_c = str; + char c; + while( (c = *(_c ++)) ) + { + if( c == '\n' ) + { + text_cursor[1] += 10*scale; + text_cursor[0] = ctx->cursor[0]; + continue; + } + else if( c >= 33 && c <= 126 ) + { + u8 glyph_base[2]; + u8 glyph_index = c - 32; + glyph_base[0] = glyph_index%10; + glyph_base[1] = (glyph_index-glyph_base[0])/10; + + glyph_base[0] *= 7; + glyph_base[1] *= 7; + + ui_fill_rect_uv( ctx, text_cursor, current_colour, (ui_px[4]){glyph_base[0],glyph_base[1],glyph_base[0]+7,glyph_base[1]+7} ); + } + else if( c == '\x1B' ) + { + _c ++; + u16 colour_id = 0; + for( int i = 0; i < 3; i ++ ) + { + if( _c[i] ) + { + if( _c[i] == 'm' ) + { + _c = _c + i + 1; + + switch( colour_id ) + { + case '0': current_colour = 0xffffffff; break; + case '3'|'1'<<8: current_colour = 0xff201fee; break; + case '3'|'2'<<8: current_colour = 0xff37e420; break; + case '3'|'3'<<8: current_colour = 0xff0ed8e2; break; + case '3'|'4'<<8: current_colour = 0xfff15010; break; + case '3'|'5'<<8: current_colour = 0xffee20ee; break; + case '3'|'6'<<8: current_colour = 0xffeeee20; break; + case '3'|'7'<<8: current_colour = 0xffffffff; break; + } + + break; + } + + colour_id |= _c[i] << (i*8); + } + else + { + _c = _c +i; + break; + } + } + } + + text_cursor[0] += 6*scale; + } +} + // API control // ==================================================================== @@ -177,6 +516,9 @@ static void ui_begin( ui_ctx *ctx, ui_px res_x, ui_px res_y ) ctx->stack[0].mouse_over = 1; ctx->stack_count = 1; + + ctx->num_verts = 0; + ctx->num_indices = 0; } static void ui_resolve( ui_ctx *ctx ) @@ -221,6 +563,8 @@ static int ui_button( ui_ctx *ctx, u32 id ) if( ui_hasmouse(ctx) ) { + ui_fill_rect( ctx, ctx->cursor, 0xffcccccc ); + if( ctx->click_state == 1 ) ctx->capture_lock = 1; else if( ctx->capture_lock && ctx->click_state == 3 ) @@ -228,6 +572,8 @@ static int ui_button( ui_ctx *ctx, u32 id ) return 1; } } + else + ui_fill_rect( ctx, ctx->cursor, 0xff999999 ); } return 0; @@ -255,28 +601,44 @@ static int ui_window( ui_ctx *ctx, struct ui_window *window, u32 control_group ) ui_new_node( ctx ); { ui_capture_mouse( ctx, __COUNTER__ ); - + + //ui_fill_rect( ctx, ctx->cursor, 0xff333333 ); + // Drag bar ctx->cursor[3] = 25; ui_new_node( ctx ); { ui_capture_mouse( ctx, __COUNTER__ ); + struct ui_vert *drag_bar = ui_fill_rect( ctx, ctx->cursor, 0xff555555 ); + // title.. + ctx->cursor[0] += 2; + ctx->cursor[1] += 2; + ui_text( ctx, window->title, 2, 0 ); // Close button + ctx->cursor[3] = 25; ctx->cursor[2] = 25; ui_align_right( ctx ); - ui_rect_pad( ctx, ctx->cursor, 4 ); + ui_align_top( ctx ); + ui_rect_pad( ctx->cursor, 4 ); if( ui_button( ctx, __COUNTER__ ) ) { vg_info( "Click clacked\n" ); } + ctx->cursor[0] += 2; + ui_text( ctx, "x", 2, 0 ); ui_end( ctx ); if( ui_hasmouse( ctx ) ) { + drag_bar[0].colour = 0xff777777; + drag_bar[1].colour = 0xff777777; + drag_bar[2].colour = 0xff777777; + drag_bar[3].colour = 0xff777777; + // start drag if( ctx->click_state == 1 ) { @@ -286,7 +648,7 @@ static int ui_window( ui_ctx *ctx, struct ui_window *window, u32 control_group ) } } } - ui_end( ctx ); + ui_end_down( ctx ); } return 1; @@ -311,10 +673,8 @@ static void ui_test(void) | |--------------| | [] Eternal flames 6 | | +------+--------------+-+----------------------------+-+ */ - - static ui_ctx ctx = { .padding = 8 }; - - ui_begin( &ctx, vg_window_x, vg_window_y ); + + ui_begin( &ui_global_ctx, vg_window_x, vg_window_y ); // TODO: Find a more elegent form for this int mouse_state = 0; @@ -322,7 +682,7 @@ static void ui_test(void) if( vg_get_button_down( "primary" ) ) mouse_state = 1; if( vg_get_button_up( "primary" ) ) mouse_state = 3; - ui_set_mouse( &ctx, vg_mouse[0], vg_mouse[1], mouse_state ); + ui_set_mouse( &ui_global_ctx, vg_mouse[0], vg_mouse[1], mouse_state ); static struct ui_window window = { @@ -330,16 +690,50 @@ static void ui_test(void) .title = "Central Market" }; - if( ui_window( &ctx, &window, __COUNTER__ ) ) + if( ui_window( &ui_global_ctx, &window, __COUNTER__ ) ) { // Contents + //ui_text( &ui_global_ctx, "A slice of heaven. O for awesome, this chocka \nfull cuzzie is as rip-off as a cracker.\nMeanwhile, in behind the bicycle shed, Hercules Morse,\nas big as a horse and Mrs Falani were up to no \ngood with a bunch of crook pikelets. Meanwhile, \nat the black singlet woolshed party, not even au,\nsort your drinking out.", 1, 0 ); + ui_global_ctx.cursor[2] = 75; + ui_fill_y( &ui_global_ctx ); + + ui_new_node( &ui_global_ctx ); + { + ui_global_ctx.cursor[3] = 75; + + if( ui_button( &ui_global_ctx, __COUNTER__ ) ) + vg_info( "Buy\n" ); + { + ui_rect_pad( ui_global_ctx.cursor, 4 ); + ui_text( &ui_global_ctx, "Buy", 2, 0 ); + } + ui_end_down( &ui_global_ctx ); + + if( ui_button( &ui_global_ctx, __COUNTER__ ) ) + vg_info( "Sell\n" ); + { + ui_rect_pad( ui_global_ctx.cursor, 4 ); + ui_text( &ui_global_ctx, "Sell", 2, 0 ); + } + ui_end_down( &ui_global_ctx ); + } + ui_end_right( &ui_global_ctx ); + + ui_global_ctx.cursor[2] = 200; + ui_new_node( &ui_global_ctx ); + { + + } + ui_end_right( &ui_global_ctx ); } - ui_end( &ctx ); + ui_end( &ui_global_ctx ); - ui_resolve( &ctx ); + ui_resolve( &ui_global_ctx ); m3x3f view = M3X3_IDENTITY; m3x3_translate( view, (v3f){ -1.0f, 1.0f, 0.0f } ); m3x3_scale( view, (v3f){ 1.0f/((float)vg_window_x*0.5f), -1.0f/((float)vg_window_y*0.5f), 1.0f } ); vg_lines_drawall( (float*)view ); + + ui_draw( &ui_global_ctx ); }