╭─────────────╮ │scroll to top│ ╰─────────────╯ ╭ ui.zig ───────────────────────────────────────────────────────╮ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ╰───────────────────────────────────────────────────────────────╯
╭────╮ ╭ clone ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ╮ │http│ ssh │ │ ╰────╯ ╰ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ╯
2379 if (j >= content.len) { 2380 i = content.len; // malformed trailing escape; stop 2381 } else { 2382 if (content[j] == 'm') applySgr(&style, content[i + 2 .. j]); 2383 i = j + 1; 2384 } 2385 } else { 2386 const len = std.unicode.utf8ByteSequenceLength(byte) catch 1; 2387 const end = @min(content.len, i + len); 2388 const rune = content[i..end]; 2389 const transparent = end - i == 1 and rune[0] == ' ' and 2390 style.fg == null and style.bg == null and !style.inverted; 2391 try row.append(allocator, .{ 2392 .rune = if (transparent) null else rune, 2393 .style = style, 2394 }); 2395 i = end; 2396 } 2397 } 2398 // a trailing row with content but no closing newline 2399 if (row.items.len > 0) { 2400 width = @max(width, row.items.len); 2401 try rows.append(allocator, row); 2402 } else { 2403 row.deinit(allocator); 2404 } 2405 row = .empty; // ownership moved into rows (or freed); keep errdefer safe 2406 2407 const height = rows.items.len; 2408 if (width == 0 or height == 0) return; 2409 2410 const clamped_w = @min(width, constraint.max_size.width orelse width); 2411 const clamped_h = @min(height, constraint.max_size.height orelse height); 2412 2413 var grid = try Grid.init(allocator, .{ .width = clamped_w, .height = clamped_h }); 2414 errdefer grid.deinit(); 2415 for (rows.items[0..clamped_h], 0..) |r, y| { 2416 const n = @min(r.items.len, clamped_w); 2417 for (r.items[0..n], 0..) |cell, x| { 2418 grid.cells.items[try grid.cells.at(.{ y, x })] = cell; 2419 } 2420 } 2421 self.grid = grid; 2422 } 2423 2424 pub fn clearGrid(self: *AnsiArt) void { 2425 if (self.grid) |*grid| { 2426 grid.deinit(); 2427 self.grid = null; 2428 } 2429 } 2430 2431 pub fn getGrid(self: AnsiArt) ?Grid { 2432 return self.grid; 2433 } 2434 2435 pub fn getFocus(self: *AnsiArt) *Focus { 2436 return self.focus; 2437 } 2438 2439 fn applySgr(style: *Grid.Style, params: []const u8) void { 2440 var nums: [16]u32 = undefined; 2441 var n: usize = 0; 2442 var it = std.mem.splitScalar(u8, params, ';'); 2443 while (it.next()) |tok| { 2444 if (n >= nums.len) break; 2445 // an empty parameter (e.g. bare "\x1b[m") means 0 2446 nums[n] = std.fmt.parseInt(u32, tok, 10) catch 0; 2447 n += 1; 2448 } 2449 if (n == 0) { 2450 style.* = .{}; 2451 return; 2452 } 2453 var i: usize = 0; 2454 while (i < n) : (i += 1) { 2455 switch (nums[i]) { 2456 0 => style.* = .{}, 2457 7 => style.inverted = true, 2458 27 => style.inverted = false, 2459 39 => style.fg = null, 2460 49 => style.bg = null, 2461 38, 48 => { 2462 // truecolor form: 38;2;r;g;b — anything else is ignored 2463 if (i + 4 < n and nums[i + 1] == 2) { 2464 const c = Grid.Color{ 2465 .r = @truncate(nums[i + 2]), 2466 .g = @truncate(nums[i + 3]), 2467 .b = @truncate(nums[i + 4]), 2468 }; 2469 if (nums[i] == 38) style.fg = c else style.bg = c; 2470 i += 4; 2471 } 2472 }, 2473 else => {}, 2474 } 2475 } 2476 } 2477 }; 2478 2479 // a full-screen wrapper that renders ANSI art behind whatever page it wraps 2480 pub const AnsiBackground = struct { 2481 grid: ?Grid, 2482 child: *Widget, 2483 art: AnsiArt, 2484 session: *Session, 2485 2486 pub fn init(allocator: std.mem.Allocator, child_widget: Widget, art_content: []const u8, session: *Session) !AnsiBackground { 2487 var cw = child_widget; 2488 const child = allocator.create(Widget) catch |e| { 2489 cw.deinit(allocator); 2490 return e; 2491 }; 2492 child.* = cw; 2493 errdefer { 2494 child.deinit(allocator); 2495 allocator.destroy(child); 2496 } 2497 return .{ .grid = null, .child = child, .art = try AnsiArt.init(allocator, art_content), .session = session }; 2498 } 2499 2500 pub fn deinit(self: *AnsiBackground, allocator: std.mem.Allocator) void { 2501 if (self.grid) |*grid| grid.deinit(); 2502 self.art.deinit(allocator); 2503 self.child.deinit(allocator); 2504 allocator.destroy(self.child); 2505 } 2506 2507 pub fn build(self: *AnsiBackground, allocator: std.mem.Allocator, constraint: layout.Constraint, root_focus: *Focus) !void { 2508 self.clearGrid(); 2509 2510 // make the wrapped page fill the whole available area 2511 try self.child.build(allocator, .{ 2512 .min_size = .{ 2513 .width = constraint.max_size.width orelse constraint.min_size.width, 2514 .height = constraint.max_size.height orelse constraint.min_size.height, 2515 }, 2516 .max_size = constraint.max_size, 2517 }, root_focus); 2518 2519 if (self.session.data.enable_ansi) { 2520 if (self.child.getGrid()) |fg| { 2521 self.grid = try artBehind(allocator, fg, &self.art, .top_right, self.session.is_terminal, root_focus); 2522 } 2523 } 2524 } 2525 2526 pub fn input(self: *AnsiBackground, allocator: std.mem.Allocator, key: Key, root_focus: *Focus) !void { 2527 try self.child.input(allocator, key, root_focus); 2528 } 2529 2530 pub fn clearGrid(self: *AnsiBackground) void { 2531 if (self.grid) |*grid| { 2532 grid.deinit(); 2533 self.grid = null; 2534 } 2535 self.child.clearGrid(); 2536 self.art.clearGrid(); 2537 } 2538 2539 pub fn getGrid(self: AnsiBackground) ?Grid { 2540 return self.grid orelse self.child.getGrid(); 2541 } 2542 2543 pub fn getFocus(self: *AnsiBackground) *Focus { 2544 return self.child.getFocus(); 2545 } 2546 2547 // which top corner the art hugs. 2548 const ArtAnchor = enum { top_left, top_right }; 2549 2550 // a foreground cell counts as blank if it's empty or a bare space without styling 2551 fn cellIsBlank(cell: Grid.Cell) bool { 2552 if (cell.rune) |rune| { 2553 return std.mem.eql(u8, rune, " ") and 2554 cell.style.fg == null and cell.style.bg == null and !cell.style.inverted; 2555 } 2556 return true; 2557 } 2558 2559 // the art is dimmed to this fraction of its brightness so foreground text 2560 // stays legible over it 2561 const art_brightness = 45; // percent 2562 2563 fn dimColor(color: ?Grid.Color) ?Grid.Color { 2564 const c = color orelse return null; 2565 return .{ 2566 .r = @intCast(@as(u16, c.r) * art_brightness / 100), 2567 .g = @intCast(@as(u16, c.g) * art_brightness / 100), 2568 .b = @intCast(@as(u16, c.b) * art_brightness / 100), 2569 }; 2570 } 2571 2572 // terminals that don't support truecolor misparse a "38;2;r;g;b"/"48;2;…" 2573 // SGR as a list of plain SGR codes, so any channel value in 1..9 turns on 2574 // a text attribute (5/6 = blink, 7 = inverse, 8 = conceal, …). 2575 // snap such channels clear of that range so the backdrop doesn't blink or 2576 // hide text there; the ≤9/255 shift is imperceptible on terminals that 2577 // actually render truecolor. 2578 fn sgrSafe(color: ?Grid.Color) ?Grid.Color { 2579 const c = color orelse return null; 2580 const snap = struct { 2581 fn f(v: u8) u8 { 2582 return if (v >= 1 and v <= 9) 10 else v; 2583 } 2584 }.f; 2585 return .{ .r = snap(c.r), .g = snap(c.g), .b = snap(c.b) }; 2586 } 2587 2588 // composites ANSI art behind a foreground grid 2589 fn artBehind(allocator: std.mem.Allocator, foreground: Grid, art: *AnsiArt, anchor: ArtAnchor, is_terminal: bool, root_focus: *Focus) !Grid { 2590 art.clearGrid(); 2591 try art.build(allocator, .{ 2592 .min_size = .{ .width = null, .height = null }, 2593 .max_size = .{ .width = foreground.size.width, .height = foreground.size.height }, 2594 }, root_focus); 2595 2596 var out = try Grid.initFromGrid(allocator, foreground, foreground.size, 0, 0); 2597 errdefer out.deinit(); 2598 2599 if (art.getGrid()) |art_grid| { 2600 const anchor_x = switch (anchor) { 2601 .top_left => 0, 2602 .top_right => foreground.size.width -| art_grid.size.width, 2603 }; 2604 for (0..art_grid.size.height) |y| { 2605 for (0..art_grid.size.width) |x| { 2606 const src = art_grid.cells.items[try art_grid.cells.at(.{ y, x })]; 2607 if (src.rune == null) continue; 2608 const idx = out.cells.at(.{ y, anchor_x + x }) catch continue; 2609 const dst = &out.cells.items[idx]; 2610 // composite the dimmed art behind every cell so it shows 2611 // through the whole UI: a blank cell becomes the art, while a 2612 // cell with a glyph keeps the glyph but takes the dimmed art as 2613 // its background (replacing whatever background it had, which 2614 // would otherwise obscure the art). 2615 if (cellIsBlank(dst.*)) { 2616 dst.* = src; 2617 dst.style.fg = sgrSafe(dimColor(dst.style.fg)); 2618 dst.style.bg = sgrSafe(dimColor(dst.style.bg)); 2619 } else { 2620 const background_maybe = sgrSafe(dimColor(src.style.bg orelse src.style.fg)); 2621 dst.style.bg = background_maybe; 2622 // change the color of text overlaying ANSI art to ensure 2623 // it is readable. don't do this in the web UI, since we 2624 // have direct control of the theme there (also, inner 2625 // scroll panes allow text to move without a re-render 2626 // by the TUI, which would break this). also don't do this 2627 // if the text is explicitly styled. 2628 if (is_terminal and dst.style.fg == null) { 2629 if (background_maybe) |background| { 2630 // use near-black and near-white, which is easier on the eyes 2631 // while retaining high contrast 2632 const luminance = (@as(u32, background.r) * 299 + 2633 @as(u32, background.g) * 587 + 2634 @as(u32, background.b) * 114) / 1000; 2635 dst.style.fg = if (luminance >= 128) 2636 .{ .r = 16, .g = 16, .b = 16 } 2637 else 2638 .{ .r = 240, .g = 240, .b = 240 }; 2639 } 2640 } 2641 } 2642 } 2643 } 2644 } 2645 return out; 2646 } 2647 }; 2648