little re-arranging

.ocamlformat

@@ -1 +0,0 @@
-profile = compact

boot_js.ml

@@ -1,6 +1,14 @@
 open Js_of_ocaml
+open Lwt.Infix
 module NVG = Graphv_webgl
 
+let _ =
+  Logs.set_reporter (Human.Logs_reporter.console_reporter ());
+  Logs.set_level (Some Debug);
+  Logs.debug (fun m -> m "hello")
+
+module Log = (val Logs.src_log Logs.default : Logs.LOG)
+
 (* This scales the canvas to match the DPI of the window,
    it prevents blurriness when rendering to the canvas *)
 let scale_canvas (canvas : Dom_html.canvasElement Js.t) =
@@ -8,48 +16,55 @@ let scale_canvas (canvas : Dom_html.canvasElement Js.t) =
   let rect = canvas##getBoundingClientRect in
   let width = rect##.right -. rect##.left in
   let height = rect##.bottom -. rect##.top in
-  canvas##.width := width *. dpr |> int_of_float ;
-  canvas##.height := height *. dpr |> int_of_float ;
+  canvas##.width := width *. dpr |> int_of_float;
+  canvas##.height := height *. dpr |> int_of_float;
   let width =
-    Printf.sprintf "%dpx" (int_of_float width) |> Js.string in
+    Printf.sprintf "%dpx" (int_of_float width) |> Js.string
+  in
   let height =
-    Printf.sprintf "%dpx" (int_of_float height) |> Js.string in
-  canvas##.style##.width := width ;
+    Printf.sprintf "%dpx" (int_of_float height) |> Js.string
+  in
+  canvas##.style##.width := width;
   canvas##.style##.height := height
 
 let _ =
   let canvas =
-    Js.Unsafe.coerce (Dom_html.getElementById_exn "canvas") in
-  scale_canvas canvas ;
+    Js.Unsafe.coerce (Dom_html.getElementById_exn "canvas")
+  in
+  scale_canvas canvas;
   let webgl_ctx =
     (* Graphv requires a stencil buffer to work properly *)
     let attrs = WebGL.defaultContextAttributes in
-    attrs##.stencil := Js._true ;
+    attrs##.stencil := Js._true;
     match
       WebGL.getContextWithAttributes canvas attrs |> Js.Opt.to_option
     with
     | None ->
-        print_endline "Sorry your browser does not support WebGL" ;
+        print_endline "Sorry your browser does not support WebGL";
         raise Exit
-    | Some ctx -> ctx in
+    | Some ctx -> ctx
+  in
   let open NVG in
   let vg =
     create
       ~flags:CreateFlags.(antialias lor stencil_strokes)
-      webgl_ctx in
+      webgl_ctx
+  in
   (* File in this case is actually the CSS font name *)
