Line numbers

src/haz3lcore/derived/Measured.re

@@ -326,7 +326,12 @@ let of_segment =
           );
         // add seg to map and reset seg
         //TODO(andrew): decide if should actually add linebreak here
-        let map = add_piece_row(origin.row, seg, map);
+        let map =
+          add_piece_row(
+            origin.row,
+            seg @ [Piece.Secondary(Secondary.mk_newline(Id.mk()))],
+            map,
+          );
         let map =
           size.row == 0 ? map : add_n_empty_piece_rows(size.row - 1, map);
         ([], new_indent, size, map);
@@ -344,7 +349,11 @@ let of_segment =
         ? {
           let g = DeferredLinebreaks.of_secondary();
           add_n_rows(origin, indent, g, map)
-          |> add_piece_row(origin.row, seg, _)
+          |> add_piece_row(
+               origin.row,
+               seg @ [Piece.Secondary(Secondary.mk_empty(Id.mk()))],
+               _,
+             )
           |> add_n_empty_piece_rows(g - 1);
         }
         : map;

src/haz3lcore/lang/Token.re

@@ -42,6 +42,7 @@ let bounding_box = (t: t): Point.t =>
 /* Token Recognition Predicates */
 
 /* A. Secondary Notation (Comments, Whitespace, etc.)  */
+let empty = "";
 let space = " ";
 let linebreak = "\n";
 let comment_regexp = regexp("^#[^#\n]*#$"); /* Multiline comments not supported */

src/haz3lcore/tiles/Secondary.re

@@ -21,6 +21,11 @@ let cls_of = (s: t): cls =>
   | Comment(_) => Comment
   };
 
