X-Git-Url: https://harrygodden.com/git/?a=blobdiff_plain;f=vg_imgui.h;h=4433b2a2d9b650d7cdd576618297d7bd0baa37f5;hb=76d234b7dc5e6500e8a54009b367e7620f11ef97;hp=d1070394ee1353c63d27bffcf085ae1d17d9a7cf;hpb=ba09ee4b8ed1d994f0e97c8c34f221dc13555195;p=vg.git

diff --git a/vg_imgui.h b/vg_imgui.h
index d107039..4433b2a 100644
--- a/vg_imgui.h
+++ b/vg_imgui.h
@@ -52,7 +52,7 @@ enum ui_align
 struct ui_vert
 {
    ui_px co[2];
-   u8 uv[2];
+   u16 uv[2];
    u32 colour;
 };
 #pragma pack(pop)
@@ -72,8 +72,46 @@ enum ui_scheme_colour{
    k_ui_brighter = 8
 };
 
+static ui_px k_ui_widget_height = 28,
+             k_ui_scale = 1,
+             k_ui_padding = 8;
+
 typedef u32 ui_scheme[8*4];
 
+struct ui_font {
+   ui_px glyph_width,
+         glyph_height,
+         glyph_baseline,
+         line_height,
+         sheet_size,
+         spacing,
+         offset_y;
+
+   u8 ascii_start;
+};
+typedef struct ui_font ui_font;
+
+static const ui_font vg_ui_font_small = {
+   .glyph_width    = 8,
+   .glyph_height   = 14,
+   .glyph_baseline = 4,
+   .line_height    = 14,
+   .sheet_size     = 256,
+   .spacing        = 8,
+   .ascii_start    = ' ',
+   .offset_y = 0
+},
+vg_ui_font_big = {
+   .glyph_width  = 12,
+   .glyph_height = 21,
+   .glyph_baseline = 6,
+   .line_height = 21,
+   .sheet_size = 256,
+   .spacing = 10,
+   .ascii_start = ' ',
+   .offset_y = 84
+};
+
 #define UI_RGB( STDHEX )          0xff000000       |\
                          ((STDHEX&0x000000ff)<<16) |\
                          ((STDHEX&0x0000ff00)    ) |\
@@ -93,6 +131,11 @@ typedef u32 ui_scheme[8*4];
 #define UI_MOUSE_RIGHT  (SDL_BUTTON(SDL_BUTTON_RIGHT))
 #define UI_MOUSE_MIDDLE (SDL_BUTTON(SDL_BUTTON_MIDDLE))
 
+#define UI_TOP 0x1
+#define UI_LEFT 0x2
+#define UI_BOTTOM 0x4
+#define UI_RIGHT 0x8
+
 struct{
    struct ui_vert *vertex_buffer;
    u16            *indice_buffer;
@@ -166,6 +209,7 @@ struct{
    float click_fade_opacity;
 
    ui_scheme scheme;
+   const ui_font *font;
 
    enum ui_cursor{
       k_ui_cursor_default,
@@ -213,7 +257,8 @@ static vg_ui = {
       [ k_ui_blue   + k_ui_brighter ] = UI_RGB( 0x83a598 ),
       [ k_ui_purple + k_ui_brighter ] = UI_RGB( 0xd3869b ),
       [ k_ui_gray   + k_ui_brighter ] = UI_RGB( 0xa89984 ),
-   }
+   },
+   .font = &vg_ui_font_small
 };
 
 static struct vg_shader _shader_ui =
@@ -236,7 +281,7 @@ static struct vg_shader _shader_ui =
 	"void main()"
 	"{"
 		"gl_Position = vec4( uPv * vec3( a_co, 1.0 ), 1.0 );"
-		"aTexCoords = a_uv * 0.0078125;"
+		"aTexCoords = a_uv * 0.00390625;" /* TODO: Uniform */
 		"aColour = a_colour;"
 		
 		"aWsp = a_co;"
@@ -254,12 +299,6 @@ static struct vg_shader _shader_ui =
 	""
 	"in vec2 aWsp;"
 
-   "vec2 rand_hash22( vec2 p )"
-   "{"
-      "vec3 p3 = fract(vec3(p.xyx) * 213.8976123);"
-      "p3 += dot(p3, p3.yzx+19.19);"
-      "return fract(vec2((p3.x + p3.y)*p3.z, (p3.x+p3.z)*p3.y));"
-   "}"
 	""
 	"void main()"
 	"{"
@@ -275,8 +314,7 @@ static struct vg_shader _shader_ui =
    }
 };
 
-static struct vg_shader _shader_ui_image =
-{
+static struct vg_shader _shader_ui_image = {
    .name = "[vg] ui_image",
    .link = NULL,
    .vs = 
@@ -295,7 +333,7 @@ static struct vg_shader _shader_ui_image =
 	"void main()"
 	"{"
 		"gl_Position = vec4( uPv * vec3( a_co, 1.0 ), 1.0 );"
-		"aTexCoords = a_uv * 0.0078125;"
+		"aTexCoords = a_uv * 0.00390625;"
 		"aColour = a_colour;"
 		
 		"aWsp = a_co;"
@@ -319,10 +357,8 @@ static struct vg_shader _shader_ui_image =
 	"}"
    }
 };
-#define UI_GLYPH_SPACING_X 8
 
