╭─────────────╮ │scroll to top│ ╰─────────────╯ ╭ Files.zig ────────────────────────────────────────────────────╮ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ │ ╰───────────────────────────────────────────────────────────────╯
╭────╮ ╭ clone ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ╮ │http│ ssh │ │ ╰────╯ ╰ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ─ ╯
322 .dir = try aa.dupe(u8, dir), 323 .entries = &.{}, 324 }; 325 } 326 327 pub const View = struct { 328 // a vertical stack: the search box and clone url on top, then a horizontal 329 // split with the file/directory list on the left and a detail pane on the 330 // right showing the selected file's contents. 331 box: wgt.Box(ui.Widget), // vert: [header_index] = header row, [content_index] = split 332 data: *const Self, 333 session: *ui.Session, 334 // the list row whose contents the detail pane currently shows. 335 shown_index: ?usize, 336 337 // the sub-header leads the box where there is one; local mode has none 338 const header_index: usize = 0; 339 // indices within the content box (the horizontal split). 340 const list_index: usize = 0; 341 const detail_index: usize = 1; 342 // indices within the detail pane frame (nav box above the content scroll). 343 const detail_nav_index: usize = 0; 344 const detail_scroll_index: usize = 1; 345 const list_max_width: usize = 35; 346 const detail_min_width: usize = 40; 347 // a list row's height: one text line inside its (hidden) border. 348 const row_height: usize = 3; 349 350 pub fn init(allocator: std.mem.Allocator, data: *const Self, session: *ui.Session) !View { 351 var outer = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = null, .direction = .vert }); 352 errdefer outer.deinit(allocator); 353 354 // the search box and the clone url at the top. local mode has neither. 355 if (session.data.host_kind == .server) { 356 var header_view = try ui.widget.SearchHeader.init(allocator, session, data.location, " find file ", "find", data.find, data.find_available); 357 errdefer header_view.deinit(allocator); 358 try outer.children.put(allocator, header_view.getFocus().id, .{ .widget = .{ .search_header = header_view }, .rect = null, .min_size = .{ .width = null, .height = 3 } }); 359 } 360 361 var box = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = null, .direction = .horiz }); 362 errdefer box.deinit(allocator); 363 364 // the directory listing on the left (one focusable row each). 365 { 366 var list_scroll = blk: { 367 var list_box = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = null, .direction = .vert, .stretch = true }); 368 errdefer list_box.deinit(allocator); 369 370 // link kinds are borrowed by the rows, so they live in the page 371 // arena (as long as this page's widget tree). row labels are 372 // copied by their text boxes. 373 const aa = session.page_arena.allocator(); 374 if (data.dir.len != 0) { 375 try addRow(allocator, &list_box, "..", "", try dirLink(session.page_arena, data, parentDir(data.dir))); 376 } 377 for (data.entries) |entry| { 378 const path = try childDir(aa, data.dir, entry.name); 379 // a search result shows its file name, with its directory 380 // in the bottom label. 381 const label = if (data.find != null) 382 std.fs.path.basenamePosix(entry.name) 383 else if (entry.is_dir) 384 try std.fmt.allocPrint(aa, "{s}/", .{entry.name}) 385 else 386 entry.name; 387 const bottom_label = if (data.find != null) try resultDirLabel(aa, entry.name) else ""; 388 const link = if (entry.is_dir) 389 try dirLink(session.page_arena, data, path) 390 else 391 try fileLink(session.page_arena, data, path, entry.loaded, lineNumber(entry.window_start)); 392 try addRow(allocator, &list_box, label, bottom_label, link); 393 } 394 if (data.capped) try addRow(allocator, &list_box, "(list truncated)", "", ""); 395 // select the file the route named, else prefer a README so its 396 // contents greet the visitor in the detail pane, else the first 397 // row. a non-root directory has a leading ".." row, so the entry 398 // index is offset by one there. search results have no README 399 // default: the term decides what matters. 400 var sel: usize = 0; 401 if (list_box.children.count() > 0) { 402 const base: usize = if (data.dir.len != 0) 1 else 0; 403 const entry_idx = selectedFileIndex(data) orelse if (data.find == null) readmeIndex(data.entries) else null; 404 sel = if (entry_idx) |i| i + base else 0; 405 list_box.getFocus().child_id = list_box.children.keys()[sel]; 406 } 407 var sc = try wgt.Scroll(ui.Widget).init(allocator, .{ .box = list_box }, .{ .direction = .vert, .web_native = !session.is_terminal, .fill = true }); 408 // start scrolled so the selected row begins at the top of the 409 // viewport. rows are a fixed height, so no layout pass is 410 // needed; a too-far offset near the end of the list is clamped 411 // in build (the browser clamps its own scrolling natively). 412 sc.y = @intCast(sel * row_height); 413 break :blk sc; 414 }; 415 errdefer list_scroll.deinit(allocator); 416 try box.children.put(allocator, list_scroll.getFocus().id, .{ .widget = .{ .scroll = list_scroll }, .rect = null, .min_size = .{ .width = list_max_width, .height = null }, .max_size = .{ .width = list_max_width, .height = null } }); 417 } 418 419 // the detail pane on the right — a "next" nav box above a scroll of the 420 // selected file's content window. both are repopulated per selection by 421 // populateDetail. 422 { 423 var detail_outer = blk: { 424 var frame = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = null, .direction = .vert }); 425 errdefer frame.deinit(allocator); 426 427 { 428 var nav_box = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = null, .direction = .horiz }); 429 errdefer nav_box.deinit(allocator); 430 try frame.children.put(allocator, nav_box.getFocus().id, .{ .widget = .{ .box = nav_box }, .rect = null, .min_size = null }); 431 } 432 { 433 // the content scroll wrapped in a bordered box; build sets the 434 // border single normally and double when the content is focused 435 // (the content box itself is borderless). 436 var scroll_frame = blk2: { 437 var detail_scroll = blk3: { 438 var detail_inner = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = null, .direction = .vert }); 439 errdefer detail_inner.deinit(allocator); 440 break :blk3 try wgt.Scroll(ui.Widget).init(allocator, .{ .box = detail_inner }, .{ .direction = .both, .web_native = !session.is_terminal, .fill = true }); 441 }; 442 errdefer detail_scroll.deinit(allocator); 443 var sf = try wgt.Box(ui.Widget).init(allocator, .{ .border_style = .single, .rounded_corners = true, .direction = .vert }); 444 errdefer sf.deinit(allocator); 445 // the wrapper's selected child is its scroll, so the focus 446 // chain reaches the content box (populateDetail points the 447 // scroll's inner box at it). 448 sf.getFocus().child_id = detail_scroll.getFocus().id; 449 try sf.children.put(allocator, detail_scroll.getFocus().id, .{ .widget = .{ .scroll = detail_scroll }, .rect = null, .min_size = null }); 450 break :blk2 sf; 451 }; 452 errdefer scroll_frame.deinit(allocator); 453 // entering the detail pane lands on the content scroll (focus 454 // recovery descends the frame's selected child). the nav links 455 // above are reached by scrolling to the top, then up. 456 frame.getFocus().child_id = scroll_frame.getFocus().id; 457 // shrink, so the fill scroll yields the nav box's row 458 // instead of consuming the frame's whole height. 459 try frame.children.put(allocator, scroll_frame.getFocus().id, .{ .widget = .{ .box = scroll_frame }, .rect = null, .min_size = null, .flex = .shrink }); 460 } 461 break :blk frame; 462 }; 463 errdefer detail_outer.deinit(allocator); 464 detail_outer.getFocus().mode = .mouse; 465 try box.children.put(allocator, detail_outer.getFocus().id, .{ .widget = .{ .box = detail_outer }, .rect = null, .min_size = .{ .width = detail_min_width, .height = null } }); 466 } 467 468 box.getFocus().child_id = box.children.keys()[list_index]; 469 try outer.children.put(allocator, box.getFocus().id, .{ .widget = .{ .box = box }, .rect = null, .min_size = null }); 470 471 // focus lives in the split, except that search results start in the 472 // search box so the term can be refined right away. 473 outer.getFocus().child_id = outer.children.keys()[if (data.find != null) header_index else outer.children.count() - 1]; 474 return .{ .box = outer, .data = data, .session = session, .shown_index = null }; 475 } 476 477 fn addRow(allocator: std.mem.Allocator, box: *wgt.Box(ui.Widget), label: []const u8, bottom_label: []const u8, link: []const u8) !void { 478 var row = try wgt.TextBox.init(allocator, label, .{ .border_style = .hidden, .rounded_corners = true, .wrap_kind = .none, .bottom_label = bottom_label }); 479 errdefer row.deinit(allocator); 480 row.getFocus().mode = .all; 481 if (link.len != 0) row.getFocus().kind = .{ .custom = link }; 482 try box.children.put(allocator, row.getFocus().id, .{ .widget = .{ .text_box = row }, .rect = null, .min_size = null }); 483 } 484 485 // the selected file's contents as a single focusable multi-line text box. 486 // it's borderless — the border lives on the surrounding scroll frame, which 487 // doubles when this content is focused. a non-empty `link` makes activating 488 // the box follow it, like addRow. 489 fn addContentBox(self: *View, allocator: std.mem.Allocator, box: *wgt.Box(ui.Widget), text: []const u8, link: []const u8) !void { 490 _ = self; 491 var tb = try wgt.TextBox.init(allocator, text, .{ .border_style = null, .wrap_kind = .none }); 492 errdefer tb.deinit(allocator); 493 tb.getFocus().mode = .all; 494 if (link.len != 0) tb.getFocus().kind = .{ .custom = link }; 495 try box.children.put(allocator, tb.getFocus().id, .{ .widget = .{ .text_box = tb }, .rect = null, .min_size = null }); 496 } 497 498 pub fn deinit(self: *View, allocator: std.mem.Allocator) void { 499 self.box.deinit(allocator); 500 } 501 502 // the split is last, after the sub-header where there is one 503 fn contentIndex(self: *View) usize { 504 return self.box.children.count() - 1; 505 } 506 507 fn contentBox(self: *View) *wgt.Box(ui.Widget) { 508 return &self.box.children.values()[self.contentIndex()].widget.box; 509 } 510 511 fn header(self: *View) ?*ui.widget.SearchHeader { 512 switch (self.box.children.values()[header_index].widget) { 513 .search_header => |*header_view| return header_view, 514 else => return null, 515 } 516 } 517 518 fn headerActive(self: *View) bool { 519 const header_view = self.header() orelse return false; 520 return self.box.getFocus().child_id == header_view.getFocus().id; 521 } 522 523 fn listScroll(self: *View) *wgt.Scroll(ui.Widget) { 524 return &self.contentBox().children.values()[list_index].widget.scroll; 525 } 526 527 fn listBox(self: *View) *wgt.Box(ui.Widget) { 528 return &self.listScroll().child.box; 529 } 530 531 fn detailOuter(self: *View) *wgt.Box(ui.Widget) { 532 return &self.contentBox().children.values()[detail_index].widget.box; 533 } 534 535 fn navBox(self: *View) *wgt.Box(ui.Widget) { 536 return &self.detailOuter().children.values()[detail_nav_index].widget.box; 537 } 538 539 // the bordered box wrapping the content scroll (border toggles with focus). 540 fn detailScrollFrame(self: *View) *wgt.Box(ui.Widget) { 541 return &self.detailOuter().children.values()[detail_scroll_index].widget.box; 542 } 543 544 fn detailScroll(self: *View) *wgt.Scroll(ui.Widget) { 545 return &self.detailScrollFrame().children.values()[0].widget.scroll; 546 } 547 548 fn detailInner(self: *View) *wgt.Box(ui.Widget) { 549 return &self.detailScroll().child.box; 550 } 551 552 fn detailActive(self: *View) bool { 553 const content = self.contentBox(); 554 const cid = content.getFocus().child_id orelse return false; 555 return content.children.getIndex(cid) == detail_index; 556 } 557 558 // the selected list row's index, or null when nothing is focused. 559 fn selectedRowIndex(self: *View) ?usize { 560 const lb = self.listBox(); 561 const cid = lb.getFocus().child_id orelse return null; 562 return lb.children.getIndex(cid); 563 } 564 565 // the entry the selected row points at, or null for the ".." row (which 566 // isn't an entry). directory rows return their entry too, though they carry 567 // no contents. 568 fn selectedEntry(self: *View) ?Entry { 569 const idx = self.selectedRowIndex() orelse return null; 570 const base: usize = if (self.data.dir.len != 0) 1 else 0; // skip the ".." row 571 if (idx < base) return null; 572 const e = idx - base; 573 if (e >= self.data.entries.len) return null; 574 return self.data.entries[e]; 575 } 576 577 pub fn build(self: *View, allocator: std.mem.Allocator, constraint: layout.Constraint, root_focus: *Focus) !void { 578 self.clearGrid(); 579 580 // swap the detail pane to the selected entry when the selection changes. 581 try self.refreshDetail(allocator); 582 583 // the selected list row shows a border (the focused TextBox upgrades it 584 // to a double border itself); the rest stay borderless. 585 const lb = self.listBox(); 586 for (lb.children.keys(), lb.children.values()) |id, *child| { 587 switch (child.widget) { 588 .text_box => |*tb| { 589 const selected = lb.getFocus().child_id == id; 590 tb.options.border_style = if (selected) .single else .hidden; 591 tb.options.inverted = selected; 592 }, 593 else => {}, 594 } 595 } 596 597 // the content scroll's border is single normally and double when the 598 // content is focused (the content box itself is borderless). 599 const has_content = self.detailInner().children.count() > 0; 600 const content_focused = if (root_focus.grandchild_id) |g| self.detailInner().children.contains(g) else false; 601 self.detailScrollFrame().options.border_style = if (!has_content) null else if (content_focused) .double else .single; 602 603 // cap the list at list_max_width only while the detail pane fits beside 604 // it. the box drops the detail pane when the width can't hold both 605 // minimums, so when it's that narrow we lift the cap and let the list 606 // fill the whole width. 607 const both_panes_fit = if (constraint.max_size.width) |w| w >= list_max_width + detail_min_width else true; 608 self.contentBox().children.values()[list_index].max_size = if (both_panes_fit) .{ .width = list_max_width, .height = null } else null; 609 610 // stretch the detail pane and its bordered scroll frame across the rest 611 // of the width so the pane fills the area rather than shrinking to its 612 // content, like the refs view's columns. the content scroll inside keeps 613 // its natural width: forcing it to the full inner width would make it one 614 // column too wide whenever the vertical scrollbar appears, leaving a 615 // phantom horizontal scroll. (height fills via the scroll clipping to the 616 // viewport.) 617 if (constraint.max_size.width) |w| { 618 const detail_w = if (both_panes_fit) w - list_max_width else w; 619 self.contentBox().children.values()[detail_index].min_size = .{ .width = detail_w, .height = null }; 620 self.detailOuter().children.values()[detail_scroll_index].min_size = .{ .width = detail_w, .height = null }; 621 } else { 622 self.contentBox().children.values()[detail_index].min_size = .{ .width = detail_min_width, .height = null }; 623 self.detailOuter().children.values()[detail_scroll_index].min_size = null; 624 } 625 626 // crossing panes only re-selects the content box's child (focusList / 627 // focusDetail); when the window is too narrow to show both, the pane that 628 // was holding focus is dropped here. the framework recovers focus after 629 // the top-level build by re-deriving it down the selected-child chain, so 630 // there's nothing to fix up afterward. 631 try self.box.build(allocator, constraint, root_focus); 632 633 // clamp the list's initial offset (a selected row near the end of the 634 // list) against this build's grids, for the next frame. initRoot's 635 // pre-sizing build is unbounded — its full-content "viewport" would 636 // clamp the offset to zero, so only a bounded build counts. 637 if (constraint.max_size.height != null) self.listScroll().clampToContent(); 638 } 639 640 fn refreshDetail(self: *View, allocator: std.mem.Allocator) !void { 641 const cur = self.selectedRowIndex(); 642 if (std.meta.eql(cur, self.shown_index)) return; 643 try self.populateDetail(allocator); 644 self.shown_index = cur; 645 } 646 647 fn populateDetail(self: *View, allocator: std.mem.Allocator) !void { 648 const nav_box = self.navBox(); 649 const inner = self.detailInner(); 650 651 for (nav_box.children.values()) |*child| child.widget.deinit(allocator); 652 nav_box.children.clearAndFree(allocator); 653 nav_box.getFocus().child_id = null; 654 for (inner.children.values()) |*child| child.widget.deinit(allocator); 655 inner.children.clearAndFree(allocator); 656 inner.getFocus().child_id = null; 657 658 // only files have contents to show; directories and the ".." row leave 659 // the pane empty. 660 if (self.selectedEntry()) |entry| { 661 if (!entry.is_dir) { 662 // the window links sit above the scroll, so they stay put 663 // while the content scrolls. 664 if (entry.window_start > 0) try self.addNavLink(allocator, nav_box, "scroll to top", entry, 0); 665 if (entry.has_more) try self.addNavLink(allocator, nav_box, "next lines →", entry, lineNumber(entry.window_start + file_page)); 666 if (!entry.loaded) { 667 // the placeholder carries the file's "a:" link, so enter 668 // (or a click) here loads the file like on its list row. 669 const path = try childDir(self.session.page_arena.allocator(), self.data.dir, entry.name); 670 const link = try fileLink(self.session.page_arena, self.data, path, false, 0); 671 try self.addContentBox(allocator, inner, "(press enter to load this file)", link); 672 } else if (entry.is_binary) { 673 try self.addContentBox(allocator, inner, "(binary file)", ""); 674 } else { 675 const text = try numberedContent(self.session.page_arena.allocator(), entry.lines, entry.window_start); 676 try self.addContentBox(allocator, inner, text, ""); 677 } 678 } 679 } 680 // point each box at its first child so focus can descend into it. 681 if (nav_box.children.count() > 0) nav_box.getFocus().child_id = nav_box.children.keys()[0]; 682 if (inner.children.count() > 0) inner.getFocus().child_id = inner.children.keys()[0]; 683 684 // reserve the nav row's height (the shrink scroll frame yields it). 685 self.detailOuter().children.values()[detail_nav_index].min_size = 686 if (nav_box.children.count() > 0) .{ .width = null, .height = row_height } else null; 687 688 // reset the scroll to the top for the newly-shown file: directly on the 689 // terminal (the wasm offset), and via a version bump on the web (so the 690 // renderer's scroll id changes and JS drops the preserved position). 691 const sc = self.detailScroll(); 692 sc.x = 0; 693 sc.y = 0; 694 sc.getFocus().version +%= 1; 695 } 696 697 // a focusable "next" link above the content. it's an `a:` link to the 698 // selected file at `target_start`, so activating it (the host follows the 699 // link) reloads the page on the next window. 700 fn addNavLink(self: *View, allocator: std.mem.Allocator, box: *wgt.Box(ui.Widget), label: []const u8, entry: Entry, target_start: usize) !void { 701 const page_arena = self.session.page_arena; 702 const path = try childDir(page_arena.allocator(), self.data.dir, entry.name); 703 const route = self.data.filesRoute(path, target_start) orelse return error.RouteTooLong; 704 const link = try std.fmt.allocPrint(page_arena.allocator(), "a:{s}", .{try route.toUrl(page_arena)}); 705 var tb = try wgt.TextBox.init(allocator, label, .{ .border_style = .single, .rounded_corners = true, .wrap_kind = .none }); 706 errdefer tb.deinit(allocator); 707 tb.getFocus().mode = .all; 708 tb.getFocus().kind = .{ .custom = link }; 709 try box.children.put(allocator, tb.getFocus().id, .{ .widget = .{ .text_box = tb }, .rect = null, .min_size = null }); 710 } 711 712 pub fn input(self: *View, allocator: std.mem.Allocator, key: Key, root_focus: *Focus) !void { 713 // scrolling crosses the sub header boundary the same way arrows do 714 const direction = inp.vertDirection(key); 715 if (self.headerActive()) { 716 // active means there is one 717 const header_view = self.header() orelse unreachable; 718 if (direction == .down) { 719 root_focus.setFocus(self.contentBox().getFocus().id); 720 return; 721 } 722 if (key == .enter) if (try header_view.submittedText(allocator)) |term| { 723 defer allocator.free(term); 724 return self.submit(term); 725 }; 726 return header_view.input(allocator, key, root_focus); 727 } 728 if (direction == .up and self.contentAtTop() and self.focusHeader(root_focus)) return; 729 if (self.detailActive()) { 730 try self.detailInput(key, root_focus); 731 } else { 732 try self.listInput(key, root_focus); 733 } 734 } 735 736 // navigate to the typed term's results, pinned to the listing's ref. an 737 // empty term leaves the results for the plain listing. 738 fn submit(self: *View, term: []const u8) !void { 739 if (term.len == 0 and self.data.find == null) return; 740 const route = self.data.filesRoute("", 0) orelse return; 741 try self.session.navigate(route.withFind(term) orelse return); 742 } 743 744 fn listInput(self: *View, key: Key, root_focus: *Focus) !void { 745 // up/down (and the scroll wheel) move the selection; page up/down jump a 746 // fixed amount. right/Enter cross into the detail pane. Enter/clicks on a 747 // directory (or "..") row are turned into navigation by the host 748 // (crossPageLink) before reaching here. 749 if (inp.rowDelta(key, @intCast(self.listBox().children.count()))) |delta| { 750 ui.widget.moveRowFocus(self.listBox(), self.listScroll(), root_focus, delta); 751 return; 752 } 753 switch (key) { 754 .enter, .arrow_right => try self.focusDetail(root_focus), 755 else => {}, 756 } 757 } 758 759 // whether focus is on the content box (vs. a "previous"/"next" nav link). 760 fn focusOnContent(self: *View, root_focus: *Focus) bool { 761 const g = root_focus.grandchild_id orelse return false; 762 return self.detailInner().children.contains(g); 763 } 764 765 fn detailInput(self: *View, key: Key, root_focus: *Focus) !void { 766 const sc = self.detailScroll(); 767 const on_content = self.focusOnContent(root_focus); 768 // the "next" link sits above the content scroll. on the link, left returns 769 // to the file list and down drops into the content. in the content, the 770 // terminal scrolls by offset and reaching the top then pressing up crosses 771 // back up to the link; on the web vertical scrolling is the browser's job 772 // so up just crosses to the link. 773 switch (key) { 774 .arrow_left => { 775 if (on_content) { 776 if (sc.x > 0) { 777 sc.x -= 1; 778 self.detailScroll().clampToContent(); 779 } else try self.focusList(root_focus); 780 } else if (!self.moveNav(root_focus, -1)) { 781 try self.focusList(root_focus); 782 } 783 }, 784 .arrow_right => { 785 if (on_content) { 786 sc.x += 1; 787 self.detailScroll().clampToContent(); 788 } else _ = self.moveNav(root_focus, 1); 789 }, 790 .arrow_up => { 791 if (on_content) { 792 if (self.session.is_terminal and sc.y > 0) { 793 sc.y -= 1; 794 self.detailScroll().clampToContent(); 795 } else self.focusNav(root_focus); // cross up to the links 796 } 797 }, 798 .arrow_down => { 799 if (on_content) { 800 if (self.session.is_terminal) { 801 sc.y += 1; 802 self.detailScroll().clampToContent(); 803 } 804 } else self.focusContent(root_focus); // links -> content 805 }, 806 .page_up => if (on_content and self.session.is_terminal) { 807 sc.y -= 10; 808 self.detailScroll().clampToContent(); 809 }, 810 .page_down => if (on_content and self.session.is_terminal) { 811 sc.y += 10; 812 self.detailScroll().clampToContent(); 813 }, 814 .home => if (on_content and self.session.is_terminal) { 815 sc.y = 0; 816 self.detailScroll().clampToContent(); 817 }, 818 .end => if (on_content and self.session.is_terminal) { 819 sc.y = std.math.maxInt(isize); 820 self.detailScroll().clampToContent(); 821 }, 822 .mouse => |mouse| switch (mouse.action) { 823 .scroll => |dir| if (on_content and self.session.is_terminal) { 824 sc.y += if (dir == .up) -5 else 5; 825 self.detailScroll().clampToContent(); 826 }, 827 else => {}, 828 }, 829 else => {}, 830 } 831 } 832 833 // focus the first (left-most) nav link; a no-op when there are none, leaving 834 // focus on the content. 835 fn focusNav(self: *View, root_focus: *Focus) void { 836 const nav_box = self.navBox(); 837 if (nav_box.children.count() == 0) return; 838 root_focus.setFocus(nav_box.children.keys()[0]); 839 } 840 841 fn focusContent(self: *View, root_focus: *Focus) void { 842 const inner = self.detailInner(); 843 const id = inner.getFocus().child_id orelse (if (inner.children.count() > 0) inner.children.keys()[0] else return); 844 root_focus.setFocus(id); 845 } 846 847 // move focus `delta` rows within the nav box; returns false (without moving) 848 // when that would step off either end. 849 fn moveNav(self: *View, root_focus: *Focus, delta: isize) bool { 850 const nav_box = self.navBox(); 851 const keys = nav_box.children.keys(); 852 const cur_id = nav_box.getFocus().child_id orelse return false; 853 const cur: isize = @intCast(nav_box.children.getIndex(cur_id) orelse return false); 854 const target = cur + delta; 855 if (target < 0 or target >= @as(isize, @intCast(keys.len))) return false; 856 root_focus.setFocus(keys[@intCast(target)]); 857 return true; 858 } 859 860 // enter the detail pane, landing on the "next" link when there is one (so 861 // right-arrow reaches it), else on the content. a directory or ".." row has 862 // neither, so there's nothing to enter. selecting the frame's child (then 863 // focusing the frame) also handles the too-narrow case where the pane isn't 864 // laid out yet — focus lands inside it after the next build. 865 fn focusDetail(self: *View, root_focus: *Focus) !void { 866 const frame = self.detailOuter(); 867 if (self.navBox().children.count() > 0) { 868 frame.getFocus().child_id = self.navBox().getFocus().id; 869 } else if (self.detailInner().children.count() > 0) { 870 frame.getFocus().child_id = self.detailScrollFrame().getFocus().id; 871 } else return; 872 root_focus.setFocus(frame.getFocus().id); 873 } 874 875 // return to the list. 876 fn focusList(self: *View, root_focus: *Focus) !void { 877 root_focus.setFocus(self.listScroll().getFocus().id); 878 } 879 880 pub fn clearGrid(self: *View) void { 881 self.box.clearGrid(); 882 } 883 884 pub fn getGrid(self: View) ?Grid { 885 return self.box.getGrid(); 886 } 887 888 pub fn getFocus(self: *View) *Focus { 889 return self.box.getFocus(); 890 } 891 892 fn contentAtTop(self: *View) bool { 893 if (self.detailActive()) { 894 if (self.detailOuter().getFocus().child_id == self.navBox().getFocus().id) return true; 895 return self.navBox().children.count() == 0 and 896 (!self.session.is_terminal or self.detailScroll().y == 0); 897 } 898 const lb = self.listBox(); 899 const cid = lb.getFocus().child_id orelse return true; 900 return lb.children.getIndex(cid) == 0; 901 } 902 903 // only the header's own row sits directly below the repository header. 904 pub fn atTop(self: *View) bool { 905 const focusable = if (self.header()) |header_view| header_view.hasFocusable() else false; 906 return self.headerActive() or (!focusable and self.contentAtTop()); 907 } 908 909 pub fn focusHeader(self: *View, root_focus: *Focus) bool { 910 const header_view = self.header() orelse return false; 911 return header_view.focusHeader(root_focus); 912 } 913 }; 914 915 // join `lines` into one string, each prefixed with its 1-based file line number 916 // (right-aligned in a column wide enough for the last number, then a space), 917 // like the diffs view. `start` is the window's 0-based first line, so numbers 918 // continue across paginated windows. 919 fn numberedContent(arena: std.mem.Allocator, lines: []const []const u8, start: usize) ![]const u8 { 920 if (lines.len == 0) return ""; 921 const width = std.fmt.count("{d}", .{start + lines.len}); 922 const indent = try arena.alloc(u8, width); 923 @memset(indent, ' '); 924 925 var out: std.ArrayList(u8) = .empty; 926 for (lines, 0..) |line, i| { 927 if (i != 0) try out.append(arena, '\n'); 928 const num_str = try std.fmt.allocPrint(arena, "{d}", .{start + i + 1}); 929 try out.appendSlice(arena, indent[0 .. width - num_str.len]); 930 try out.appendSlice(arena, num_str); 931 try out.append(arena, ' '); 932 try out.appendSlice(arena, line); 933 } 934 return out.toOwnedSlice(arena); 935 } 936 937 // the index of the "README"/"README.md" file entry (case-insensitive), or null 938 // if none. used to pick the default selection at the repo root. 939 fn readmeIndex(entries: []const Entry) ?usize { 940 for (entries, 0..) |entry, i| { 941 if (!entry.is_dir and isReadme(entry.name)) return i; 942 } 943 return null; 944 } 945 946 fn isReadme(name: []const u8) bool { 947 return std.ascii.eqlIgnoreCase(name, "README") or std.ascii.eqlIgnoreCase(name, "README.md"); 948 } 949 950 // the index of the entry the route named (data.selected_file), or null if none. 951 fn selectedFileIndex(data: *const Self) ?usize { 952 const name = data.selected_file orelse return null; 953 for (data.entries, 0..) |entry, i| { 954 if (!entry.is_dir and std.mem.eql(u8, entry.name, name)) return i; 955 } 956 return null; 957 } 958 959 // an "a:" link to the files route at `path`, pinned to the listing's ref, so 960 // following it navigates to that directory's listing. 961 fn dirLink(page_arena: *std.heap.ArenaAllocator, data: *const Self, path: []const u8) ![]const u8 { 962 const route = data.filesRoute(path, 0) orelse return error.RouteTooLong; 963 return std.fmt.allocPrint(page_arena.allocator(), "a:{s}", .{try route.toUrl(page_arena)}); 964 } 965 966 // a link to the file's route. a preloaded file gets an "ai:" link 967 // (crossPageLink ignores it, so a click selects the row in place and shows its 968 // contents); an unloaded file gets an "a:" link, so activating it reloads the 969 // page with that file selected and its content read. 970 fn fileLink(page_arena: *std.heap.ArenaAllocator, data: *const Self, path: []const u8, loaded: bool, line: usize) ![]const u8 { 971 const route = data.filesRoute(path, line) orelse return error.RouteTooLong; 972 const prefix = if (loaded) "ai:" else "a:"; 973 return std.fmt.allocPrint(page_arena.allocator(), "{s}{s}", .{ prefix, try route.toUrl(page_arena) }); 974 } 975 976 // the url `line` value for a content window: its first line's 1-based number, 977 // except the first window, which serializes as unset (0). 978 fn lineNumber(window_start: usize) usize { 979 return if (window_start == 0) 0 else window_start + 1; 980 } 981 982 // `dir`/`name`, or just `name` at the root. 983 pub fn childDir(arena: std.mem.Allocator, dir: []const u8, name: []const u8) ![]const u8 { 984 return if (dir.len == 0) name else std.fmt.allocPrint(arena, "{s}/{s}", .{ dir, name }); 985 } 986 987 // `dir` with its last segment removed ("" when `dir` has a single segment). 988 fn parentDir(dir: []const u8) []const u8 { 989 const slash = std.mem.lastIndexOfScalar(u8, dir, '/') orelse return ""; 990 return dir[0..slash]; 991 } 992 993 // a search result's bottom label: the directory it sits in, empty at the root. 994 // a directory too wide for the list column is clipped from the left. 995 fn resultDirLabel(aa: std.mem.Allocator, path: []const u8) ![]const u8 { 996 const slash = std.mem.lastIndexOfScalar(u8, path, '/') orelse return ""; 997 const dir = path[0..slash]; 998 // the row's border and the label's padding take two columns each 999 const max_width = View.list_max_width - 4; 1000 var width = try xitui.width.displayWidth(dir); 1001 if (width <= max_width) return std.fmt.allocPrint(aa, " {s} ", .{dir}); 1002 1003 const ellipsis = ".."; 1004 var iter = (try std.unicode.Utf8View.init(dir)).iterator(); 1005 var start: usize = 0; 1006 while (width > max_width - ellipsis.len) { 1007 const slice = iter.nextCodepointSlice() orelse break; 1008 width -= xitui.width.cellWidth(try std.unicode.utf8Decode(slice)); 1009 start += slice.len; 1010 } 1011 return std.fmt.allocPrint(aa, " " ++ ellipsis ++ "{s} ", .{dir[start..]}); 1012 } 1013