wip
This commit is contained in:
Alexander Heldt
@@ -5,7 +5,9 @@ import gleam/list
|
||||
import gleam/string
|
||||
import gleeunit
|
||||
|
||||
import musicplayer/ui/layout.{type Layout, type Section, Layout, Node, Section}
|
||||
import musicplayer/ui/layout.{
|
||||
type Layout, type Section, Layout, Node, RenderOps, Section,
|
||||
}
|
||||
|
||||
pub fn main() -> Nil {
|
||||
gleeunit.main()
|
||||
@@ -76,11 +78,34 @@ pub fn foo_test() {
|
||||
]),
|
||||
)
|
||||
|
||||
let expected =
|
||||
"
|
||||
container──────────────────────────────────────────────────────────────────────┐
|
||||
│row 1────────────────────────────────────────────────────────────────────────┐│
|
||||
││cell 1───────────────────────────────┐cell 2───────────────────────────────┐││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
││└────────────────────────────────────┘└────────────────────────────────────┘││
|
||||
│└────────────────────────────────────────────────────────────────────────────┘│
|
||||
│row 1────────────────────────────────────────────────────────────────────────┐│
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
│└────────────────────────────────────────────────────────────────────────────┘│
|
||||
└──────────────────────────────────────────────────────────────────────────────┘
|
||||
"
|
||||
|
||||
let visual = render_to_visual(layout, Section("Root"), 80, 20)
|
||||
assert visual == ""
|
||||
assert visual == string.trim(expected)
|
||||
}
|
||||
|
||||
/// The visual grid: (x, y) -> Character
|
||||
pub type Screen =
|
||||
dict.Dict(#(Int, Int), String)
|
||||
|
||||
@@ -90,94 +115,42 @@ pub fn render_to_visual(
|
||||
width: Int,
|
||||
height: Int,
|
||||
) -> String {
|
||||
let screen = dict.new()
|
||||
|
||||
// Initial container settings (matching your render function)
|
||||
let container_width = int.to_float(width)
|
||||
let container_height = int.to_float(height)
|
||||
let container_top_left_x = 1
|
||||
let container_top_left_y = 1
|
||||
|
||||
let final_screen =
|
||||
render_visual_loop(
|
||||
layout,
|
||||
container_width,
|
||||
container_height,
|
||||
container_top_left_x,
|
||||
container_top_left_y,
|
||||
0,
|
||||
// root index
|
||||
root,
|
||||
screen,
|
||||
// 1. Define the Strategy: How to draw on a Dict
|
||||
let test_ops =
|
||||
RenderOps(
|
||||
draw_box: fn(screen, x, y, w, h) { plot_box(screen, x, y, w, h) },
|
||||
draw_text: fn(screen, text, x, y) { plot_text(screen, text, x, y) },
|
||||
)
|
||||
|
||||
// 2. Run the generic logic (reusing the exact math from your real app)
|
||||
let final_screen =
|
||||
layout.render_generic(
|
||||
layout,
|
||||
int.to_float(width),
|
||||
int.to_float(height),
|
||||
1,
|
||||
// Start X (1-based for ANSI compatibility)
|
||||
1,
|
||||
// Start Y
|
||||
0,
|
||||
// Root index
|
||||
root,
|
||||
dict.new(),
|
||||
// Initial Context
|
||||
test_ops,
|
||||
)
|
||||
|
||||
// 3. Convert the Grid to a Visual String
|
||||
screen_to_string(final_screen)
|
||||
}
|
||||
|
||||
fn render_visual_loop(
|
||||
layout: Layout,
|
||||
c_width: Float,
|
||||
c_height: Float,
|
||||
c_x: Int,
|
||||
c_y: Int,
|
||||
index: Int,
|
||||
from: Section,
|
||||
screen: Screen,
|
||||
) -> Screen {
|
||||
case dict.get(layout.nodes, from) {
|
||||
Error(_) -> screen
|
||||
Ok(node) -> {
|
||||
let margin = 2.0
|
||||
|
||||
// 1. RECURSE CHILDREN
|
||||
// We process children first so the parent draws ON TOP of them later
|
||||
// (This matches your string_tree.append logic order)
|
||||
let screen_after_children =
|
||||
list.index_map(node.children, fn(c, i) { #(i, c) })
|
||||
|> list.fold(screen, fn(acc_screen, ic) {
|
||||
let #(i, child) = ic
|
||||
|
||||
// Logic from your code:
|
||||
let cw =
|
||||
c_width *. { int.to_float(node.width_percent) /. 100.0 } -. margin
|
||||
|> float.floor
|
||||
let ch =
|
||||
c_height *. { int.to_float(node.height_percent) /. 100.0 } -. margin
|
||||
|> float.floor
|
||||
let cx = c_x + 1
|
||||
let cy = c_y + 1
|
||||
|
||||
render_visual_loop(layout, cw, ch, cx, cy, i, child, acc_screen)
|
||||
})
|
||||
|
||||
// 2. CALCULATE CURRENT NODE DIMENSIONS (Logic from your code)
|
||||
let width =
|
||||
c_width *. { int.to_float(node.width_percent) /. 100.0 }
|
||||
|> float.floor
|
||||
|> float.truncate
|
||||
let height =
|
||||
c_height *. { int.to_float(node.height_percent) /. 100.0 }
|
||||
|> float.floor
|
||||
|> float.truncate
|
||||
|
||||
// 3. CALCULATE COORDINATES (Logic from your code)
|
||||
let #(cx, cy) = case node.t {
|
||||
layout.Container -> #(c_x, c_y)
|
||||
layout.Row -> #(c_x, c_y + { index * height })
|
||||
layout.Cell -> #(c_x + { index * width }, c_y)
|
||||
}
|
||||
|
||||
// 4. DRAW BOX AND CONTENT
|
||||
screen_after_children
|
||||
|> plot_box(cx, cy, width, height)
|
||||
|> plot_text(node.content, cx, cy)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// --- Drawing Primitives ---
|
||||
// ----------------------------------------------------------------------------
|
||||
// Plotting Primitives (The "Graphics Engine" for Tests)
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
fn plot_text(screen: Screen, text: String, start_x: Int, y: Int) -> Screen {
|
||||
// We use to_graphemes to ensure Unicode characters (like emoji or box lines)
|
||||
// are treated as single visual units.
|
||||
text
|
||||
|> string.to_graphemes
|
||||
|> list.index_fold(screen, fn(acc, char, i) {
|
||||
@@ -189,20 +162,20 @@ fn plot_box(screen: Screen, x: Int, y: Int, w: Int, h: Int) -> Screen {
|
||||
let box_chars = #("┌", "┐", "└", "┘", "─", "│")
|
||||
let #(tl, tr, bl, br, hor, ver) = box_chars
|
||||
|
||||
// If box is too small to render, return screen as is
|
||||
// Don't draw impossible boxes
|
||||
case w < 2 || h < 2 {
|
||||
True -> screen
|
||||
False -> {
|
||||
screen
|
||||
// Corners
|
||||
// 1. Corners
|
||||
|> dict.insert(#(x, y), tl)
|
||||
|> dict.insert(#(x + w - 1, y), tr)
|
||||
|> dict.insert(#(x, y + h - 1), bl)
|
||||
|> dict.insert(#(x + w - 1, y + h - 1), br)
|
||||
// Top and Bottom edges
|
||||
// 2. Top and Bottom edges
|
||||
|> plot_line_hor(x + 1, y, w - 2, hor)
|
||||
|> plot_line_hor(x + 1, y + h - 1, w - 2, hor)
|
||||
// Side edges
|
||||
// 3. Side edges
|
||||
|> plot_line_ver(x, y + 1, h - 2, ver)
|
||||
|> plot_line_ver(x + w - 1, y + 1, h - 2, ver)
|
||||
}
|
||||
@@ -231,15 +204,20 @@ fn plot_line_ver(
|
||||
|> list.fold(screen, fn(acc, i) { dict.insert(acc, #(x, y + i), char) })
|
||||
}
|
||||
|
||||
// --- Output Formatting ---
|
||||
// ----------------------------------------------------------------------------
|
||||
// Output Formatting
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
fn screen_to_string(screen: Screen) -> String {
|
||||
let keys = dict.keys(screen)
|
||||
|
||||
// Find the bounding box of the drawing
|
||||
let max_x = list.fold(keys, 0, fn(m, k) { int.max(m, k.0) })
|
||||
let max_y = list.fold(keys, 0, fn(m, k) { int.max(m, k.1) })
|
||||
|
||||
// We start from 1 because ANSI is 1-based
|
||||
let min_y = list.fold(keys, 1000, fn(m, k) { int.min(m, k.1) })
|
||||
|
||||
// We add +1 to max_x to account for the last character width
|
||||
list.range(min_y, max_y)
|
||||
|> list.map(fn(y) {
|
||||
list.range(1, max_x)
|
||||
@@ -247,6 +225,7 @@ fn screen_to_string(screen: Screen) -> String {
|
||||
case dict.get(screen, #(x, y)) {
|
||||
Ok(char) -> char
|
||||
Error(_) -> " "
|
||||
// Fill gaps with space
|
||||
}
|
||||
})
|
||||
|> string.join("")
|
||||
|
||||
Reference in New Issue
Block a user