Yves Biener
855594a8c8
Some checks failed
Zig Project Action / Lint, Spell-check and test zig project (push) Failing after 1m34s
1031 lines
41 KiB
Zig
1031 lines
41 KiB
Zig
// FIX known issues:
|
|
// - hold fewer instances of the `Allocator`
|
|
|
|
/// Border configuration struct
|
|
pub const Border = packed struct {
|
|
/// Color to use for the border
|
|
color: Color = .default,
|
|
/// Configure the corner type to be used for the border
|
|
corners: enum(u1) {
|
|
squared,
|
|
rounded,
|
|
} = .squared,
|
|
/// Configure the sides where the borders shall be rendered
|
|
sides: packed struct {
|
|
top: bool = false,
|
|
bottom: bool = false,
|
|
left: bool = false,
|
|
right: bool = false,
|
|
|
|
/// Enable border sides for all four sides
|
|
pub const all: @This() = .{ .top = true, .bottom = true, .left = true, .right = true };
|
|
/// Enable border sides for the left and right sides
|
|
pub const horizontal: @This() = .{ .left = true, .right = true };
|
|
/// Enable border sides for the top and bottom sides
|
|
pub const vertical: @This() = .{ .top = true, .bottom = true };
|
|
} = .{},
|
|
|
|
pub fn content(this: @This(), cells: []Cell, size: Point) void {
|
|
assert(cells.len == @as(usize, size.x) * @as(usize, size.y));
|
|
|
|
const frame: [6]u21 = switch (this.corners) {
|
|
.rounded => .{ '╭', '─', '╮', '│', '╰', '╯' },
|
|
.squared => .{ '┌', '─', '┐', '│', '└', '┘' },
|
|
};
|
|
|
|
// render top and bottom border
|
|
if (this.sides.top or this.sides.bottom) {
|
|
for (0..size.x) |col| {
|
|
const last_row = @as(usize, size.y - 1) * @as(usize, size.x);
|
|
if (this.sides.left and col == 0) {
|
|
// top left corner
|
|
if (this.sides.top) cells[col].cp = frame[0];
|
|
// bottom left corner
|
|
if (this.sides.bottom) cells[last_row + col].cp = frame[4];
|
|
} else if (this.sides.right and col == size.x - 1) {
|
|
// top right corner
|
|
if (this.sides.top) cells[col].cp = frame[2];
|
|
// bottom left corner
|
|
if (this.sides.bottom) cells[last_row + col].cp = frame[5];
|
|
} else {
|
|
// top side
|
|
if (this.sides.top) cells[col].cp = frame[1];
|
|
// bottom side
|
|
if (this.sides.bottom) cells[last_row + col].cp = frame[1];
|
|
}
|
|
if (this.sides.top) cells[col].style.fg = this.color;
|
|
if (this.sides.bottom) cells[last_row + col].style.fg = this.color;
|
|
}
|
|
}
|
|
// render left and right border
|
|
if (this.sides.left or this.sides.right) {
|
|
var start: usize = 0;
|
|
if (this.sides.top) start = 1;
|
|
var end = size.y;
|
|
if (this.sides.bottom) end -= 1;
|
|
for (start..end) |row| {
|
|
const idx = (row * size.x);
|
|
if (this.sides.left) {
|
|
cells[idx].cp = frame[3]; // left
|
|
cells[idx].style.fg = this.color;
|
|
}
|
|
if (this.sides.right) {
|
|
cells[idx + size.x - 1].cp = frame[3]; // right
|
|
cells[idx + size.x - 1].style.fg = this.color;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
test "all sides" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .green,
|
|
.sides = .all,
|
|
},
|
|
}, .{});
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/border.all.zon"));
|
|
}
|
|
|
|
test "vertical sides" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .green,
|
|
.sides = .vertical,
|
|
},
|
|
}, .{});
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/border.vertical.zon"));
|
|
}
|
|
|
|
test "horizontal sides" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .green,
|
|
.sides = .horizontal,
|
|
},
|
|
}, .{});
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/border.horizontal.zon"));
|
|
}
|
|
};
|
|
|
|
/// Rectangle configuration struct
|
|
pub const Rectangle = packed struct {
|
|
/// `Color` to use to fill the `Rectangle` with
|
|
/// NOTE used as background color when rendering! such that it renders the
|
|
/// children accordingly without removing the coloring of the `Rectangle`
|
|
fill: Color = .default,
|
|
|
|
// NOTE caller owns `Cells` slice and ensures that `cells.len == size.x * size.y`
|
|
pub fn content(this: @This(), cells: []Cell, size: Point) void {
|
|
assert(cells.len == @as(usize, size.x) * @as(usize, size.y));
|
|
|
|
for (0..size.y) |row| {
|
|
for (0..size.x) |col| {
|
|
cells[(row * size.x) + col].style.bg = this.fill;
|
|
}
|
|
}
|
|
|
|
// DEBUG render corresponding beginning of the rectangle for this `Container` *red*
|
|
if (comptime build_options.debug) {
|
|
cells[0].style.fg = .red;
|
|
cells[0].style.bg = .black;
|
|
cells[0].cp = 'r'; // 'r' for *rectangle*
|
|
}
|
|
}
|
|
|
|
test "fill color overwrite parent fill" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .green },
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/rectangle_with_parent_fill_without_padding.zon"));
|
|
}
|
|
|
|
test "fill color padding to show parent fill" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.layout = .{
|
|
.padding = .all(2),
|
|
},
|
|
.rectangle = .{ .fill = .green },
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/rectangle_with_parent_padding.zon"));
|
|
}
|
|
|
|
test "fill color padding to show parent fill (negative padding)" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.layout = .{
|
|
.padding = .{
|
|
.top = -18,
|
|
.bottom = -18,
|
|
.left = -28,
|
|
.right = -28,
|
|
},
|
|
},
|
|
.rectangle = .{ .fill = .green },
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/rectangle_with_parent_padding.zon"));
|
|
}
|
|
|
|
test "fill color spacer with padding" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.rectangle = .{
|
|
.fill = .black,
|
|
},
|
|
.layout = .{
|
|
.padding = .vertical(2),
|
|
.direction = .vertical,
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/rectangle_with_padding.zon"));
|
|
}
|
|
|
|
test "fill color with gap" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.rectangle = .{
|
|
.fill = .black,
|
|
},
|
|
.layout = .{
|
|
.padding = .vertical(1),
|
|
.gap = 1,
|
|
.direction = .vertical,
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .blue },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/rectangle_with_gap.zon"));
|
|
}
|
|
|
|
test "fill color with separator" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.rectangle = .{
|
|
.fill = .black,
|
|
},
|
|
.layout = .{
|
|
.padding = .vertical(1),
|
|
.separator = .{
|
|
.enabled = true,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .blue },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .white },
|
|
}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/rectangle_with_separator.zon"));
|
|
}
|
|
};
|
|
|
|
/// Layout configuration struct
|
|
pub const Layout = packed struct {
|
|
/// control the direction in which child elements are laid out
|
|
direction: enum(u1) { horizontal, vertical } = .horizontal,
|
|
/// Padding outside of the child elements
|
|
padding: packed struct {
|
|
top: i16 = 0,
|
|
bottom: i16 = 0,
|
|
left: i16 = 0,
|
|
right: i16 = 0,
|
|
|
|
/// Create a padding with equivalent padding in all four directions.
|
|
pub fn all(padding: i16) @This() {
|
|
return .{ .top = padding, .bottom = padding, .left = padding, .right = padding };
|
|
}
|
|
|
|
/// Create a padding with equivalent padding in the left and right directions; others directions remain the default value.
|
|
pub fn horizontal(padding: i16) @This() {
|
|
return .{ .left = padding, .right = padding };
|
|
}
|
|
|
|
/// Create a padding with equivalent padding in the top and bottom directions; others directions remain the default value.
|
|
pub fn vertical(padding: i16) @This() {
|
|
return .{ .top = padding, .bottom = padding };
|
|
}
|
|
} = .{},
|
|
/// Padding used in between child elements as gaps when laid out
|
|
gap: u16 = 0,
|
|
/// Configure separator borders between child element to added to the layout
|
|
separator: packed struct {
|
|
enabled: bool = false,
|
|
color: Color = .white,
|
|
line: enum(u2) {
|
|
line,
|
|
dotted,
|
|
double,
|
|
} = .line,
|
|
} = .{},
|
|
|
|
/// Calculate the absolute offset for the provided `padding` if it is negative to get the absolute padding for the given `size`.
|
|
pub fn getAbsolutePadding(padding: i16, size: u16) u16 {
|
|
return if (padding >= 0) @intCast(padding) else size -| @as(u16, @intCast(-padding));
|
|
}
|
|
|
|
pub fn content(this: @This(), comptime C: type, cells: []Cell, origin: Point, size: Point, children: []const C) void {
|
|
assert(cells.len == @as(usize, size.x) * @as(usize, size.y));
|
|
|
|
if (this.separator.enabled and children.len > 1) {
|
|
const line_cps: [2]u21 = switch (this.separator.line) {
|
|
.line => .{ '│', '─' },
|
|
.dotted => .{ '┆', '┄' },
|
|
.double => .{ '║', '═' },
|
|
};
|
|
const gap: u16 = (this.gap + 1) / 2;
|
|
|
|
for (0..children.len - 1) |idx| {
|
|
const child = children[idx];
|
|
const anchor = switch (this.direction) {
|
|
.horizontal => ((@as(usize, child.origin.y) - @as(usize, origin.y)) * @as(usize, size.x)) + @as(usize, child.origin.x) + @as(usize, child.size.x) + gap - @as(usize, origin.x),
|
|
.vertical => ((@as(usize, child.origin.y) + @as(usize, child.size.y) + gap - @as(usize, origin.y)) * @as(usize, size.x)) + @as(usize, child.origin.x) - @as(usize, origin.x),
|
|
};
|
|
|
|
switch (this.direction) {
|
|
.horizontal => for (0..child.size.y) |row| {
|
|
cells[anchor + row * size.x].cp = line_cps[0];
|
|
cells[anchor + row * size.x].style.fg = this.separator.color;
|
|
},
|
|
.vertical => for (0..child.size.x) |col| {
|
|
cells[anchor + col].cp = line_cps[1];
|
|
cells[anchor + col].style.fg = this.separator.color;
|
|
},
|
|
}
|
|
|
|
// DEBUG render corresponding beginning of the separator for this `Container` *red*
|
|
if (comptime build_options.debug) {
|
|
cells[anchor].style.fg = .red;
|
|
cells[anchor].style.bg = .black;
|
|
cells[anchor].cp = 's'; // 's' for *separator*
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
test "separator without gaps" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.layout = .{
|
|
.separator = .{
|
|
.enabled = true,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_no_gaps.zon"));
|
|
}
|
|
|
|
test "separator without gaps with padding" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.layout = .{
|
|
.padding = .all(1),
|
|
.separator = .{
|
|
.enabled = true,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_no_gaps_with_padding.zon"));
|
|
}
|
|
|
|
test "separator(2x) without gaps" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.layout = .{
|
|
.direction = .vertical,
|
|
.separator = .{
|
|
.enabled = true,
|
|
.color = .red,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_2x_no_gaps.zon"));
|
|
}
|
|
|
|
test "separator(2x) with border(all)" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .red,
|
|
.sides = .all,
|
|
},
|
|
.layout = .{
|
|
.separator = .{
|
|
.enabled = true,
|
|
.color = .red,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_2x_no_gaps_with_border.zon"));
|
|
}
|
|
|
|
test "separator(2x) with border(all) and padding(all(1))" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .red,
|
|
.sides = .all,
|
|
},
|
|
.layout = .{
|
|
.padding = .all(1),
|
|
.separator = .{
|
|
.enabled = true,
|
|
.color = .red,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_2x_no_gaps_with_padding.zon"));
|
|
}
|
|
|
|
test "separator(2x) with border(all) and gap" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .red,
|
|
.sides = .all,
|
|
},
|
|
.layout = .{
|
|
.gap = 2,
|
|
.separator = .{
|
|
.enabled = true,
|
|
.color = .red,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_2x_with_gaps_with_border.zon"));
|
|
}
|
|
|
|
test "separator(2x) with border(all) and gap and padding" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.border = .{
|
|
.color = .red,
|
|
.sides = .all,
|
|
},
|
|
.layout = .{
|
|
.gap = 2,
|
|
.padding = .all(1),
|
|
.separator = .{
|
|
.enabled = true,
|
|
.color = .red,
|
|
},
|
|
},
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{ .rectangle = .{ .fill = .white } }, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/separator_2x_with_gaps_with_border_with_padding.zon"));
|
|
}
|
|
};
|
|
|
|
/// Sizing options which should be used by the `Container`
|
|
pub const Size = packed struct {
|
|
dim: Point = .{},
|
|
grow: enum(u2) {
|
|
both,
|
|
fixed,
|
|
vertical,
|
|
horizontal,
|
|
} = .both,
|
|
};
|
|
|
|
pub fn Container(Model: type, Event: type) type {
|
|
if (!isTaggedUnion(Event)) @compileError("Provided user event `Event` for `Container(comptime Event: type)`");
|
|
|
|
const Element = @import("element.zig").Element(Model, Event);
|
|
return struct {
|
|
allocator: Allocator,
|
|
origin: Point,
|
|
size: Point,
|
|
properties: Properties,
|
|
element: Element,
|
|
// TODO this should be renamed to `children`
|
|
elements: std.ArrayList(@This()),
|
|
|
|
/// Properties for each `Container` to configure their layout,
|
|
/// border, styling, etc. For details see the corresponding individual
|
|
/// documentation of the members of this struct accordingly.
|
|
pub const Properties = packed struct {
|
|
border: Border = .{},
|
|
rectangle: Rectangle = .{},
|
|
layout: Layout = .{},
|
|
size: Size = .{},
|
|
};
|
|
|
|
pub fn init(
|
|
allocator: Allocator,
|
|
properties: Properties,
|
|
element: Element,
|
|
) !@This() {
|
|
return .{
|
|
.allocator = allocator,
|
|
.origin = .{},
|
|
.size = .{},
|
|
.properties = properties,
|
|
.element = element,
|
|
.elements = try std.ArrayList(@This()).initCapacity(allocator, 2),
|
|
};
|
|
}
|
|
|
|
pub fn deinit(this: *@This()) void {
|
|
for (this.elements.items) |*element| element.deinit();
|
|
this.elements.deinit(this.allocator);
|
|
this.element.deinit();
|
|
}
|
|
|
|
pub fn append(this: *@This(), element: @This()) !void {
|
|
try this.elements.append(this.allocator, element);
|
|
}
|
|
|
|
pub fn reposition(this: *@This(), model: *const Model, origin: Point) void {
|
|
const layout = this.properties.layout;
|
|
this.origin = origin;
|
|
this.element.reposition(model, origin);
|
|
|
|
var offset = origin.add(.{
|
|
.x = Layout.getAbsolutePadding(layout.padding.left, this.size.x),
|
|
.y = Layout.getAbsolutePadding(layout.padding.top, this.size.y),
|
|
});
|
|
|
|
const sides = this.properties.border.sides;
|
|
if (sides.left) offset.x += 1;
|
|
if (sides.top) offset.y += 1;
|
|
|
|
for (this.elements.items) |*child| {
|
|
child.reposition(model, offset);
|
|
|
|
switch (layout.direction) {
|
|
.horizontal => offset.x += child.size.x + layout.gap,
|
|
.vertical => offset.y += child.size.y + layout.gap,
|
|
}
|
|
|
|
if (layout.separator.enabled) switch (layout.direction) {
|
|
.horizontal => offset.x += 1,
|
|
.vertical => offset.y += 1,
|
|
};
|
|
}
|
|
}
|
|
|
|
/// Resize all fit sized `Containers` to the necessary size required by its child elements.
|
|
fn fit_resize(this: *@This()) Point {
|
|
// NOTE this is supposed to be a simple and easy to understand algorithm, there are currently no optimizations done
|
|
const layout = this.properties.layout;
|
|
var size: Point = switch (layout.direction) {
|
|
.horizontal => .{ .x = layout.gap * @as(u16, @truncate(this.elements.items.len -| 1)) },
|
|
.vertical => .{ .y = layout.gap * @as(u16, @truncate(this.elements.items.len -| 1)) },
|
|
};
|
|
|
|
if (this.elements.items.len > 0) switch (layout.direction) {
|
|
.horizontal => size.x += Layout.getAbsolutePadding(layout.padding.left, this.size.x) + Layout.getAbsolutePadding(layout.padding.right, this.size.x),
|
|
.vertical => size.y += Layout.getAbsolutePadding(layout.padding.top, this.size.y) + Layout.getAbsolutePadding(layout.padding.bottom, this.size.y),
|
|
};
|
|
|
|
const sides = this.properties.border.sides;
|
|
if (sides.left) size.x += 1;
|
|
if (sides.right) size.x += 1;
|
|
if (sides.top) size.y += 1;
|
|
if (sides.bottom) size.y += 1;
|
|
|
|
if (layout.separator.enabled) switch (layout.direction) {
|
|
.horizontal => size.x += @as(u16, @truncate(this.elements.items.len -| 1)),
|
|
.vertical => size.y += @as(u16, @truncate(this.elements.items.len -| 1)),
|
|
};
|
|
|
|
for (this.elements.items) |*child| {
|
|
const child_size = child.fit_resize();
|
|
switch (layout.direction) {
|
|
.horizontal => {
|
|
size.x += child_size.x;
|
|
size.y = @max(size.y, child_size.y);
|
|
},
|
|
.vertical => {
|
|
size.x = @max(size.x, child_size.x);
|
|
size.y += child_size.y;
|
|
},
|
|
}
|
|
}
|
|
|
|
// assign currently calculated size
|
|
this.size = switch (this.properties.size.grow) {
|
|
.both => Point.max(size, this.properties.size.dim),
|
|
.fixed => this.properties.size.dim,
|
|
.horizontal => .{
|
|
.x = @max(size.x, this.properties.size.dim.x),
|
|
.y = this.properties.size.dim.y,
|
|
},
|
|
.vertical => .{
|
|
.x = this.properties.size.dim.x,
|
|
.y = @max(size.y, this.properties.size.dim.y),
|
|
},
|
|
};
|
|
return this.size;
|
|
}
|
|
|
|
/// growable implicitly requires the root `Container` to have a set a size property to the size of the available terminal screen
|
|
fn grow_resize(this: *@This(), model: *const Model, max_size: Point) void {
|
|
const layout = this.properties.layout;
|
|
var remainder = switch (layout.direction) {
|
|
.horizontal => max_size.x -| (Layout.getAbsolutePadding(layout.padding.left, this.size.x) + Layout.getAbsolutePadding(layout.padding.right, this.size.x)),
|
|
.vertical => max_size.y -| (Layout.getAbsolutePadding(layout.padding.top, this.size.y) + Layout.getAbsolutePadding(layout.padding.bottom, this.size.y)),
|
|
};
|
|
remainder -|= layout.gap * @as(u16, @truncate(this.elements.items.len -| 1));
|
|
|
|
if (layout.separator.enabled) remainder -|= @as(u16, @truncate(this.elements.items.len -| 1));
|
|
|
|
var available = switch (layout.direction) {
|
|
.horizontal => max_size.y -| (Layout.getAbsolutePadding(layout.padding.top, this.size.y) + Layout.getAbsolutePadding(layout.padding.bottom, this.size.y)),
|
|
.vertical => max_size.x -| (Layout.getAbsolutePadding(layout.padding.left, this.size.x) + Layout.getAbsolutePadding(layout.padding.right, this.size.x)),
|
|
};
|
|
|
|
const sides = this.properties.border.sides;
|
|
switch (layout.direction) {
|
|
.horizontal => {
|
|
if (sides.top) {
|
|
available -|= 1;
|
|
remainder -|= 1;
|
|
}
|
|
if (sides.bottom) {
|
|
available -|= 1;
|
|
remainder -|= 1;
|
|
}
|
|
},
|
|
.vertical => {
|
|
if (sides.left) {
|
|
available -|= 1;
|
|
remainder -|= 1;
|
|
}
|
|
if (sides.right) {
|
|
available -|= 1;
|
|
remainder -|= 1;
|
|
}
|
|
},
|
|
}
|
|
|
|
for (this.elements.items) |child| remainder -|= switch (layout.direction) {
|
|
.horizontal => child.size.x,
|
|
.vertical => child.size.y,
|
|
};
|
|
|
|
var growable_children: usize = 0;
|
|
var first_growable_child: *@This() = undefined;
|
|
for (this.elements.items) |*child| {
|
|
// layout direction side growth
|
|
switch (child.properties.size.grow) {
|
|
.fixed => continue,
|
|
.both => {
|
|
if (growable_children == 0) first_growable_child = child;
|
|
growable_children += 1;
|
|
},
|
|
.horizontal => if (layout.direction == .horizontal) {
|
|
if (growable_children == 0) first_growable_child = child;
|
|
growable_children += 1;
|
|
},
|
|
.vertical => if (layout.direction == .vertical) {
|
|
if (growable_children == 0) first_growable_child = child;
|
|
growable_children += 1;
|
|
},
|
|
}
|
|
// non layout direction side growth
|
|
switch (layout.direction) {
|
|
.horizontal => if (child.properties.size.grow == .vertical or child.properties.size.grow == .both) {
|
|
child.size.y = available;
|
|
},
|
|
.vertical => if (child.properties.size.grow == .horizontal or child.properties.size.grow == .both) {
|
|
child.size.x = available;
|
|
},
|
|
}
|
|
}
|
|
|
|
while (growable_children > 0 and remainder > 0) {
|
|
var smallest_size = switch (layout.direction) {
|
|
.horizontal => first_growable_child.size.x,
|
|
.vertical => first_growable_child.size.y,
|
|
};
|
|
var second_smallest_size: u16 = std.math.maxInt(u16);
|
|
var size_to_correct = remainder;
|
|
|
|
for (this.elements.items) |child| {
|
|
if (child.properties.size.grow == .fixed) continue;
|
|
|
|
switch (layout.direction) {
|
|
.horizontal => if (child.properties.size.grow == .vertical) continue,
|
|
.vertical => if (child.properties.size.grow == .horizontal) continue,
|
|
}
|
|
|
|
const size = switch (layout.direction) {
|
|
.horizontal => child.size.x,
|
|
.vertical => child.size.y,
|
|
};
|
|
|
|
if (size < smallest_size) {
|
|
second_smallest_size = smallest_size;
|
|
smallest_size = size;
|
|
} else if (size > smallest_size) {
|
|
second_smallest_size = @min(size, second_smallest_size);
|
|
size_to_correct = second_smallest_size -| smallest_size;
|
|
}
|
|
}
|
|
|
|
size_to_correct = @min(size_to_correct, remainder / growable_children);
|
|
var overflow: u16 = 0;
|
|
if (size_to_correct == 0 and remainder > 0) overflow = remainder;
|
|
|
|
for (this.elements.items) |*child| {
|
|
const child_size = switch (layout.direction) {
|
|
.horizontal => child.size.x,
|
|
.vertical => child.size.y,
|
|
};
|
|
if (child.properties.size.grow != .fixed and child_size == smallest_size) {
|
|
switch (layout.direction) {
|
|
.horizontal => if (child.properties.size.grow != .vertical) {
|
|
child.size.x += size_to_correct;
|
|
remainder -|= size_to_correct;
|
|
},
|
|
.vertical => if (child.properties.size.grow != .horizontal) {
|
|
child.size.y += size_to_correct;
|
|
remainder -|= size_to_correct;
|
|
},
|
|
}
|
|
if (overflow > 0) {
|
|
switch (layout.direction) {
|
|
.horizontal => if (child.properties.size.grow != .vertical) {
|
|
child.size.x += 1;
|
|
overflow -|= 1;
|
|
remainder -|= 1;
|
|
},
|
|
.vertical => if (child.properties.size.grow != .horizontal) {
|
|
child.size.y += 1;
|
|
overflow -|= 1;
|
|
remainder -|= 1;
|
|
},
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
this.element.resize(model, this.size);
|
|
for (this.elements.items) |*child| child.grow_resize(model, child.size);
|
|
}
|
|
|
|
pub fn resize(this: *@This(), model: *const Model, size: Point) void {
|
|
// NOTE assume that this function is only called for the root `Container`
|
|
this.size = size;
|
|
const fit_size = this.fit_resize();
|
|
// if (fit_size.y > size.y or fit_size.x > size.x) @panic("error: cannot render in available space");
|
|
switch (this.properties.size.grow) {
|
|
.both => this.size = .max(size, fit_size),
|
|
.fixed => {},
|
|
.horizontal => this.size = .{
|
|
.x = @max(size.x, fit_size.x),
|
|
.y = size.y,
|
|
},
|
|
.vertical => this.size = .{
|
|
.x = size.x,
|
|
.y = @max(size.y, fit_size.y),
|
|
},
|
|
}
|
|
this.grow_resize(model, this.size);
|
|
}
|
|
|
|
pub fn handle(this: *const @This(), model: *Model, event: Event) !void {
|
|
switch (event) {
|
|
.mouse => |mouse| if (mouse.in(this.origin, this.size)) {
|
|
// the element receives the mouse event with relative position
|
|
assert(mouse.x >= this.origin.x and mouse.y >= this.origin.y);
|
|
var relative_mouse: input.Mouse = mouse;
|
|
relative_mouse.x -= this.origin.x;
|
|
relative_mouse.y -= this.origin.y;
|
|
try this.element.handle(model, .{ .mouse = relative_mouse });
|
|
},
|
|
.bell => {
|
|
// ring the terminal bell and do not propagate the event any further
|
|
_ = try terminal.ringBell();
|
|
return;
|
|
},
|
|
else => try this.element.handle(model, event),
|
|
}
|
|
for (this.elements.items) |*element| try element.handle(model, event);
|
|
}
|
|
|
|
pub fn content(this: *const @This(), model: *const Model) ![]Cell {
|
|
if (this.size.x == 0 or this.size.y == 0) return Error.TooSmall;
|
|
|
|
const cells = try this.allocator.alloc(Cell, @as(usize, this.size.x) * @as(usize, this.size.y));
|
|
errdefer this.allocator.free(cells);
|
|
@memset(cells, .{});
|
|
|
|
this.properties.layout.content(@This(), cells, this.origin, this.size, this.elements.items);
|
|
this.properties.border.content(cells, this.size);
|
|
this.properties.rectangle.content(cells, this.size);
|
|
|
|
try this.element.content(model, cells, this.size);
|
|
|
|
// DEBUG render corresponding corners (except top left) of this `Container` *red*
|
|
if (comptime build_options.debug) {
|
|
// top right
|
|
cells[this.size.x -| 1].style.fg = .red;
|
|
cells[this.size.x -| 1].style.bg = .black;
|
|
cells[this.size.x -| 1].cp = 'c'; // 'c' for *container*
|
|
// bottom left
|
|
cells[this.size.x * (this.size.y -| 1)].style.fg = .red;
|
|
cells[this.size.x * (this.size.y -| 1)].style.bg = .black;
|
|
cells[this.size.x * (this.size.y -| 1)].cp = 'c'; // 'c' for *container*
|
|
// bottom right
|
|
cells[this.size.x * this.size.y -| 1].style.fg = .red;
|
|
cells[this.size.x * this.size.y -| 1].style.bg = .black;
|
|
cells[this.size.x * this.size.y -| 1].cp = 'c'; // 'c' for *container*
|
|
}
|
|
|
|
return cells;
|
|
}
|
|
};
|
|
}
|
|
|
|
const log = std.log.scoped(.container);
|
|
|
|
const std = @import("std");
|
|
const assert = std.debug.assert;
|
|
const Allocator = std.mem.Allocator;
|
|
const build_options = @import("build_options");
|
|
const input = @import("input.zig");
|
|
const terminal = @import("terminal.zig");
|
|
const isTaggedUnion = @import("event.zig").isTaggedUnion;
|
|
const Cell = @import("cell.zig");
|
|
const Color = @import("color.zig").Color;
|
|
const Point = @import("point.zig").Point;
|
|
const Style = @import("style.zig");
|
|
const Error = @import("error.zig").Error;
|
|
|
|
test {
|
|
@import("std").testing.refAllDeclsRecursive(@This());
|
|
}
|
|
|
|
test "Container Fixed and Grow Size Vertical" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{
|
|
.layout = .{ .direction = .vertical },
|
|
}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.size = .{
|
|
.dim = .{ .y = 5 },
|
|
.grow = .horizontal,
|
|
},
|
|
.rectangle = .{ .fill = .grey },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .red },
|
|
}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/fixed_grow_vertical.zon"));
|
|
}
|
|
|
|
test "Container Fixed and Grow Size Horizontal" {
|
|
const event = @import("event.zig");
|
|
const testing = @import("testing.zig");
|
|
const Model = struct {};
|
|
|
|
var container: Container(Model, event.SystemEvent) = try .init(std.testing.allocator, .{}, .{});
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.size = .{
|
|
.dim = .{ .x = 5 },
|
|
.grow = .vertical,
|
|
},
|
|
.rectangle = .{ .fill = .grey },
|
|
}, .{}));
|
|
try container.append(try .init(std.testing.allocator, .{
|
|
.rectangle = .{ .fill = .red },
|
|
}, .{}));
|
|
defer container.deinit();
|
|
|
|
try testing.expectContainerScreen(.{
|
|
.y = 20,
|
|
.x = 30,
|
|
}, @TypeOf(container), &container, Model, @import("test/container/fixed_grow_horizontal.zon"));
|
|
}
|