const QuitText = struct { const text = "Press ctrl+c to quit."; pub fn element(this: *@This()) App.Element { return .{ .ptr = this, .vtable = &.{ .content = content } }; } fn content(ctx: *anyopaque, cells: []zterm.Cell, size: zterm.Point) !void { _ = ctx; assert(cells.len == @as(usize, size.x) * @as(usize, size.y)); const row = 2; const col = size.x / 2 -| (text.len / 2); const anchor = (row * size.x) + col; for (text, 0..) |cp, idx| { cells[anchor + idx].style.fg = .white; cells[anchor + idx].style.bg = .black; cells[anchor + idx].cp = cp; // NOTE do not write over the contents of this `Container`'s `Size` if (anchor + idx == cells.len - 1) break; } } }; // TODO create an own `Element` implementation from this const InputField = struct { /// Offset from the end describing the current position of the cursor. cursor_offset: usize = 0, /// Array holding the value of the input. input: std.ArrayList(u21), /// Reference to the app's queue to issue the associated event to trigger when completing the input. queue: *App.Queue, // TODO make the event to trigger user defined (needs to be `comptime`) // - can this even be agnostic to `u8` / `u21`? pub fn init(allocator: std.mem.Allocator, queue: *App.Queue) @This() { return .{ .input = .init(allocator), .queue = queue, }; } pub fn deinit(this: @This()) void { this.input.deinit(); } pub fn element(this: *@This()) App.Element { return .{ .ptr = this, .vtable = &.{ .handle = handle, .content = content, }, }; } fn handle(ctx: *anyopaque, event: App.Event) !void { const this: *@This() = @ptrCast(@alignCast(ctx)); switch (event) { .key => |key| { assert(this.cursor_offset >= 0 and this.cursor_offset <= this.input.items.len); // see *form* implementation in `zk`, which might become part of the library if (key.eql(.{ .cp = zterm.input.Left }) or key.eql(.{ .cp = zterm.input.KpLeft }) or key.eql(.{ .cp = 'b', .mod = .{ .ctrl = true } })) { if (this.cursor_offset < this.input.items.len) this.cursor_offset += 1; } if (key.eql(.{ .cp = zterm.input.Right }) or key.eql(.{ .cp = zterm.input.KpRight }) or key.eql(.{ .cp = 'f', .mod = .{ .ctrl = true } })) this.cursor_offset -|= 1; if (key.eql(.{ .cp = 'e', .mod = .{ .ctrl = true } })) this.cursor_offset = 0; if (key.eql(.{ .cp = 'a', .mod = .{ .ctrl = true } })) this.cursor_offset = this.input.items.len; if (key.eql(.{ .cp = zterm.input.Backspace })) { if (this.cursor_offset < this.input.items.len) { _ = if (this.cursor_offset == 0) this.input.pop() else this.input.orderedRemove(this.input.items.len - this.cursor_offset - 1); } } if (key.eql(.{ .cp = zterm.input.Delete }) or key.eql(.{ .cp = zterm.input.KpDelete })) { if (this.cursor_offset > 0) { _ = this.input.orderedRemove(this.input.items.len - this.cursor_offset); this.cursor_offset -= 1; } } // TODO support readline keybindings (i.e. alt bindings alt-b, alt-f // TODO maybe even ctrl-left, ctrl-right?) // readline commands if (key.eql(.{ .cp = 'k', .mod = .{ .ctrl = true } })) { while (this.cursor_offset > 0) { _ = this.input.pop(); this.cursor_offset -= 1; } } if (key.eql(.{ .cp = 'u', .mod = .{ .ctrl = true } })) { const len = this.input.items.len - this.cursor_offset; for (0..len) |_| _ = this.input.orderedRemove(0); this.cursor_offset = this.input.items.len; } if (key.eql(.{ .cp = 'w', .mod = .{ .ctrl = true } })) { var non_whitespace = false; while (this.cursor_offset < this.input.items.len) { if (non_whitespace and this.input.items[this.input.items.len - this.cursor_offset - 1] == ' ') break; // see backspace const removed = if (this.cursor_offset == 0) this.input.pop() else this.input.orderedRemove(this.input.items.len - this.cursor_offset - 1); if (removed != ' ') non_whitespace = true; } } // usual input keys if (key.isAscii()) try this.input.insert(this.input.items.len - this.cursor_offset, key.cp); // TODO enter to accept? if (key.eql(.{ .cp = zterm.input.Enter }) or key.eql(.{ .cp = zterm.input.KpEnter })) { this.queue.push(.{ .accept = try this.input.toOwnedSlice() }); this.cursor_offset = 0; } }, else => {}, } } fn content(ctx: *anyopaque, cells: []zterm.Cell, size: zterm.Point) !void { const this: *@This() = @ptrCast(@alignCast(ctx)); assert(cells.len == @as(usize, size.x) * @as(usize, size.y)); // TODO add configuration for coloring the text! for (this.input.items, 0..) |cp, idx| { cells[idx].style.fg = .black; cells[idx].cp = cp; // NOTE do not write over the contents of this `Container`'s `Size` if (idx == cells.len - 1) break; } // TODO show ellipse `..` (maybe with configuration where - start, middle, end) // show cursor after text (if there is still space available) if (this.input.items.len < cells.len) cells[this.input.items.len - this.cursor_offset].style.cursor = true; } }; const MouseDraw = struct { position: ?zterm.Point = null, pub fn element(this: *@This()) App.Element { return .{ .ptr = this, .vtable = &.{ .handle = handle, .content = content, }, }; } fn handle(ctx: *anyopaque, event: App.Event) !void { const this: *@This() = @ptrCast(@alignCast(ctx)); switch (event) { .mouse => |mouse| this.position = .{ .x = mouse.x, .y = mouse.y }, else => this.position = null, } } fn content(ctx: *anyopaque, cells: []zterm.Cell, size: zterm.Point) !void { assert(cells.len == @as(usize, size.x) * @as(usize, size.y)); const this: *@This() = @ptrCast(@alignCast(ctx)); if (this.position) |pos| { const idx = @as(usize, size.x) * @as(usize, pos.y) + @as(usize, pos.x); cells[idx].cp = 'x'; cells[idx].style.fg = .red; } } }; pub fn main() !void { errdefer |err| log.err("Application Error: {any}", .{err}); var gpa: std.heap.DebugAllocator(.{}) = .init; defer if (gpa.deinit() == .leak) log.err("memory leak", .{}); const allocator = gpa.allocator(); var app: App = .init; var renderer = zterm.Renderer.Buffered.init(allocator); defer renderer.deinit(); var input_field: InputField = .init(allocator, &app.queue); defer input_field.deinit(); var mouse_draw: MouseDraw = .{}; var second_mouse_draw: MouseDraw = .{}; var quit_text: QuitText = .{}; var container = try App.Container.init(allocator, .{ .rectangle = .{ .fill = .grey }, .layout = .{ .direction = .vertical, .padding = .all(5), }, }, quit_text.element()); defer container.deinit(); try container.append(try App.Container.init(allocator, .{ .rectangle = .{ .fill = .light_grey }, .size = .{ .grow = .horizontal, .dim = .{ .y = 10 }, }, }, input_field.element())); var nested_container: App.Container = try .init(allocator, .{ .border = .{ .sides = .all, .color = .black, }, .rectangle = .{ .fill = .light_grey }, .layout = .{ .separator = .{ .enabled = true, .color = .black, }, }, }, .{}); try nested_container.append(try .init(allocator, .{ .rectangle = .{ .fill = .light_grey }, }, mouse_draw.element())); try nested_container.append(try .init(allocator, .{ .rectangle = .{ .fill = .light_grey }, }, second_mouse_draw.element())); try container.append(nested_container); try app.start(); defer app.stop() catch |err| log.err("Failed to stop application: {any}", .{err}); // event loop while (true) { const event = app.nextEvent(); log.debug("received event: {s}", .{@tagName(event)}); // pre event handling switch (event) { .key => |key| if (key.eql(.{ .cp = 'c', .mod = .{ .ctrl = true } })) app.quit(), .accept => |input| { defer allocator.free(input); var string = try allocator.alloc(u8, input.len); defer allocator.free(string); for (0.., input) |i, char| string[i] = @intCast(char); log.debug("Accepted input '{s}'", .{string}); }, .err => |err| log.err("Received {s} with message: {s}", .{ @errorName(err.err), err.msg }), else => {}, } container.handle(event) catch |err| app.postEvent(.{ .err = .{ .err = err, .msg = "Container Event handling failed", }, }); // post event handling switch (event) { .quit => break, else => {}, } container.resize(try renderer.resize()); container.reposition(.{}); try renderer.render(@TypeOf(container), &container); try renderer.flush(); } } pub const panic = App.panic_handler; const log = std.log.scoped(.default); const std = @import("std"); const assert = std.debug.assert; const zterm = @import("zterm"); const App = zterm.App(union(enum) { accept: []u21, });