-VG_STATIC void _vg_ui_init(void)
-{
+static void _vg_ui_init(void){
    if( !vg_shader_compile( &_shader_ui ) ||
        !vg_shader_compile( &_shader_ui_image ) ) 
       vg_fatal_error( "Failed to compile ui shader" );
@@ -363,7 +399,7 @@ VG_STATIC void _vg_ui_init(void)
    glEnableVertexAttribArray( 0 );
    
    /* UV */
-   glVertexAttribPointer( 1, 2, GL_UNSIGNED_BYTE, GL_FALSE, stride, 
+   glVertexAttribPointer( 1, 2, GL_UNSIGNED_SHORT, GL_FALSE, stride, 
                           (void *)offsetof( struct ui_vert, uv ) );
    glEnableVertexAttribArray( 1 );
    
@@ -434,14 +470,12 @@ enum ui_shader {
    k_ui_shader_image
 };
 
-static void rect_copy( ui_rect a, ui_rect b )
-{
+static void rect_copy( ui_rect a, ui_rect b ){
    for( int i=0; i<4; i++ )
       b[i] = a[i];
 }
 
-VG_STATIC void ui_flush( enum ui_shader shader )
-{
+static void ui_flush( enum ui_shader shader ){
    u32 vertex_offset = vg_ui.vert_start*sizeof(ui_vert),
        vertex_count  = vg_ui.cur_vert-vg_ui.vert_start,
        vertex_size   = vertex_count*sizeof(ui_vert),
@@ -501,8 +535,7 @@ VG_STATIC void ui_flush( enum ui_shader shader )
    vg_ui.vert_start = vg_ui.cur_vert;
 }
 
-static void ui_fill_rect( ui_rect rect, u32 colour, ui_px uv[4] )
-{
+static void ui_fill_rect( ui_rect rect, u32 colour, ui_px uv[4] ){
    /* this if far from ideal but stops us from crashing */
    if( (vg_ui.cur_vert + 4 > vg_ui.max_verts) || 
        (vg_ui.cur_indice + 6 > vg_ui.max_indices))
@@ -544,13 +577,11 @@ static void ui_fill_rect( ui_rect rect, u32 colour, ui_px uv[4] )
 	vg_ui.cur_vert += 4;
 }
 
-static void ui_fill( ui_rect rect, u32 colour )
-{
+static void ui_fill( ui_rect rect, u32 colour ){
    ui_fill_rect( rect, colour, (ui_px[4]){ 4,4,4,4 } );
 }
 
-static void ui_outline( ui_rect rect, ui_px thickness, u32 colour )
-{
+static void ui_outline( ui_rect rect, ui_px thickness, u32 colour, u32 mask ){
    /* this if far from ideal but stops us from crashing */
    if( (vg_ui.cur_vert + 8 > vg_ui.max_verts) || 
        (vg_ui.cur_indice + 24 > vg_ui.max_indices))
@@ -585,18 +616,24 @@ static void ui_outline( ui_rect rect, ui_px thickness, u32 colour )
 	u16 start = vg_ui.cur_vert;
    u32 mesh[] = { 0,5,4, 0,1,5, 1,6,5, 1,2,6, 2,7,6, 2,3,7, 3,4,7, 3,0,4 };
 
-   for( u32 i=0; i<vg_list_size(mesh); i++ ){
-      indices[i] = start+mesh[i];
+   if( !mask ) 
+      mask = UI_TOP|UI_LEFT|UI_BOTTOM|UI_RIGHT;
+
+   u32 c = 0;
+   for( u32 i=0; i<vg_list_size(mesh)/6; i++ ){
+      if( (0x1<<i) & mask ){
+         for( u32 j=0; j<6; j++ )
+            indices[c ++] = start+mesh[i*6+j];
+      }
    }
 	
-	vg_ui.cur_indice += 24;
+	vg_ui.cur_indice += c;
 	vg_ui.cur_vert += 8;
 }
 
 static void ui_split( ui_rect rect, 
                        enum ui_axis other, ui_px width, ui_px gap,
-                       ui_rect l, ui_rect r )
-{
+                       ui_rect l, ui_rect r ){
    enum ui_axis dir = other ^ 0x1;
 
    if( width < 0 ) width = rect[ 2+dir ] + width;
@@ -616,14 +653,12 @@ static void ui_split( ui_rect rect,
 
 static ui_px ui_text_line_width( const char *str );
 
-static void ui_rect_center( ui_rect parent, ui_rect rect )
-{
+static void ui_rect_center( ui_rect parent, ui_rect rect ){
    rect[0] = parent[0] + (parent[2]-rect[2])/2;
    rect[1] = parent[1] + (parent[3]-rect[3])/2;
 }
 
-static void ui_fit_item( ui_rect rect, ui_px size[2], ui_rect d )
-{
+static void ui_fit_item( ui_rect rect, ui_px size[2], ui_rect d ){
    i32 rp = (i32)rect[2] * (i32)size[1],
        rc = (i32)size[0] * (i32)rect[3];
 
@@ -639,22 +674,19 @@ static void ui_fit_item( ui_rect rect, ui_px size[2], ui_rect d )
 }
 
 static void ui_split_ratio( ui_rect rect, enum ui_axis dir, float ratio, 
-                            ui_px gap, ui_rect l, ui_rect r )
-{
+                            ui_px gap, ui_rect l, ui_rect r ){
    ui_px width = (float)rect[ 2+(dir^0x1) ] * ratio;
    ui_split( rect, dir, width, gap, l, r );
 }
 
-static void ui_rect_pad( ui_rect rect, ui_px pad[2] )
-{
+static void ui_rect_pad( ui_rect rect, ui_px pad[2] ){
    rect[0] += pad[0];
    rect[1] += pad[1];
    rect[2] -= pad[0]*2;
    rect[3] -= pad[1]*2;
 }
 
-static ui_px ui_text_line_width( const char *str )
-{
+static ui_px ui_text_line_width( const char *str ){
    int length = 0;
    const char *_c = str;
    u8 c;
@@ -664,11 +696,10 @@ static ui_px ui_text_line_width( const char *str )
       else if( c == '\n' ) break;
    }
 
-   return length * 8;
+   return length * vg_ui.font->spacing;
 }
 
-static ui_px ui_text_string_height( const char *str )
-{
+static ui_px ui_text_string_height( const char *str ){
    int height = 1;
    const char *_c = str;
    u8 c;
@@ -681,8 +712,7 @@ static ui_px ui_text_string_height( const char *str )
 }
 
 static ui_px ui_text_aligned_x( const char *str, ui_rect rect, ui_px scale,
-                                enum ui_align align )
-{
+                                enum ui_align align ){
    enum ui_align lwr = k_ui_align_lwr & align;
    if( lwr == k_ui_align_left ){
       return rect[0];
@@ -699,13 +729,11 @@ static ui_px ui_text_aligned_x( const char *str, ui_rect rect, ui_px scale,
 
 static ui_px ui_min( ui_px a, ui_px b ){ return a<b?a:b; }
 static ui_px ui_max( ui_px a, ui_px b ){ return a>b?a:b; }
-static ui_px ui_clamp( ui_px a, ui_px min, ui_px max )
-{
+static ui_px ui_clamp( ui_px a, ui_px min, ui_px max ){
    return ui_min( max, ui_max( a, min ) );
 }
 
-static int ui_clip( ui_rect parent, ui_rect child, ui_rect clipped )
-{
+static int ui_clip( ui_rect parent, ui_rect child, ui_rect clipped ){
    ui_px parent_max[2], child_max[2];
    parent_max[0] = parent[0]+parent[2];
    parent_max[1] = parent[1]+parent[3];
@@ -727,21 +755,18 @@ static int ui_clip( ui_rect parent, ui_rect child, ui_rect clipped )
    return 1;
 }
 
-static int ui_inside_rect( ui_rect rect, ui_px co[2] )
-{
+static int ui_inside_rect( ui_rect rect, ui_px co[2] ){
    if( co[0] >= rect[0] &&
        co[1] >= rect[1] &&
        co[0] < rect[0]+rect[2] &&
-       co[1] < rect[1]+rect[3] )
-   {
+       co[1] < rect[1]+rect[3] ){
       return 1;
    }
    else 
       return 0;
 }
 
-static int ui_click_down( u32 mask )
-{
+static int ui_click_down( u32 mask ){
    if( vg_ui.ignore_input_frames ) return 0;
    if( (vg_ui.mouse_state[0] & mask) &&
       !(vg_ui.mouse_state[1] & mask) )
@@ -750,14 +775,12 @@ static int ui_click_down( u32 mask )
       return 0;
 }
 
-static int ui_clicking( u32 mask )
-{
+static int ui_clicking( u32 mask ){
    if( vg_ui.ignore_input_frames ) return 0;
    return vg_ui.mouse_state[0] & mask;
 }
 
-static int ui_click_up( u32 mask )
-{
+static int ui_click_up( u32 mask ){
    if( vg_ui.ignore_input_frames ) return 0;
    if( (vg_ui.mouse_state[1] & mask) &&
       !(vg_ui.mouse_state[0] & mask) )
@@ -766,8 +789,7 @@ static int ui_click_up( u32 mask )
       return 0;
 }
 
-static void ui_prerender(void)
-{
+static void ui_prerender(void){
    int x, y;
    vg_ui.mouse_state[1] = vg_ui.mouse_state[0];
    vg_ui.mouse_state[0] = SDL_GetMouseState( &x, &y );
@@ -793,14 +815,12 @@ static void ui_prerender(void)
    }
 }
 
-static u32 ui_colour( enum ui_scheme_colour id )
-{
+static u32 ui_colour( enum ui_scheme_colour id ){
    return vg_ui.scheme[ id ];
 }
 
 /* get an appropriately contrasting colour given the base */
-static u32 ui_colourcont( enum ui_scheme_colour id )
-{
+static u32 ui_colourcont( enum ui_scheme_colour id ){
    if     ( id < k_ui_bg+6 )              return ui_colour( k_ui_fg );
    else if( id < k_ui_fg   )              return ui_colour( k_ui_bg+1 );
    else if( id < k_ui_hue )               return ui_colour( k_ui_bg+3 );
@@ -808,8 +828,7 @@ static u32 ui_colourcont( enum ui_scheme_colour id )
    else                                   return ui_colour( k_ui_fg+1 );
 }
 
-static void ui_hex_to_norm( u32 hex, v4f norm )
-{
+static void ui_hex_to_norm( u32 hex, v4f norm ){
    norm[0] = ((hex    ) & 0xff);
    norm[1] = ((hex>>8 ) & 0xff);
    norm[2] = ((hex>>16) & 0xff);
@@ -817,9 +836,22 @@ static void ui_hex_to_norm( u32 hex, v4f norm )
    v4_muls( norm, 1.0f/255.0f, norm );
 }
 
+static void ui_text_glyph( const struct ui_font *font, ui_px scale,
+                           u8 glyph, ui_rect out_texcoords ){
+   glyph -= font->ascii_start;
+
+   ui_px per_row = font->sheet_size / font->glyph_width,
+         column  = (ui_px)glyph % per_row,
+         row     = (glyph - column) / per_row;
+   
+   out_texcoords[0] = column * font->glyph_width;
+   out_texcoords[1] = row * font->glyph_height + font->offset_y;
+   out_texcoords[2] = out_texcoords[0] + font->glyph_width;
+   out_texcoords[3] = out_texcoords[1] + font->glyph_height;
+}
+
 static u32 ui_ntext( ui_rect rect, const char *str, u32 len, ui_px scale, 
-                     enum ui_align align, u32 colour )
-{
+                     enum ui_align align, u32 colour ){
 	ui_rect text_cursor;
    if( colour == 0 ) colour = ui_colour( k_ui_fg );
 
@@ -830,8 +862,8 @@ static u32 ui_ntext( ui_rect rect, const char *str, u32 len, ui_px scale,
 
    text_cursor[0] = ui_text_aligned_x( str, rect, scale, align );
 	text_cursor[1] = rect[1];
-	text_cursor[2] = 8*scale;
-	text_cursor[3] = 14*scale;
+	text_cursor[2] = vg_ui.font->glyph_width*scale;
+	text_cursor[3] = vg_ui.font->glyph_height*scale;
 
    u32 printed_chars = 0;
 
@@ -847,52 +879,29 @@ static u32 ui_ntext( ui_rect rect, const char *str, u32 len, ui_px scale,
 	while( (c = *(_c ++)) ){
       if( printed_chars >= len ){
          printed_chars = 0;
-			text_cursor[1] += 14*scale;
+			text_cursor[1] += vg_ui.font->line_height*scale;
          text_cursor[0] = ui_text_aligned_x( _c, rect, scale, align );
-         text_cursor[0] -= UI_GLYPH_SPACING_X*scale;
-
-			u8 glyph_base[2];
-			u8 glyph_index = '\xb6';
-			glyph_base[0] = glyph_index & 0xf;
-			glyph_base[1] = (glyph_index-glyph_base[0])>>4;
-			glyph_base[0] *= 8;
-			glyph_base[1] *= 8;
-
-         ui_fill_rect( text_cursor, 0x00ffffff, (ui_px[4])
-         {
-            glyph_base[0]+2,
-            glyph_base[1]+1,
-            glyph_base[0]+6,
-            glyph_base[1]+8
-         });
-
-         text_cursor[0] += UI_GLYPH_SPACING_X*scale;
+         text_cursor[0] -= vg_ui.font->spacing*scale;
+
+         ui_rect glyph;
+         ui_text_glyph( vg_ui.font, scale, '\xb6' /*FIXME*/, glyph );
+         ui_fill_rect( text_cursor, 0x00ffffff, glyph );
+         text_cursor[0] += vg_ui.font->spacing*scale;
       }
 
 		if( c == '\n' ){
-			text_cursor[1] += 14*scale;
+			text_cursor[1] += vg_ui.font->line_height*scale;
          text_cursor[0] = ui_text_aligned_x( _c, rect, scale, align );
          printed_chars = 0;
 			continue;
 		}
 		else if( c >= 33 ){
-			u8 glyph_base[2];
-			u8 glyph_index = c;
-			glyph_base[0] = glyph_index & 0xf;
-			glyph_base[1] = (glyph_index-glyph_base[0])>>4;
-			glyph_base[0] *= 8;
-			glyph_base[1] *= 8;
-
-         ui_rect rect_char;
-
-         if( ui_clip( rect, text_cursor, rect_char ) ){
-            ui_fill_rect( rect_char, colour, (ui_px[4])
-            {
-               glyph_base[0]+2,
-               glyph_base[1]+1,
-               glyph_base[0]+6,
-               glyph_base[1]+8
-            });
+         ui_rect glyph;
+         ui_text_glyph( vg_ui.font, scale, c, glyph );
+
+         ui_rect cursor_clipped;
+         if( ui_clip( rect, text_cursor, cursor_clipped ) ){
+            ui_fill_rect( cursor_clipped, colour, glyph );
          }
 		}
 		else if( c == '\x1B' ){
@@ -931,12 +940,12 @@ static u32 ui_ntext( ui_rect rect, const char *str, u32 len, ui_px scale,
          continue;
 		}
       else if( c == '\t' ){
-         text_cursor[0] += UI_GLYPH_SPACING_X*scale*4;
+         text_cursor[0] += vg_ui.font->spacing*scale*4;
          printed_chars += 4;
          continue;
       }
 		
-   	text_cursor[0] += UI_GLYPH_SPACING_X*scale;
+   	text_cursor[0] += vg_ui.font->spacing*scale;
       printed_chars ++;
 	}
 
@@ -944,22 +953,52 @@ static u32 ui_ntext( ui_rect rect, const char *str, u32 len, ui_px scale,
 }
 
 static void ui_text( ui_rect rect, const char *str, ui_px scale, 
-                      enum ui_align align, u32 colour )
-{
+                     enum ui_align align, u32 colour ){
    ui_ntext( rect, str, 1024, scale, align, colour );
 }
 
-static void ui_image( ui_rect rect, GLuint image )
-{
+/*
+ * Standard layout stuff
+ * -----------------------------------------------------------------------------
+ */
+
+static void ui_panel( ui_rect in_rect, ui_rect out_panel ){
+   ui_fill( in_rect, ui_colour( k_ui_bg+1 ) );
+   ui_outline( in_rect, 1, ui_colour( k_ui_bg+7 ), 0 );
+   rect_copy( in_rect, out_panel );
+   ui_rect_pad( out_panel, (ui_px[2]){ k_ui_padding, k_ui_padding } );
+}
+
+static void ui_label( ui_rect rect, const char *text, ui_px size,
+                      ui_px gap, ui_rect r ){
+   ui_rect l;
+   ui_px width = (ui_text_line_width(text)+vg_ui.font->spacing) * size;
+   ui_split( rect, k_ui_axis_v, width, gap, l, r );
+   ui_text( l, text, 1, k_ui_align_middle_left, 0 );
+}
+
+static void ui_standard_widget( ui_rect inout_panel, ui_rect out_rect, 
+                                ui_px count ){
+   ui_px height = (count * vg_ui.font->glyph_height + 18) * k_ui_scale;
+   ui_split( inout_panel, k_ui_axis_h, height, k_ui_padding, 
+             out_rect, inout_panel );
+}
+
+static void ui_info( ui_rect inout_panel, const char *text ){
+   ui_rect box;
+   ui_standard_widget( inout_panel, box, 1 );
+   ui_text( box, text, 1, k_ui_align_middle_left, 0 );
+}
+
+static void ui_image( ui_rect rect, GLuint image ){
    ui_flush( k_ui_shader_colour );
    glActiveTexture( GL_TEXTURE0 );
    glBindTexture( GL_TEXTURE_2D, image );
-   ui_fill_rect( rect, 0xffffffff, (ui_px[4]){ 0,128, 128, 0 } );
+   ui_fill_rect( rect, 0xffffffff, (ui_px[4]){ 0,256,256,0 } );
    ui_flush( k_ui_shader_image );
 }
 
-static u32 v4f_u32_colour( v4f colour )
-{
+static u32 v4f_u32_colour( v4f colour ){
    u32 r = colour[0] * 255.0f,
        g = colour[1] * 255.0f,
        b = colour[2] * 255.0f,
@@ -968,8 +1007,7 @@ static u32 v4f_u32_colour( v4f colour )
    return r | (g<<8) | (b<<16) | (a<<24);
 }
 
-static void ui_defocus_all(void)
-{
+static void ui_defocus_all(void){
    if( vg_ui.focused_control_type == k_ui_control_textbox ){
       SDL_StopTextInput();
    }
@@ -1032,7 +1070,7 @@ static enum ui_button_state ui_colourbutton( ui_rect rect,
          }
          else{
             ui_fill( rect, col_base );
-            ui_outline( rect, 1, col_highlight );
+            ui_outline( rect, 1, col_highlight, 0 );
             return k_ui_button_holding_outside;
          }
       }
@@ -1073,9 +1111,15 @@ static enum ui_button_state ui_button_text( ui_rect rect,
    return ui_colourbutton_text( rect, string, scale, k_ui_bg+4 );
 }
 
+static enum ui_button_state ui_button( ui_rect inout_panel, 
+                                       const char *string ){
+   ui_rect rect;
+   ui_standard_widget( inout_panel, rect, 1 );
+   return ui_colourbutton_text( rect, string, 1, k_ui_bg+4 );
+}
+
 static void ui_enum_post(void);
-static void ui_postrender(void)
-{
+static void ui_postrender(void){
    if( vg_ui.click_fade_opacity > 0.0f ){
       float scale = vg_ui.click_fade_opacity;
             scale = vg_maxf( 1.0f/255.0f, scale*scale );
@@ -1115,7 +1159,7 @@ static void ui_postrender(void)
 
       ui_rect_center( screen, box );
       ui_fill( box, ui_colour(k_ui_bg) );
-      ui_outline( box, -1, colour );
+      ui_outline( box, -1, colour, 0 );
 
       ui_rect message;
       rect_copy( box, message );
@@ -1124,8 +1168,8 @@ static void ui_postrender(void)
       
       ui_rect row0, row1, btn;
       ui_split_ratio( message, k_ui_axis_h, 0.5f, 0, row0, row1 );
-      row0[0] += UI_GLYPH_SPACING_X;
-      ui_ntext( row0, vg_ui.modal.message, (box[2]/UI_GLYPH_SPACING_X)-2, 1, 
+      row0[0] += vg_ui.font->spacing;
+      ui_ntext( row0, vg_ui.modal.message, (box[2]/vg_ui.font->spacing)-2, 1, 
                 k_ui_align_left, colour );
 
       rect_copy( row1, btn );
@@ -1159,45 +1203,17 @@ static void ui_postrender(void)
    SDL_ShowCursor(1);
 }
 
-static void ui_dev_colourview(void)
-{
-   ui_rect window = {vg.window_x-256,0,256,vg.window_y}, swatch;
-
-   const char *names[vg_list_size(vg_ui.scheme)] = {
-      [k_ui_bg] = "k_ui_bg",   "k_ui_bg+1", "k_ui_bg+2", "k_ui_bg+3",
-                  "k_ui_bg+4", "k_ui_bg+5", "k_ui_bg+6", "k_ui_bg+7",
-
-      [k_ui_fg] = "k_ui_fg",   "k_ui_fg+1", "k_ui_fg+2", "k_ui_fg+3",
-                  "k_ui_fg+4", "k_ui_fg+5", "k_ui_fg+6", "k_ui_fg+7",
-
-      [k_ui_red] = "k_ui_red", "k_ui_orange", "k_ui_yellow", "k_ui_green",
-                   "k_ui_aqua", "k_ui_blue", "k_ui_purple", "k_ui_gray",
-                   "k_ui_red+8","k_ui_orange+8","k_ui_yellow+8","k_ui_green+8",
-                   "k_ui_aqua+8","k_ui_blue+8","k_ui_purple+8","k_ui_gray+8" };
-
-   ui_rect col[2];
-   ui_split_ratio( window, k_ui_axis_v, 0.5f, 0, col[0], col[1] );
-
-   for( int i=0; i<vg_list_size(vg_ui.scheme); i++ ){
-      int which = (i/8)%2;
-
-      ui_split( col[which], k_ui_axis_h, 24, 0, swatch, col[which] );
-      ui_fill( swatch, ui_colour(i) );
-
-      if( names[i] )
-         ui_text(swatch, names[i], 1, k_ui_align_middle_left, ui_colourcont(i));
-   }
-}
-
 /*
  * checkbox
  * -----------------------------------------------------------------------------
  */
 
-static int ui_checkbox( ui_rect rect, const char *str_label, int *data ){
-   ui_rect label, box;
+static int ui_checkbox( ui_rect inout_panel, const char *str_label, i32 *data ){
+   ui_rect rect, label, box;
+   ui_standard_widget( inout_panel, rect, 1 );
+
    ui_split( rect, k_ui_axis_v, -rect[3], 0, label, box );
-   ui_text( label, str_label, 1, k_ui_align_middle_left, 0 );
+   ui_text( label, str_label, k_ui_scale, k_ui_align_middle_left, 0 );
 
    int changed = ui_colourbutton( box, k_ui_bg )==1;
    if( changed )
@@ -1220,29 +1236,32 @@ static int ui_checkbox( ui_rect rect, const char *str_label, int *data ){
  * unfortunately no return value since we only find out that event in the 
  * postrender step.
  */
-static void ui_enum( ui_rect rect, const char *str_label, 
-                     struct ui_enum_opt *options, u32 len, i32 *value )
-{
-   ui_rect label, box;
-   ui_split( rect, k_ui_axis_v, ui_text_line_width( str_label ) + 8, 
-                0, label, box );
-   ui_text( label, str_label, 1, k_ui_align_middle_left, 0 );
+static void ui_enum( ui_rect inout_panel, const char *str_label, 
+                     struct ui_enum_opt *options, u32 len, i32 *value ){
+   ui_rect rect, label, box;
+   ui_standard_widget( inout_panel, rect, 1 );
+   ui_label( rect, str_label, k_ui_scale, 0, box );
 
    const char *display = "OUT OF RANGE";
+   int valid = 0;
    for( u32 i=0; i<len; i ++ ){
       if( *value == options[i].value ){
          display = options[i].alias;
+         valid = 1;
          break;
       }
    }
 
-   if( ui_button_text( box, display, 1 ) == 1 ){
+   if( ui_button_text( box, display, k_ui_scale ) == 1 ){
       vg_ui.focused_control_type = k_ui_control_enum;
       vg_ui.ptr_enum = value;
       vg_ui._enum.option_count = len;
       vg_ui._enum.options = options;
       rect_copy( box, vg_ui._enum.rect );
    }
+
+   if( !valid )
+      ui_outline( box, 1, ui_colour(k_ui_red), 0 );
 }
 
 static void ui_enum_post(void){
@@ -1270,8 +1289,8 @@ static void ui_enum_post(void){
       if( vg_ui._enum.options[i].value == *value ) 
          colour = k_ui_orange;
 
-      if( ui_colourbutton_text( button, vg_ui._enum.options[i].alias, 1,
-                                colour ) == 1 ){
+      if( ui_colourbutton_text( button, vg_ui._enum.options[i].alias, 
+                                k_ui_scale, colour ) == 1 ){
          *value = vg_ui._enum.options[i].value;
          close = 1;
       }
@@ -1289,15 +1308,13 @@ static void ui_enum_post(void){
  * -----------------------------------------------------------------------------
  */
 
-static void _ui_textbox_make_selection( int *start, int *end )
-{
+static void _ui_textbox_make_selection( int *start, int *end ){
 	*start = VG_MIN( vg_ui.textbox.cursor_pos, vg_ui.textbox.cursor_user );
 	*end   = VG_MAX( vg_ui.textbox.cursor_pos, vg_ui.textbox.cursor_user );
 }
 
 static void _ui_textbox_move_cursor( int *cursor0, int *cursor1, 
-                                     int dir, int snap_together )
-{
+                                     int dir, int snap_together ){
 	*cursor0 = VG_MAX( 0, vg_ui.textbox.cursor_user + dir );
 	*cursor0 = 
       VG_MIN( 
@@ -1308,8 +1325,7 @@ static void _ui_textbox_move_cursor( int *cursor0, int *cursor1,
 		*cursor1 = *cursor0;
 }
 
-static int _ui_textbox_makeroom( int datastart, int length )
-{
+static int _ui_textbox_makeroom( int datastart, int length ){
 	int move_to = VG_MIN( datastart+length, vg_ui.textbox.len-1 );
 	int move_amount = strlen( vg_ui.textbuf )-datastart;
 	int move_end = VG_MIN( move_to+move_amount, vg_ui.textbox.len-1 );
@@ -1325,8 +1341,7 @@ static int _ui_textbox_makeroom( int datastart, int length )
 	return VG_MIN( length, vg_ui.textbox.len-datastart-1 );
 }
 
-static int _ui_textbox_delete_char( int direction )
-{
+static int _ui_textbox_delete_char( int direction ){
 	int start, end;
 	_ui_textbox_make_selection( &start, &end );
 	
@@ -1348,8 +1363,7 @@ static int _ui_textbox_delete_char( int direction )
 	return start;
 }
 
-static void _ui_textbox_to_clipboard(void)
-{
+static void _ui_textbox_to_clipboard(void){
 	int start, end;
 	_ui_textbox_make_selection( &start, &end );
 	char buffer[512];
@@ -1361,8 +1375,8 @@ static void _ui_textbox_to_clipboard(void)
 	}
 }
 
-static void _ui_textbox_clipboard_paste(void)
-{
+static void ui_start_modal( const char *message, u32 options );
+static void _ui_textbox_clipboard_paste(void){
    if( !SDL_HasClipboardText() )
       return;
 
@@ -1373,6 +1387,12 @@ static void _ui_textbox_clipboard_paste(void)
 
    int datastart = _ui_textbox_delete_char( 0 );
 	int length = strlen( text );
+
+   if( (vg_ui.textbox.len - strlen(vg_ui.textbuf)) < length ){
+      ui_start_modal( "Clipboard content exceeds buffer size.", UI_MODAL_BAD );
+      return;
+   }
+
 	int cpylength = _ui_textbox_makeroom( datastart, length );
 
 	memcpy( vg_ui.textbuf + datastart, text, cpylength);
@@ -1381,10 +1401,10 @@ static void _ui_textbox_clipboard_paste(void)
    SDL_free( text );
 }
 
-static void _ui_textbox_put_char( char c )
-{
+static void _ui_textbox_put_char( char c ){
 	vg_ui.textbox.cursor_user = _ui_textbox_delete_char(0);
-	
+   if( (vg_ui.textbox.len - strlen(vg_ui.textbuf)) <= 1 ) return;
+
 	if( _ui_textbox_makeroom( vg_ui.textbox.cursor_user, 1 ) )
 		vg_ui.textbuf[ vg_ui.textbox.cursor_user ] = c;
 	
@@ -1393,22 +1413,19 @@ static void _ui_textbox_put_char( char c )
 }
 
 /* Receed secondary cursor */
-static void _ui_textbox_left_select(void)
-{
+static void _ui_textbox_left_select(void){
    _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, NULL, -1, 0 );
 }
 
 /* Match and receed both cursors */
-static void _ui_textbox_left(void)
-{
+static void _ui_textbox_left(void){
    int cursor_diff = vg_ui.textbox.cursor_pos - vg_ui.textbox.cursor_user? 0: 1;
 
    _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, 
                             &vg_ui.textbox.cursor_pos, -cursor_diff, 1 );
 }
 
-static void _ui_textbox_up(void)
-{
+static void _ui_textbox_up(void){
    if( vg_ui.textbox.flags & UI_TEXTBOX_MULTILINE ){
       int line_begin = vg_ui.textbox.cursor_user;
 
@@ -1451,8 +1468,7 @@ static void _ui_textbox_up(void)
    }
 }
 
-static void _ui_textbox_down(void)
-{
+static void _ui_textbox_down(void){
    if( vg_ui.textbox.flags & UI_TEXTBOX_MULTILINE ){
       int line_begin = vg_ui.textbox.cursor_user;
 
@@ -1506,21 +1522,18 @@ static void _ui_textbox_down(void)
    }
 }
 
-static void _ui_textbox_right_select(void)
-{
+static void _ui_textbox_right_select(void){
    _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, NULL, 1, 0 );
 }
 
-static void _ui_textbox_right(void)
-{
+static void _ui_textbox_right(void){
    int cursor_diff = vg_ui.textbox.cursor_pos - vg_ui.textbox.cursor_user? 0: 1;
 
    _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, 
                             &vg_ui.textbox.cursor_pos, +cursor_diff, 1 );
 }
 
-static void _ui_textbox_backspace(void)
-{
+static void _ui_textbox_backspace(void){
    if( vg_ui.focused_control_type == k_ui_control_textbox ){
       vg_ui.textbox.cursor_user = _ui_textbox_delete_char( -1 );
       vg_ui.textbox.cursor_pos = vg_ui.textbox.cursor_user;
@@ -1531,8 +1544,7 @@ static void _ui_textbox_backspace(void)
    }
 }
 
-static void _ui_textbox_delete(void)
-{
+static void _ui_textbox_delete(void){
    if( vg_ui.focused_control_type == k_ui_control_textbox ){
       vg_ui.textbox.cursor_user = _ui_textbox_delete_char( 1 );
       vg_ui.textbox.cursor_pos = vg_ui.textbox.cursor_user;
@@ -1543,44 +1555,62 @@ static void _ui_textbox_delete(void)
    }
 }
 
-static void _ui_textbox_home_select(void)
-{
-   _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, NULL, -10000, 0 );
+static void _ui_textbox_home_select(void){
+   i32 start = vg_ui.textbox.cursor_user;
+
+   if( vg_ui.textbox.flags & UI_TEXTBOX_MULTILINE ){
+      while( start ){
+         if( vg_ui.textbuf[start-1] == '\n' )
+            break;
+         else
+            start --;
+      }
+   }
+   else
+      start = 0;
+
+   vg_ui.textbox.cursor_user = start;
 }
 
-static void _ui_textbox_home(void)
-{
-   _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, 
-                            &vg_ui.textbox.cursor_pos, -10000, 1 );
+static void _ui_textbox_home(void){
+   _ui_textbox_home_select();
+   vg_ui.textbox.cursor_pos = vg_ui.textbox.cursor_user;
 }
 
-static void _ui_textbox_end_select(void)
-{
-   _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, NULL, 10000, 0 );
+static void _ui_textbox_end_select(void){
+   i32 end = vg_ui.textbox.cursor_user;
+
+   if( vg_ui.textbox.flags & UI_TEXTBOX_MULTILINE ){
+      while( vg_ui.textbuf[end] ){
+         if( vg_ui.textbuf[end] == '\n' )
+            break;
+         else
+            end ++;
+      }
+   }
+   else
+      end = VG_MIN( vg_ui.textbox.len-1, strlen(vg_ui.textbuf) );
+
+   vg_ui.textbox.cursor_user = end;
 }
 
-static void _ui_textbox_end(void)
-{
-   _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, 
-                            &vg_ui.textbox.cursor_pos, 
-                            vg_ui.textbox.len-1, 1 );
+static void _ui_textbox_end(void){
+   _ui_textbox_end_select();
+   vg_ui.textbox.cursor_pos = vg_ui.textbox.cursor_user;
 }
 
-static void _ui_textbox_select_all(void)
-{
+static void _ui_textbox_select_all(void){
    _ui_textbox_move_cursor( &vg_ui.textbox.cursor_user, NULL,  10000, 0);
    _ui_textbox_move_cursor( &vg_ui.textbox.cursor_pos,  NULL, -10000, 0);
 }
 
-static void _ui_textbox_cut(void)
-{
+static void _ui_textbox_cut(void){
    _ui_textbox_to_clipboard();
    vg_ui.textbox.cursor_user = _ui_textbox_delete_char(0);
    vg_ui.textbox.cursor_pos = vg_ui.textbox.cursor_user;
 }
 
-static void _ui_textbox_enter(void)
-{
+static void _ui_textbox_enter(void){
    if( vg_ui.focused_control_type == k_ui_control_textbox ){
       if( vg_ui.textbox.callbacks.enter )
          vg_ui.textbox.callbacks.enter( vg_ui.textbuf, vg_ui.textbox.len );
@@ -1602,8 +1632,7 @@ static void _ui_textbox_enter(void)
  *
  * input coordinates go in co[0], co[1], and the result index is in co[2]
  */
-static void _ui_textbox_calc_index_from_grid( int co[3], int wrap_length )
-{
+static void _ui_textbox_calc_index_from_grid( int co[3], int wrap_length ){
    int i[3] = {0,0,0};
 
    char c;
@@ -1639,8 +1668,7 @@ static void _ui_textbox_calc_index_from_grid( int co[3], int wrap_length )
  * based on the index specied in co[2], work out the visual character
  * coordinates and store them in co[0], co[1]
  */
-static void _ui_textbox_index_calc_coords( int co[3], int wrap_length )
-{
+static void _ui_textbox_index_calc_coords( int co[3], int wrap_length ){
    co[0] = 0;
    co[1] = 0;
 
@@ -1668,8 +1696,7 @@ static void _ui_textbox_index_calc_coords( int co[3], int wrap_length )
  *
  * index must be fully populated with visual X/Y, and linear index
  */
-static int _ui_textbox_run_remaining( int index[3], int wrap_length )
-{
+static int _ui_textbox_run_remaining( int index[3], int wrap_length ){
    int i=0, printed_chars=0;
    char c;
    while( (c = vg_ui.textbuf[index[2] + (i ++)]) ){
@@ -1681,9 +1708,20 @@ static int _ui_textbox_run_remaining( int index[3], int wrap_length )
    return printed_chars+1;
 }
 
-static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
-                       struct ui_textbox_callbacks *callbacks )
-{
+static int ui_textbox( ui_rect inout_panel, const char *label,
+                       char *buf, u32 len, u32 lines, u32 flags,
+                       struct ui_textbox_callbacks *callbacks ){
+   assert( lines > 0 );
+   assert( buf );
+
+   if( lines > 1 ) flags |= UI_TEXTBOX_MULTILINE;
+
+   ui_rect rect;
+   ui_standard_widget( inout_panel, rect, lines );
+
+   if( label )
+      ui_label( rect, label, 1, 0, rect );
+
    int clickup= ui_click_up(UI_MOUSE_LEFT),
        clickdown = ui_click_down(UI_MOUSE_LEFT),
        click  = ui_clicking(UI_MOUSE_LEFT) | clickup,
@@ -1711,7 +1749,7 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
    rect_copy( rect, text_rect );
 
    if( flags & UI_TEXTBOX_MULTILINE ) text_rect[3] = rect[3]-16;
-   else text_rect[3] = 14;
+   else text_rect[3] = vg_ui.font->line_height;
 
    text_rect[2] -= 16;
    ui_rect_center( rect, text_rect );
@@ -1719,7 +1757,7 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
    ui_px wrap_length = 1024;
 
    if( flags & UI_TEXTBOX_WRAP ) 
-      wrap_length = text_rect[2] / UI_GLYPH_SPACING_X;
+      wrap_length = text_rect[2] / vg_ui.font->spacing;
 
    if( hover ){
       vg_ui.cursor = k_ui_cursor_ibeam;
@@ -1736,13 +1774,13 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
          vg_ui.focused_control_hit = 1;
          if( click && target ){
             int p0[3] ={
-               (vg_ui.mouse_click[0] - text_rect[0]) / UI_GLYPH_SPACING_X,
-               (vg_ui.mouse_click[1] - text_rect[1]) / 14,
+               (vg_ui.mouse_click[0] - text_rect[0]) / vg_ui.font->spacing,
+               (vg_ui.mouse_click[1] - text_rect[1]) / vg_ui.font->line_height,
                -1
             }, 
             p1[3] = {
-               (vg_ui.mouse[0] - text_rect[0]) / UI_GLYPH_SPACING_X,
-               (vg_ui.mouse[1] - text_rect[1]) / 14,
+               (vg_ui.mouse[0] - text_rect[0]) / vg_ui.font->spacing,
+               (vg_ui.mouse[1] - text_rect[1]) / vg_ui.font->line_height,
                -1
             };
 
@@ -1760,7 +1798,7 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
             }
          }
 
-         ui_outline( rect, -2, vg_ui.scheme[ k_ui_orange ] );
+         ui_outline( rect, -2, vg_ui.scheme[ k_ui_orange ], 0 );
 
          ui_rect cursor;
 
@@ -1770,15 +1808,14 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
              end   = VG_MAX( c0, c1 ),
              chars = end-start;
 
-         if( flags & (UI_TEXTBOX_MULTILINE|UI_TEXTBOX_WRAP) ){
-
+         if( flags & (UI_TEXTBOX_WRAP|UI_TEXTBOX_MULTILINE) ){
             int pos[3], remaining = chars;
 
             pos[2] = start;
             _ui_textbox_index_calc_coords( pos, wrap_length );
 
             if( start==end ){
-               cursor[0] = text_rect[0] + pos[0]*UI_GLYPH_SPACING_X-1;
+               cursor[0] = text_rect[0] + pos[0]*vg_ui.font->spacing-1;
                cursor[1] = text_rect[1] + pos[1]*14;
                cursor[2] = 2;
                cursor[3] = 13;
@@ -1790,9 +1827,9 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
                   int run = _ui_textbox_run_remaining( pos, wrap_length );
                       run = VG_MIN( run, remaining );
 
-                  cursor[0] = text_rect[0] + pos[0]*UI_GLYPH_SPACING_X-1;
+                  cursor[0] = text_rect[0] + pos[0]*vg_ui.font->spacing-1;
                   cursor[1] = text_rect[1] + pos[1]*14;
-                  cursor[2] = (float)(run)*(float)UI_GLYPH_SPACING_X;
+                  cursor[2] = (float)(run)*(float)vg_ui.font->spacing;
                   cursor[3] = 13;
 
                   ui_fill( cursor, col_cursor );
@@ -1806,7 +1843,7 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
             }
          }
          else{
-            cursor[0] = text_rect[0] + start*UI_GLYPH_SPACING_X-1;
+            cursor[0] = text_rect[0] + start*vg_ui.font->spacing-1;
             cursor[1] = text_rect[1];
             cursor[3] = 13;
 
@@ -1814,7 +1851,7 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
                cursor[2] = 2;
             }
             else{
-               cursor[2] = (float)(chars)*(float)UI_GLYPH_SPACING_X;
+               cursor[2] = (float)(chars)*(float)vg_ui.font->spacing;
             }
 
             if( (vg_ui.click_fade_opacity<=0.0f) && 
@@ -1864,13 +1901,59 @@ static int ui_textbox( ui_rect rect, char *buf, u32 len, u32 flags,
    ui_fill( rect, col_base );
 
    if( hover ){
-      ui_outline( rect, -1, col_highlight );
+      ui_outline( rect, -1, col_highlight, 0 );
    }
 
    ui_ntext( text_rect, buf, wrap_length, 1, k_ui_align_left, 0 );
    return 0;
 }
 
+/*
+ * Tabs
+ * -----------------------------------------------------------------------------
+ */
+
+static void ui_tabs( ui_rect inout_panel, ui_rect out_content_panel,
+                     const char **titles, u32 count, i32 *page ){
+   ui_rect bar;
+   ui_standard_widget( inout_panel, bar, 1 );
+
+   i32 cur_page = *page;
+
+   f32 width = (f32)inout_panel[2] / (f32)count;
+
+   ui_px h = (inout_panel[1] + inout_panel[3]) - (bar[1]+bar[3]);
+   inout_panel[1] = bar[1]+bar[3];
+   inout_panel[3] = h;
+
+   ui_fill( inout_panel, ui_colour( k_ui_bg+2 ) );
+   ui_outline( inout_panel, 1, ui_colour( k_ui_bg+5 ), 0 );
+
+   rect_copy( inout_panel, out_content_panel );
+   ui_rect_pad( out_content_panel, (ui_px[2]){ k_ui_padding, k_ui_padding } );
+
+   /* place buttons */
+   for( i32 i=0; i<count; i++ ){
+      ui_rect button = {
+         bar[0] + ((f32)i*width),
+         bar[1],
+         width,
+         bar[3]-1
+      };
+
+      enum ui_scheme_colour colour = k_ui_bg+4;
+      if( i == cur_page ){
+         colour = k_ui_bg+2;
+         ui_outline( button, 1, ui_colour( k_ui_bg+5 ), 
+                     UI_TOP|UI_LEFT|UI_RIGHT );
+         button[3] ++;
+      }
+
+      if( ui_colourbutton_text( button, titles[i], 1, colour ) == 1 )
+         *page = i;
+   }
+}
+
 /* 
  * Modal UI
  * -----------------------------------------------------------------------------
@@ -1896,14 +1979,12 @@ static void ui_start_modal( const char *message, u32 options ){
 /*
  * Handles binds
  */
-static void _ui_proc_key( SDL_Keysym ev )
-{
+static void _ui_proc_key( SDL_Keysym ev ){
    if( vg_ui.focused_control_type != k_ui_control_textbox ){
       return;
    }
 
-   struct textbox_mapping
-   {
+   struct textbox_mapping{
       u16 mod;
       SDL_Keycode key;
       
@@ -1965,8 +2046,7 @@ static void _ui_proc_key( SDL_Keysym ev )
 /*
  * Callback for text entry mode
  */
-VG_STATIC void ui_proc_utf8( const char *text )
-{
+static void ui_proc_utf8( const char *text ){
    if( vg_ui.focused_control_type == k_ui_control_textbox ){
       const char *ptr = text;
 
@@ -1981,59 +2061,38 @@ VG_STATIC void ui_proc_utf8( const char *text )
    }
 }
 
-static void ui_label( ui_rect rect, const char *text, ui_px size,
-                      ui_px gap, ui_rect r )
-{
-   ui_rect l;
-   ui_px width = (ui_text_line_width(text)+UI_GLYPH_SPACING_X) * size;
-   ui_split( rect, k_ui_axis_v, width, gap, l, r );
-   ui_text( l, text, 1, k_ui_align_middle_left, 0 );
-}
-
-
-
-static ui_px k_vgi_widget_height = 24,
-             k_vgi_scale = 1;
-
-enum vgi_window_flag{
-   k_vgi_window_resizeable = 0x1,
-   k_vgi_window_moveable   = 0x2,
-   k_vgi_window_closeable  = 0x4,
-   k_vgi_window_standard   =
-      k_vgi_window_moveable|
-      k_vgi_window_closeable
-};
-
-static int vgi_window( ui_rect in_window, const char *title, u32 flags, 
-                       ui_rect out_panel ){
-   ui_fill( in_window, ui_colour( k_ui_bg+1 ) );
-   ui_outline( in_window, 1, ui_colour( k_ui_bg+7 ) );
-
-   ui_rect bar;
-   ui_split( in_window, k_ui_axis_h, k_vgi_widget_height*k_vgi_scale, 0, 
-             bar, out_panel );
-   ui_fill( bar, ui_colour( k_ui_bg+7 ) );
-   ui_text( bar, title, k_vgi_scale, k_ui_align_middle_center, 
-            ui_colourcont(k_ui_bg+7) );
-
-   if( flags & k_vgi_window_closeable ){
-      ui_rect quit_button;
-      ui_split( bar, k_ui_axis_v, bar[2]-bar[3], 2, bar, quit_button );
-      if( ui_button_text( quit_button, "X", 1 ) == 1 ){
-         return 0;
-      }
-   }
-
-   return 1;
-}
-
+/*
+ * Development utils
+ * -----------------------------------------------------------------------------
+ */
 
+static void ui_dev_colourview(void){
+   ui_rect window = {vg.window_x-256,0,256,vg.window_y}, swatch;
 
+   const char *names[vg_list_size(vg_ui.scheme)] = {
+      [k_ui_bg] = "k_ui_bg",   "k_ui_bg+1", "k_ui_bg+2", "k_ui_bg+3",
+                  "k_ui_bg+4", "k_ui_bg+5", "k_ui_bg+6", "k_ui_bg+7",
 
+      [k_ui_fg] = "k_ui_fg",   "k_ui_fg+1", "k_ui_fg+2", "k_ui_fg+3",
+                  "k_ui_fg+4", "k_ui_fg+5", "k_ui_fg+6", "k_ui_fg+7",
 
+      [k_ui_red] = "k_ui_red", "k_ui_orange", "k_ui_yellow", "k_ui_green",
+                   "k_ui_aqua", "k_ui_blue", "k_ui_purple", "k_ui_gray",
+                   "k_ui_red+8","k_ui_orange+8","k_ui_yellow+8","k_ui_green+8",
+                   "k_ui_aqua+8","k_ui_blue+8","k_ui_purple+8","k_ui_gray+8" };
 
+   ui_rect col[2];
+   ui_split_ratio( window, k_ui_axis_v, 0.5f, 0, col[0], col[1] );
 
+   for( int i=0; i<vg_list_size(vg_ui.scheme); i++ ){
+      int which = (i/8)%2;
 
+      ui_split( col[which], k_ui_axis_h, 24, 0, swatch, col[which] );
+      ui_fill( swatch, ui_colour(i) );
 
+      if( names[i] )
+         ui_text(swatch, names[i], 1, k_ui_align_middle_left, ui_colourcont(i));
+   }
+}
 
 #endif /* VG_IMGUI_H */