fix layout bugs

src/main.odin

@@ -327,22 +327,23 @@ draw :: proc(state_with_ui: ^StateWithUi) {
     new_ui := transmute(^ui.State)state.ui
 
     ui.open_element(new_ui, nil, {
-        kind = {ui.Fit{}, ui.Exact(400)},
+        kind = {ui.Exact(state.screen_width), ui.Exact(state.screen_height)},
     })
     {
-        ui.open_element(new_ui, "Hello, I am a text thingy", {})
+        ui.open_element(new_ui, "Hello, I am a text thingy", {
-        ui.close_element(new_ui)
+            kind = {ui.Grow{}, ui.Grow{}}
-
-        ui.open_element(new_ui, "Number 2", {})
-        ui.close_element(new_ui)
-
-        ui.open_element(new_ui, "I am on the right hopefully", {
-            kind = {ui.Exact(state.screen_width-128), ui.Grow{}}
         })
         ui.close_element(new_ui)
 
+        ui_file_buffer_2(new_ui, core.current_buffer(state_with_ui.state))
+
+        ui.open_element(new_ui, "I am on the right hopefully", {
+            kind = {nil, ui.Grow{}}
+        })
+        ui.close_element(new_ui)
+        
         ui.open_element(new_ui, "Number 4", {
-            kind = {ui.Exact(state.screen_width-128), ui.Grow{}}
+            kind = {nil, ui.Grow{}}
         })
         ui.close_element(new_ui)
     }
@@ -464,6 +465,65 @@ ui_file_buffer :: proc(ctx: ^ui.Context, buffer: ^FileBuffer) -> ui.Interaction
     return interaction;
 }
 
+ui_file_buffer_2 :: proc(s: ^ui.State, buffer: ^FileBuffer) {
+    draw_func := proc(state: ^State, e: ui.UI_Element, user_data: rawptr) {
+        buffer := transmute(^FileBuffer)user_data;
+        if buffer != nil {
+            buffer.glyph_buffer_width = e.layout.size.x / state.source_font_width;
+            buffer.glyph_buffer_height = e.layout.size.y / state.source_font_height + 1;
+
+            core.draw_file_buffer(state, buffer, e.layout.pos.x, e.layout.pos.y);
+        }
+    };
+
+    relative_file_path, _ := filepath.rel(state.directory, buffer.file_path, context.temp_allocator)
+
+    ui.open_element(s, nil, {
+        dir = .TopToBottom,
+        kind = {ui.Grow{}, ui.Grow{}},
+    })
+    {
+        ui.open_element(s, ui.UI_Element_Kind_Custom{fn = draw_func, user_data = transmute(rawptr)buffer}, {
+            kind = {ui.Grow{}, ui.Grow{}}
+        })
+        ui.close_element(s)
+
+        ui.open_element(s, nil, {
+            kind = {ui.Grow{}, ui.Exact(state.source_font_height)}
+        })
+        {
+            ui.open_element(s, fmt.tprintf("%s", state.mode), {})
+            ui.close_element(s)
+        }
+        ui.close_element(s)
+
+        /*
+        ui.open_element(s, nil, {
+            kind = {ui.Grow{}, ui.Exact(state.source_font_height)}
+        })
+        {
+            ui.open_element(s, fmt.tprintf("%s", state.mode), {})
+            ui.close_element(s)
+
+            if selection, exists := buffer.selection.?; exists {
+                ui.open_element(s, fmt.tprintf("sel: %d:%d", selection.end.line, selection.end.col), {});
+                ui.close_element(s)
+            }
+            ui.open_element(s, nil, {
+                kind = {ui.Grow{}, ui.Grow{}}
+            })
+            ui.close_element(s)
+
+            ui.open_element(s, relative_file_path, {});
+            ui.close_element(s)
+        }
+        ui.close_element(s)
+        */
+
+    }
+    ui.close_element(s)
+}
+
 init_plugin_vtable :: proc(ui_context: ^ui.Context) -> plugin.Plugin {
     return plugin.Plugin {
         state = cast(rawptr)&state,

src/ui/imm.odin

@@ -563,28 +563,28 @@ push_clip :: proc(ctx: ^Context, pos: [2]int, size: [2]int, inside_parent: bool
         }
     }
 
-    sdl2.RenderSetClipRect(ctx.renderer, &sdl2.Rect {
+    // sdl2.RenderSetClipRect(ctx.renderer, &sdl2.Rect {
-        i32(rect.pos.x),
+    //     i32(rect.pos.x),
-        i32(rect.pos.y),
+    //     i32(rect.pos.y),
-        i32(rect.size.x),
+    //     i32(rect.size.x),
-        i32(rect.size.y)
+    //     i32(rect.size.y)
-    });
+    // });
 
     append(&ctx.clips, rect);
 }
 
 pop_clip :: proc(ctx: ^Context) {
     if len(ctx.clips) > 0 {
-        rect := pop(&ctx.clips);
+        // rect := pop(&ctx.clips);
 
-        sdl2.RenderSetClipRect(ctx.renderer, &sdl2.Rect {
+        // sdl2.RenderSetClipRect(ctx.renderer, &sdl2.Rect {
-            i32(rect.pos.x),
+        //     i32(rect.pos.x),
-            i32(rect.pos.y),
+        //     i32(rect.pos.y),
-            i32(rect.size.x),
+        //     i32(rect.size.x),
-            i32(rect.size.y)
+        //     i32(rect.size.y)
-        });
+        // });
     } else {
-        sdl2.RenderSetClipRect(ctx.renderer, nil);
+        // sdl2.RenderSetClipRect(ctx.renderer, nil);
     }
 }
 

src/ui/ui.odin

@@ -29,10 +29,15 @@ UI_Element :: struct {
 UI_Element_Kind :: union {
     UI_Element_Kind_Text,
     UI_Element_Kind_Image,
+    UI_Element_Kind_Custom,
 }
 
-UI_Element_Kind_Text :: distinct string
+UI_Element_Kind_Text :: string
 UI_Element_Kind_Image :: distinct u64
+UI_Element_Kind_Custom :: struct {
+    user_data: rawptr,
+    fn: proc(state: ^core.State, element: UI_Element, user_data: rawptr),
+}
 
 UI_Layout :: struct {
     dir: UI_Direction,
@@ -64,6 +69,8 @@ open_element :: proc(state: ^State, kind: UI_Element_Kind, layout: UI_Layout) {
         kind = kind,
         layout = layout,
     }
+    e.layout.pos = state.curr_elements[state.num_curr].layout.pos
+    e.layout.size = state.curr_elements[state.num_curr].layout.size
 
     if parent, ok := state.current_open_element.?; ok {
         e.parent = parent
@@ -86,7 +93,7 @@ open_element :: proc(state: ^State, kind: UI_Element_Kind, layout: UI_Layout) {
     state.num_curr += 1
 }
 
-close_element :: proc(state: ^State, loc := #caller_location) {
+close_element :: proc(state: ^State, loc := #caller_location) -> UI_Layout {
     if curr, ok := state.current_open_element.?; ok {
         e := &state.curr_elements[curr]
 
@@ -97,15 +104,16 @@ close_element :: proc(state: ^State, loc := #caller_location) {
                 switch v in e.kind {
                     case UI_Element_Kind_Text: {
                         // FIXME: properly use font size
-                        e.layout.size[0] = len(v) * 9
+                        e.layout.size.x = len(v) * 9
                     }
                     case UI_Element_Kind_Image: {
                         // TODO
                     }
+                    case UI_Element_Kind_Custom: { }
                 }
             }
 
-            case Exact: { e.layout.size[0] = int(v) }
+            case Exact: { e.layout.size.x = int(v) }
             case Fit: {
                 child_index := e.first
                 for child_index != nil {
@@ -114,12 +122,12 @@ close_element :: proc(state: ^State, loc := #caller_location) {
                     switch e.layout.dir {
                         case .RightToLeft: fallthrough
                         case .LeftToRight: {
-                            e.layout.size[0] += child.layout.size[0]
+                            e.layout.size.x += child.layout.size.x
                         }
 
                         case .BottomToTop: fallthrough
                         case .TopToBottom: {
-                            e.layout.size[0] = math.max(e.layout.size[0], child.layout.size[0])
+                            e.layout.size.x = math.max(e.layout.size.x, child.layout.size.x)
                         }
                     }
 
@@ -129,21 +137,22 @@ close_element :: proc(state: ^State, loc := #caller_location) {
             case Grow: { /* Done in the Grow pass */ }
         }
 
-        switch v in e.layout.kind[1] {
+        switch v in e.layout.kind.y {
             case nil: {
                 switch v in e.kind {
                     case UI_Element_Kind_Text: {
                         // TODO: wrap text
                         // FIXME: properly use font size
-                        e.layout.size[1] = 16
+                        e.layout.size.y = 16
                     }
                     case UI_Element_Kind_Image: {
                         // TODO
                     }
+                    case UI_Element_Kind_Custom: { }
                 }
             }
 
-            case Exact: { e.layout.size[1] = int(v) }
+            case Exact: { e.layout.size.y = int(v) }
             case Fit: {
                 child_index := e.first
                 for child_index != nil {
@@ -152,12 +161,12 @@ close_element :: proc(state: ^State, loc := #caller_location) {
                     switch e.layout.dir {
                         case .RightToLeft: fallthrough
                         case .LeftToRight: {
-                            e.layout.size[1] = math.max(e.layout.size[1], child.layout.size[1])
+                            e.layout.size.y = math.max(e.layout.size.y, child.layout.size.y)
                         }
 
                         case .BottomToTop: fallthrough
                         case .TopToBottom: {
-                            e.layout.size[1] += child.layout.size[1]
+                            e.layout.size.y += child.layout.size.y
                         }
                     }
 
@@ -167,11 +176,13 @@ close_element :: proc(state: ^State, loc := #caller_location) {
             case Grow: { /* Done in the Grow pass */ }
         }
 
-        grow_children(state, curr)
-
         state.current_open_element = e.parent
+
+        return e.layout
     } else {
         log.error("'close_element' has unmatched 'open_element' at", loc)
+
+        return UI_Layout{}
     }
 }
 
@@ -210,7 +221,7 @@ grow_children :: proc(state: ^State, index: int) {
 
     if num_growing.x > 0 || num_growing.y > 0 {
         remaining_size := e.layout.size - children_size
-        to_grow: [2]int 
+        to_grow: [2]int
         to_grow.x = 0 if num_growing.x < 1 else remaining_size.x/num_growing.x
         to_grow.y = 0 if num_growing.y < 1 else remaining_size.y/num_growing.y
 
@@ -239,12 +250,21 @@ grow_children :: proc(state: ^State, index: int) {
                 }
             }
 
+            _, x_growing := child.layout.kind.x.(Grow)
+            _, y_growing := child.layout.kind.y.(Grow)
+
+            if x_growing || y_growing {
+                grow_children(state, child_index.?)
+            }
+
             child_index = child.next
         }
     }
 }
 
 compute_layout_2 :: proc(state: ^State) {
+    grow_children(state, 0)
+
     for i in 0..<state.num_curr {
         e := &state.curr_elements[i]
 
@@ -256,7 +276,8 @@ compute_layout_2 :: proc(state: ^State) {
 
                 switch parent.layout.dir {
                     case .LeftToRight: {
-                        e.layout.pos[0] = prev.layout.pos[0]+prev.layout.size[0] /* TODO: + child_gap */
+                        e.layout.pos.x = prev.layout.pos.x+prev.layout.size.x /* TODO: + child_gap */
+                        e.layout.pos.y = parent.layout.pos.y
                     }
                     case .RightToLeft: {
                         // TODO:
@@ -264,13 +285,34 @@ compute_layout_2 :: proc(state: ^State) {
                     }
 
                     case .TopToBottom: {
-                        e.layout.pos[1] = prev.layout.pos[1]+prev.layout.size[1] /* TODO: + child_gap */
+                        e.layout.pos.x = parent.layout.pos.x
+                        e.layout.pos.y = prev.layout.pos.y+prev.layout.size.y /* TODO: + child_gap */
                     }
                     case .BottomToTop: {
                         // TODO:
                         // e.layout.pos[1] = prev.layout.pos[1]-prev.layout.size[1] /* TODO: - child_gap */
                     }
                 }
+            } else {
+                switch parent.layout.dir {
+                    case .LeftToRight: {
+                        e.layout.pos.x = parent.layout.pos.x /* TODO: + padding */
+                        e.layout.pos.y = parent.layout.pos.y
+                    }
+                    case .RightToLeft: {
+                        // TODO:
+                        // e.layout.pos[0] = prev.layout.pos[0]-prev.layout.size[0] /* TODO: - padding */
+                    }
+
+                    case .TopToBottom: {
+                        e.layout.pos.x = parent.layout.pos.x
+                        e.layout.pos.y = parent.layout.pos.y /* TODO: + padding */
+                    }
+                    case .BottomToTop: {
+                        // TODO:
+                        // e.layout.pos[1] = prev.layout.pos[1]-prev.layout.size[1] /* TODO: - padding */
+                    }
+                }
             }
         }
     }
@@ -305,6 +347,9 @@ new_draw :: proc(state: ^State, core_state: ^core.State) {
             case UI_Element_Kind_Image: {
                 // TODO
             }
+            case UI_Element_Kind_Custom: {
+                v.fn(core_state, e^, v.user_data) 
+            }
         }
     }