Rework Layout
To be a based on a dictionary, where each node child is just a key in the dictionary and the value is the node itself
This commit is contained in:
Alexander Heldt
92
test/musicplayer/ui/layout_test.gleam
Normal file
92
test/musicplayer/ui/layout_test.gleam
Normal file
@@ -0,0 +1,92 @@
|
||||
import gleam/io
|
||||
import gleam/string
|
||||
import gleeunit
|
||||
import gleeunit/should
|
||||
import musicplayer/ui/virtual_ansi
|
||||
|
||||
import musicplayer/ui/layout.{Percent, Section, Style}
|
||||
|
||||
pub fn main() -> Nil {
|
||||
gleeunit.main()
|
||||
}
|
||||
|
||||
pub fn percent_layout_test() {
|
||||
let nodes = [
|
||||
#(
|
||||
Section("Row1"),
|
||||
layout.Row(
|
||||
content: "row 1",
|
||||
style: Style(dimensions: Percent(width: 100, height: 50)),
|
||||
children: [
|
||||
Section("A"),
|
||||
Section("B"),
|
||||
],
|
||||
),
|
||||
),
|
||||
#(
|
||||
Section("A"),
|
||||
layout.Cell(
|
||||
content: "cell 1",
|
||||
style: Style(dimensions: Percent(width: 50, height: 100)),
|
||||
),
|
||||
),
|
||||
#(
|
||||
Section("B"),
|
||||
layout.Cell(
|
||||
content: "cell 2",
|
||||
style: Style(dimensions: Percent(width: 50, height: 100)),
|
||||
),
|
||||
),
|
||||
#(
|
||||
Section("Row2"),
|
||||
layout.Row(
|
||||
content: "row 1",
|
||||
style: Style(dimensions: Percent(width: 100, height: 50)),
|
||||
children: [],
|
||||
),
|
||||
),
|
||||
]
|
||||
|
||||
let columns = 80
|
||||
let rows = 20
|
||||
let layout = layout.new(columns, rows, nodes)
|
||||
|
||||
let expected =
|
||||
"
|
||||
┌──────────────────────────────────────────────────────────────────────────────┐
|
||||
│row 1────────────────────────────────────────────────────────────────────────┐│
|
||||
││cell 1───────────────────────────────┐cell 2───────────────────────────────┐││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
│││ ││ │││
|
||||
││└────────────────────────────────────┘└────────────────────────────────────┘││
|
||||
│└────────────────────────────────────────────────────────────────────────────┘│
|
||||
│row 1────────────────────────────────────────────────────────────────────────┐│
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
││ ││
|
||||
│└────────────────────────────────────────────────────────────────────────────┘│
|
||||
└──────────────────────────────────────────────────────────────────────────────┘
|
||||
"
|
||||
|
||||
let visual = virtual_ansi.render(layout)
|
||||
case visual == string.trim(expected) {
|
||||
True -> Nil
|
||||
False -> {
|
||||
io.println("Test failed")
|
||||
io.println("Expected:")
|
||||
io.println(string.trim(expected))
|
||||
|
||||
io.println("Got:")
|
||||
io.println(visual)
|
||||
|
||||
should.equal(visual, expected)
|
||||
}
|
||||
}
|
||||
}
|
||||
113
test/musicplayer/ui/virtual_ansi.gleam
Normal file
113
test/musicplayer/ui/virtual_ansi.gleam
Normal file
@@ -0,0 +1,113 @@
|
||||
import gleam/dict
|
||||
import gleam/int
|
||||
import gleam/list
|
||||
import gleam/string
|
||||
|
||||
import musicplayer/ui/layout.{type Layout, Renders}
|
||||
|
||||
pub type Screen =
|
||||
dict.Dict(#(Int, Int), String)
|
||||
|
||||
pub fn render(layout: Layout) -> String {
|
||||
let test_renders =
|
||||
Renders(
|
||||
box: fn(screen, x, y, w, h) { box(screen, x, y, w, h) },
|
||||
text: fn(screen, chars, x, y) { text(screen, chars, x, y) },
|
||||
)
|
||||
|
||||
let screen =
|
||||
layout.render_generic(
|
||||
layout,
|
||||
int.to_float(layout.columns),
|
||||
int.to_float(layout.rows),
|
||||
1,
|
||||
1,
|
||||
0,
|
||||
layout.Section(layout.root_section),
|
||||
dict.new(),
|
||||
test_renders,
|
||||
)
|
||||
|
||||
screen_to_string(screen)
|
||||
}
|
||||
|
||||
pub 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) })
|
||||
|
||||
list.range(min_y, max_y)
|
||||
|> list.map(fn(y) {
|
||||
list.range(1, max_x)
|
||||
|> list.map(fn(x) {
|
||||
case dict.get(screen, #(x, y)) {
|
||||
Ok(char) -> char
|
||||
Error(_) -> " "
|
||||
// Fill gaps with space
|
||||
}
|
||||
})
|
||||
|> string.join("")
|
||||
})
|
||||
|> string.join("\n")
|
||||
}
|
||||
|
||||
pub fn 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) {
|
||||
dict.insert(acc, #(start_x + i, y), char)
|
||||
})
|
||||
}
|
||||
|
||||
pub fn box(screen: Screen, x: Int, y: Int, w: Int, h: Int) -> Screen {
|
||||
let box_chars = #("┌", "┐", "└", "┘", "─", "│")
|
||||
let #(tl, tr, bl, br, hor, ver) = box_chars
|
||||
|
||||
// Don't draw impossible boxes
|
||||
case w < 2 || h < 2 {
|
||||
True -> screen
|
||||
False -> {
|
||||
screen
|
||||
// 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)
|
||||
// 2. Top and Bottom edges
|
||||
|> horizontal_line(x + 1, y, w - 2, hor)
|
||||
|> horizontal_line(x + 1, y + h - 1, w - 2, hor)
|
||||
// 3. Side edges
|
||||
|> vertical_line(x, y + 1, h - 2, ver)
|
||||
|> vertical_line(x + w - 1, y + 1, h - 2, ver)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
fn horizontal_line(
|
||||
screen: Screen,
|
||||
x: Int,
|
||||
y: Int,
|
||||
len: Int,
|
||||
char: String,
|
||||
) -> Screen {
|
||||
list.range(0, len - 1)
|
||||
|> list.fold(screen, fn(acc, i) { dict.insert(acc, #(x + i, y), char) })
|
||||
}
|
||||
|
||||
fn vertical_line(
|
||||
screen: Screen,
|
||||
x: Int,
|
||||
y: Int,
|
||||
len: Int,
|
||||
char: String,
|
||||
) -> Screen {
|
||||
list.range(0, len - 1)
|
||||
|> list.fold(screen, fn(acc, i) { dict.insert(acc, #(x, y + i), char) })
|
||||
}
|
||||
Reference in New Issue
Block a user