From fff9e328958ede998c820378e2bf5b73c2adb52a Mon Sep 17 00:00:00 2001 From: Alexander Heldt Date: Fri, 5 Dec 2025 20:00:36 +0100 Subject: [PATCH] wip --- src/musicplayer/ui/layout.gleam | 104 +++++++++--------- .../ui/layout_examples/layout_examples.gleam | 19 +--- test/musicplayer/ui/layout_test.gleam | 19 +--- 3 files changed, 61 insertions(+), 81 deletions(-) diff --git a/src/musicplayer/ui/layout.gleam b/src/musicplayer/ui/layout.gleam index 90de3f8..0b83862 100644 --- a/src/musicplayer/ui/layout.gleam +++ b/src/musicplayer/ui/layout.gleam @@ -18,19 +18,14 @@ pub type Section { PlaybackTime } -pub type NodeType { - Container - Row - Cell -} - pub type Style { Style(width_percent: Int, height_percent: Int) } /// A Nodes width and height is in percentage (of the available width/height of its parent Node) pub type Node { - Node(t: NodeType, content: String, style: Style, children: List(Section)) + Row(content: String, style: Style, children: List(Section)) + Cell(content: String, style: Style) } pub type Layout { @@ -42,8 +37,7 @@ pub fn new() -> Layout { dict.from_list([ #( Root, - Node( - t: Container, + Row( content: "Music Player", style: Style(width_percent: 100, height_percent: 100), children: [Header, Search, PlaybackTime], @@ -51,8 +45,7 @@ pub fn new() -> Layout { ), #( Header, - Node( - t: Row, + Row( content: "Foo (1) | Bar (2) | Baz (3)", style: Style(width_percent: 100, height_percent: 33), children: [], @@ -60,8 +53,7 @@ pub fn new() -> Layout { ), #( Search, - Node( - t: Row, + Row( content: "", style: Style(width_percent: 100, height_percent: 33), children: [], @@ -69,8 +61,7 @@ pub fn new() -> Layout { ), #( PlaybackTime, - Node( - t: Row, + Row( content: "00:00", style: Style(width_percent: 100, height_percent: 33), children: [], @@ -87,15 +78,14 @@ pub fn update_section( ) -> Layout { case dict.get(layout.nodes, section) { Error(_) -> layout - Ok(node) -> - Layout( - ..layout, - nodes: dict.insert( - layout.nodes, - section, - Node(..node, content: content), - ), - ) + Ok(node) -> { + let updated = case node { + Cell(..) -> Cell(..node, content: content) + Row(..) -> Row(..node, content: content) + } + + Layout(..layout, nodes: dict.insert(layout.nodes, section, updated)) + } } } @@ -177,10 +167,9 @@ pub fn render_generic( |> float.floor |> float.truncate - let #(cx, cy) = case node.t { - Container -> #(container_tl_x, container_tl_y) - Row -> #(container_tl_x, container_tl_y + { index * height }) - Cell -> #(container_tl_x + { index * width }, container_tl_y) + let #(cx, cy) = case node { + Row(..) -> #(container_tl_x, container_tl_y + { index * height }) + Cell(..) -> #(container_tl_x + { index * width }, container_tl_y) } let parent = @@ -189,37 +178,42 @@ pub fn render_generic( // + 2 for header margin |> renders.text(node.content, cx, cy) - list.index_map(node.children, fn(child, i) { #(i, child) }) - |> list.fold(parent, fn(acc_into, ic) { - let #(i, child) = ic + case node { + Cell(..) -> parent + Row(children:, ..) -> { + list.index_map(children, fn(child, i) { #(i, child) }) + |> list.fold(parent, fn(acc_into, ic) { + let #(i, child) = ic - let cw = - container_width - *. { int.to_float(node.style.width_percent) /. 100.0 } - -. margin - |> float.floor + let cw = + container_width + *. { int.to_float(node.style.width_percent) /. 100.0 } + -. margin + |> float.floor - let ch = - container_height - *. { int.to_float(node.style.height_percent) /. 100.0 } - -. margin - |> float.floor + let ch = + container_height + *. { int.to_float(node.style.height_percent) /. 100.0 } + -. margin + |> float.floor - let child_origin_x = container_tl_x + 1 - let child_origin_y = container_tl_y + 1 + let child_origin_x = container_tl_x + 1 + let child_origin_y = container_tl_y + 1 - render_generic( - layout, - cw, - ch, - child_origin_x, - child_origin_y, - i, - child, - acc_into, - renders, - ) - }) + render_generic( + layout, + cw, + ch, + child_origin_x, + child_origin_y, + i, + child, + acc_into, + renders, + ) + }) + } + } } } } diff --git a/src/musicplayer/ui/layout_examples/layout_examples.gleam b/src/musicplayer/ui/layout_examples/layout_examples.gleam index 29b1bcc..6c93217 100644 --- a/src/musicplayer/ui/layout_examples/layout_examples.gleam +++ b/src/musicplayer/ui/layout_examples/layout_examples.gleam @@ -1,7 +1,7 @@ import gleam/dict import musicplayer/ui/internal -import musicplayer/ui/layout.{Container, Layout, Node, Section, Style} +import musicplayer/ui/layout.{Layout, Section, Style} import musicplayer/ui/layout_examples/wait_for_input.{wait_for_input} pub fn main() { @@ -22,8 +22,7 @@ fn two_rows_with_cells(width: Int, height: Int) -> layout.Layout { dict.from_list([ #( Section("Root"), - Node( - t: Container, + layout.Row( content: "container", style: Style(width_percent: 100, height_percent: 100), children: [ @@ -34,8 +33,7 @@ fn two_rows_with_cells(width: Int, height: Int) -> layout.Layout { ), #( Section("Row1"), - Node( - t: layout.Row, + layout.Row( content: "row 1", style: Style(width_percent: 100, height_percent: 50), children: [ @@ -46,26 +44,21 @@ fn two_rows_with_cells(width: Int, height: Int) -> layout.Layout { ), #( Section("A"), - Node( - t: layout.Cell, + layout.Cell( content: "cell 1", style: Style(width_percent: 50, height_percent: 100), - children: [], ), ), #( Section("B"), - Node( - t: layout.Cell, + layout.Cell( content: "cell 2", style: Style(width_percent: 50, height_percent: 100), - children: [], ), ), #( Section("Row2"), - Node( - t: layout.Row, + layout.Row( content: "row 2", style: Style(width_percent: 100, height_percent: 50), children: [], diff --git a/test/musicplayer/ui/layout_test.gleam b/test/musicplayer/ui/layout_test.gleam index 8a7ee35..433c751 100644 --- a/test/musicplayer/ui/layout_test.gleam +++ b/test/musicplayer/ui/layout_test.gleam @@ -5,7 +5,7 @@ import gleeunit import gleeunit/should import musicplayer/ui/virtual_ansi -import musicplayer/ui/layout.{Layout, Node, Section, Style} +import musicplayer/ui/layout.{Layout, Section, Style} pub fn main() -> Nil { gleeunit.main() @@ -19,8 +19,7 @@ pub fn foo_test() { nodes: dict.from_list([ #( Section("Root"), - Node( - t: layout.Container, + layout.Row( content: "container", style: Style(width_percent: 100, height_percent: 100), children: [ @@ -31,8 +30,7 @@ pub fn foo_test() { ), #( Section("Row1"), - Node( - t: layout.Row, + layout.Row( content: "row 1", style: Style(width_percent: 100, height_percent: 50), children: [ @@ -43,26 +41,21 @@ pub fn foo_test() { ), #( Section("A"), - Node( - t: layout.Cell, + layout.Cell( content: "cell 1", style: Style(width_percent: 50, height_percent: 100), - children: [], ), ), #( Section("B"), - Node( - t: layout.Cell, + layout.Cell( content: "cell 2", style: Style(width_percent: 50, height_percent: 100), - children: [], ), ), #( Section("Row2"), - Node( - t: layout.Row, + layout.Row( content: "row 1", style: Style(width_percent: 100, height_percent: 50), children: [],