+let mk_empty = id => {
+  content: Whitespace(Token.empty),
+  id,
+};
+
 let mk_space = id => {
   content: Whitespace(Token.space),
   id,

src/web/Settings.re

@@ -13,6 +13,8 @@ module Model = {
     explainThis: ExplainThisModel.Settings.t,
     assistant: AssistantSettings.t,
     sidebar: SidebarModel.Settings.t,
+    line_numbers: bool,
+    relative_line_numbers: bool,
   };
 
   let init = {
@@ -56,6 +58,8 @@ module Model = {
       panel: LanguageDocumentation,
       show: true,
     },
+    line_numbers: true,
+    relative_line_numbers: false,
   };
 
   let fix_instructor_mode = settings =>
@@ -113,7 +117,9 @@ module Update = {
     | Sidebar(SidebarModel.Settings.action)
     | ExplainThis(ExplainThisModel.Settings.action)
     | Assistant(AssistantSettings.action)
-    | FlipAnimations;
+    | FlipAnimations
+    | ToggleLineNumbers
+    | ToggleRelativeLineNumbers;
 
   let can_undo = (action: t) => {
     switch (action) {
@@ -314,6 +320,15 @@ module Update = {
           ...settings, //TODO[Matt]: Make sure instructor mode actually makes prelude read-only
           instructor_mode: !settings.instructor_mode,
         }
+
+      | ToggleLineNumbers => {
+          ...settings,
+          line_numbers: !settings.line_numbers,
+        }
+      | ToggleRelativeLineNumbers => {
+          ...settings,
+          relative_line_numbers: !settings.relative_line_numbers,
+        }
       }
     )
     |> Updated.return(~scroll_active=false);

src/web/app/editors/Editors.re

@@ -358,6 +358,7 @@ module View = {
         editors: Model.t,
       ) =>
     switch (editors) {
+    // Add in the line numbering for Scratch editor
     | Scratch(m) =>
       ScratchMode.View.view(
         ~signal=
@@ -372,6 +373,7 @@ module View = {
         ~inject=a => Update.Scratch(a) |> inject,
         m,
       )
+    // Add in the line numbering for Documentation editor
     | Documentation(m) =>
       ScratchMode.View.view(
         ~signal=

src/web/app/editors/cell/CellEditor.re

@@ -178,6 +178,7 @@ module View = {
         ~caption: option(Node.t)=?,
         ~result_kind=?,
         ~locked=false,
+        ~lines=false,
         model: Model.t,
       ) => {
     let (footer, overlays) =
@@ -228,6 +229,7 @@ module View = {
               : (action => inject(MainEditor(action))),
           ~selected=selected == Some(MainEditor),
           ~overlays=overlays(model.editor.editor),
+          ~lines,
           model.editor,
         ),
       ]

src/web/app/editors/code/CodeEditable.re

@@ -203,6 +203,7 @@ module View = {
         ~inject: Update.t => Ui_effect.t(unit),
         ~selected: bool,
         ~overlays: list(Node.t)=[],
+        ~lines: bool=false,
         model: Model.t,
       ) => {
     let edit_decos =
@@ -289,10 +290,14 @@ module View = {
       | _ => Effect.Ignore
       };
 
+    let display_line_numbers: bool = lines && globals.settings.line_numbers;
+
     Node.div(
       ~attrs=[
         Attr.classes(
-          ["cell-item", "code-editor"] @ (selected ? ["selected"] : []),
+          ["cell-item", "code-editor"]
+          @ (selected ? ["selected"] : [])
+          @ (display_line_numbers ? ["has-line-numbers"] : []),
         ),
         Attr.on_pointerdown(evt =>
           move_or_select(Pointer.Event.mk(evt), Pointer.Event.id_of(evt))
@@ -303,7 +308,14 @@ module View = {
         Attr.on_mousemove(evt => drag_select(Pointer.Event.mk(evt))),
         Attr.on_wheel(evt => drag_select(Pointer.Event.mk(evt))),
       ],
-      [code_view],
+      display_line_numbers
+        ? LineNumbers.View.view(
+            model,
+            globals.settings.relative_line_numbers,
+            selected,
+          )
+          @ [code_view]
+        : [code_view],
     );
   };
 };

src/web/app/editors/lines/LineNumbers.re

@@ -0,0 +1,109 @@
+open Haz3lcore;
+//open Virtual_dom.Vdom;
+open Util;
+open WebUtil;
+
+/*
+ Used to display line numbering alongside cells
+ */
+module Model = CodeWithStatics.Model;
+
+module View = {
+  let view = (model: Model.t, show_relative_numbers: bool, selected: bool) => {
+    let {editor: {syntax: {measured, _}, state: {zipper, _}, _}, _}: Model.t = model;
+    let num_rows = List.length(measured.piece_rows);
+    let empty_row = row => {
+      let result = List.nth_opt(List.rev(measured.piece_rows), row);
+      switch (result) {
+      | Some(value) =>
+        switch (value) {
+        | [] => true
+        | _ => false
+        }
+      | None => true // The row doesn't actually exist, hence it's empty
+      };
+    };
+    let Point.{row, _} = Zipper.Caret.point(measured, zipper);
+    let cursor_row_index = row;
+    /*
+     Recursively builds a list of line numbers for display, skipping empty rows.
+
+     Parameters:
+       - row_index: Current row being processed (0-indexed)
+       - line_count: The line number to assign to the current non-empty row
+
+     Returns: (line_numbers, cursor_line_number) where:
+       - line_numbers: List where 0 indicates skip this row, non-zero is the display line number
+       - cursor_line_number: The line number where the cursor is located (0 if not found yet)
+     */
+    let rec processed_line_numbers =
+            (row_index: int, line_count: int): (list(int), int) =>
+      if (row_index == num_rows) {
+        ([], 0);
+      } else {
+        let is_row_empty = empty_row(row_index);
+        let (returned_processed_list, returned_cursor_line_number) =
+          is_row_empty
+            ? processed_line_numbers(row_index + 1, line_count)
+            : processed_line_numbers(row_index + 1, line_count + 1);
+        let current_line_number = is_row_empty ? 0 : line_count;
+        let cursor_line_number =
+          if (returned_cursor_line_number == 0 && row_index == cursor_row_index) {
+            line_count;
+          } else {
+            returned_cursor_line_number;
+          };
+        (
+          [current_line_number] @ returned_processed_list,
+          cursor_line_number,
+        );
+      };
+    let (processed_list, cursor_line_number) = processed_line_numbers(0, 1);
+    /*
+     Converts a row index to its display text.
+     Returns "\n" for empty rows, or the line number (absolute or relative) with newline.
+     */
+    let index_to_text = (i): string => {
+      let line_number = List.nth(processed_list, i);
+      line_number == 0
+        ? "\n"  // if this is a line we want to skip
+        : {
+          (
+            if (show_relative_numbers && selected) {
+              string_of_int(
+                abs(line_number - cursor_line_number) == 0
+                  ? line_number : abs(line_number - cursor_line_number),
+              );
+            } else {
+              string_of_int(line_number);
+            }
+          )
+          ++ (i == num_rows ? "" : "\n"); // Add a line break if this is not the last row
+        };
+    };
+    let index_to_span = (i): Node.t => {
+      Node.span(
+        ~attrs=
+          i == row && selected ? [Attr.classes(["line-numbers-bold"])] : [],
+        [Text(index_to_text(i))],
+      );
+    };
+    [
+      Node.div(
+        ~attrs=[
+          Attr.classes([
+            "code",
+            "line-numbers",
+            selected ? "line-numbers-selected" : "",
+          ]),
+        ],
+        [
+          Node.span(
+            ~attrs=[Attr.classes(["code-text", "line-numbers-text"])],
+            List.init(num_rows, (i): Node.t => {index_to_span(i)}),
+          ),
+        ],
+      ),
+    ];
+  };
+};

src/web/view/ExerciseMode.re

@@ -650,6 +650,7 @@ module View = {
             )
           | _ => CellCommon.caption(caption, ~rest=?subcaption)
           },
+        ~lines=true,
         cell,
       );
     };

src/web/view/NutMenu.re

@@ -104,12 +104,17 @@ let stepper_group = (~globals: Globals.t) => {
   );
 };
 
-let dev_group = (~globals) => {
+let dev_group = (~globals: Globals.t) => {
   settings_group(
     ~globals,
     "Developer",
     [
-      ("✓", "Benchmarks", globals.settings.benchmark, Benchmark),
+      (
+        "✓",
+        "Benchmarks",
+        globals.settings.benchmark,
+        Benchmark: Settings.Update.t,
+      ),
       ("𝑒", "Elaboration", globals.settings.core.elaborate, Elaborate),
       ("↵", "Whitespace", globals.settings.secondary_icons, SecondaryIcons),
       (
@@ -118,10 +123,23 @@ let dev_group = (~globals) => {
         globals.settings.core.flip_animations,
         FlipAnimations,
       ),
-    ],
+      ("l", "Line Numbers", globals.settings.line_numbers, ToggleLineNumbers),
+    ]
+    @ (
+      globals.settings.line_numbers
+        ? [
+          (
+            "r",
+            "Relative Numbers",
+            globals.settings.relative_line_numbers,
+            ToggleRelativeLineNumbers,
+          ),
+        ]
+        : []
+    ),
   );
 };
-
+//("l", "Line Numbers", globals.settings.line_numbers, ToggleLineNumbers)
 let settings_menu = (~globals) => {
   [
     semantics_group(~globals),

src/web/view/ScratchMode.re

@@ -488,6 +488,7 @@ module View = {
           | _ => None
           },
         ~locked=false,
+        ~lines=true,
         List.nth(model.scratchpads, model.current) |> snd,
       ),
     ];

src/web/view/TutorialMode.re

@@ -447,6 +447,7 @@ module View = {
         ~inject=a => inject(Editor(this_pos, a)),
         ~result_kind,
         ~caption=CellCommon.caption(caption, ~rest=?subcaption),
+        ~lines=true,
         cell,
       );
     };

src/web/www/style/cell.css

@@ -15,8 +15,15 @@
 #main .code-editor {
   /* Only code in primary editor is selectable atm */
   cursor: text;
+  flex-direction: row;
+  padding-left: 1em;
+}
+
+#main .code-editor.has-line-numbers{
+  padding-left: 0;
 }
 
+
 #main.Scratch,
 #main.Documentation {
   background-color: var(--ui-bkg);