-  Text.create vg ~name:"sans" ~file:"sans" |> ignore ;
-  webgl_ctx##clearColor 0.3 0.3 0.32 1. ;
-  let rec render (time : float) =
+  Text.create vg ~name:"sans" ~file:"sans" |> ignore;
+  webgl_ctx##clearColor 0.3 0.3 0.32 1.;
+
+  (*
+    let render ev =
     webgl_ctx##clear
-      ( webgl_ctx##._COLOR_BUFFER_BIT_
+      (webgl_ctx##._COLOR_BUFFER_BIT_
       lor webgl_ctx##._DEPTH_BUFFER_BIT_
-      lor webgl_ctx##._STENCIL_BUFFER_BIT_ ) ;
+      lor webgl_ctx##._STENCIL_BUFFER_BIT_);
     let device_ratio = Dom_html.window##.devicePixelRatio in
     begin_frame vg ~width:canvas##.width ~height:canvas##.height
-      ~device_ratio ;
-    Transform.scale vg ~x:device_ratio ~y:device_ratio ;
-    Human.Display.render vg canvas##.width canvas##.height ;
+      ~device_ratio;
+    Transform.scale vg ~x:device_ratio ~y:device_ratio;
+    ignore Human.Panel.Ui.(panel vg Gg.P2.o test ev);
     (*
     Path.begin_ vg ;
     Path.rect vg ~x:40. ~y:40. ~w:320. ~h:320. ;
@@ -62,8 +77,33 @@ let _ =
     Text.set_align vg ~align:Align.(center lor middle) ;
     set_fill_color vg ~color:Color.white ;
     Text.text vg ~x:0. ~y:0. "Hello World!" ; *)
-    NVG.end_frame vg ;
-    Dom_html.window##requestAnimationFrame (Js.wrap_callback render)
-    |> ignore in
-  Dom_html.window##requestAnimationFrame (Js.wrap_callback render)
-  |> ignore
+    NVG.end_frame vg
+  in
+  Dom_html.window##requestAnimationFrame
+    (Js.wrap_callback (fun _ -> render Human.Event.empty))
+  |> ignore;*)
+  let open Js_of_ocaml_lwt.Lwt_js_events in
+  async (fun () ->
+      buffered_loop (make_event Dom_html.Event.keydown)
+        Dom_html.document (fun ev _ ->
+          webgl_ctx##clear
+            (webgl_ctx##._COLOR_BUFFER_BIT_
+            lor webgl_ctx##._DEPTH_BUFFER_BIT_
+            lor webgl_ctx##._STENCIL_BUFFER_BIT_);
+          let device_ratio = Dom_html.window##.devicePixelRatio in
+          begin_frame vg ~width:canvas##.width ~height:canvas##.height
+            ~device_ratio;
+          Transform.scale vg ~x:device_ratio ~y:device_ratio;
+          Human.Panel.Ui.(
+            render_lwt vg Gg.P2.o
+              (Human.Event_js.evt_of_jskey `Press ev))
+          >>= fun p ->
+          Logs.debug (fun m ->
+              m "Drawing finished at point: %a" Gg.V2.pp p);
+          NVG.end_frame vg;
+          Lwt.return_unit))
+
+(* Dom_html.document##.onkeydown
+   := Dom.handler (fun (evt : Dom_html.keyboardEvent Js.t) ->
+          render (Human.Event_js.evt_of_jskey `Press evt) ;
+          Js._false ) *)

cors_proxy.sh

@@ -0,0 +1,7 @@
+#!/bin/bash
+if [ ! -f /tmp/key.pem ]; then
+  echo Creating key
+  openssl req -newkey rsa:2048 -new -nodes -x509 -days 3650 -keyout /tmp/key.pem -out /tmp/cert.pem -batch
+fi
+
+npx http-server --cors -S -P https://github.com --log-ip -c-1 -C /tmp/cert.pem -K /tmp/key.pem

dune

@@ -1,19 +1,31 @@
 (env
-  (dev
-   (flags (:standard -warn-error -A))))
+ (dev (flags (:standard -warn-error -A))
+  (js_of_ocaml (flags --no-inline --pretty --source-map-inline --debug-info)
+   (build_runtime_flags --no-inline --pretty --source-map-inline --debug-info)
+   (link_flags --source-map-inline))))
 
 (executable
  (name boot_js)
  (modes byte js)
- (preprocess (pps js_of_ocaml-ppx))
- (modules boot_js backend backend_js human)
+ (preprocess (pps js_of_ocaml-ppx)) 
+
+ (modules boot_js human)
  (libraries
+   fmt
+   logs
    graphv_webgl
-   js_of_ocaml
-   lwt
+   js_of_ocaml-lwt
+   digestif.ocaml
+   checkseum.ocaml
+   irmin.mem
+   git 
    irmin-git
-   irmin-indexeddb
+   cohttp-lwt-jsoo
+   mimic
+   uri
    zed
    gg
+   wall
+
 ))
 

dune-project

@@ -1,3 +1,2 @@
-(lang dune 2.8)
-(name komm)
-(wrapped_executables false)
+(lang dune 3.4)
+(name boot)

index.html

@@ -17,8 +17,8 @@ div {
 }
 
 canvas {
-    width: 400px;
-    height: 400px;
+    width: 100%;
+    height: 100%;
 }
     </style>
   </head>