wip

src/app/learnocaml_common.ml

@@ -282,12 +282,12 @@ let button ~container ~theme ?shortcut ?group ?state ~icon lbl cb =
     match group with
     | None -> button_group ()
     | Some group -> group in
-  let lbl = match shortcut with
+  let tooltip = match shortcut with
     | None -> lbl
     | Some s -> Printf.sprintf "%s %s" lbl (string_of_shortcut s) in
   let button =
-    H.(button [
-        img ~alt:"" ~src:("/icons/icon_" ^ icon ^ "_" ^ theme ^ ".svg") () ;
+    H.(button ~a:[ a_title tooltip ] [
+        img ~alt:" " ~src:("/icons/icon_" ^ icon ^ "_" ^ theme ^ ".svg") () ;
         txt " " ;
         span ~a:[ a_class [ "label" ] ] [ txt lbl ]
       ]) in
@@ -305,6 +305,7 @@ let button ~container ~theme ?shortcut ?group ?state ~icon lbl cb =
         | CM c -> true, true, c
       in
       let js_char = Js.string (String.make 1 char) in
+      ignore @@
       Dom_html.addEventListener Dom_html.document Dom_html.Event.keydown
         (Dom_html.handler @@ fun e ->
          if Js.to_bool e##.ctrlKey = ctrl &&

src/app/tryocaml.ml

@@ -132,6 +132,7 @@ let () =
   (* ---- launch everything --------------------------------------------- *)
   let toplevel_buttons_group = button_group () in
   disable_button_group toplevel_buttons_group (* enabled after init *) ;
+  let toplevel_pane = find_component "learnocaml-exo-toplevel-pane" in
   let toplevel_toolbar = find_component "learnocaml-exo-toplevel-toolbar" in
   let editor_toolbar = find_component "learnocaml-exo-editor-toolbar" in
   let toplevel_button = button ~container:toplevel_toolbar ~theme:"dark" in
@@ -172,18 +173,21 @@ let () =
       ~after_init ~timeout_prompt ~flood_prompt
       ~on_disable_input: (fun _ -> disable_button_group toplevel_buttons_group)
       ~on_enable_input: (fun _ -> enable_button_group toplevel_buttons_group)
-      ~container:(find_component "learnocaml-exo-toplevel-pane")
+      ~container:toplevel_pane
       ~history () in
   log "init_tabs";
   let () =
     Manip.Ev.onclick (find_component Ids.editor_switch)
       (fun _ -> select_tab Ids.editor_pane; true);
-    Manip.Ev.onclick (find_component Ids.toplevel_switch)
-      (fun _ -> select_tab Ids.toplevel_pane; true);
   in
   log "toplevel launch";
   toplevel_launch >>= fun top ->
-  let solution =
+    Manip.Ev.onclick (find_component Ids.toplevel_switch)
+      (fun _ ->
+         select_tab Ids.toplevel_pane;
+         Learnocaml_toplevel.input_focus top;
+         true);
+    let solution =
     match Learnocaml_local_storage.(retrieve (exercise_state id)) with
     | { Answer.solution ; _ } -> Some solution
     | exception Not_found -> None in
@@ -262,8 +266,18 @@ let () =
         in
         Learnocaml_toplevel.reset top >>= fun () ->
           aux (Ocaml_mode.get_phrases_range (Ace.document ace))
-        >>= fun _ -> (* select_tab Ids.toplevel_pane; *) Lwt.return_unit
-        end ;
+        >>= fun _ ->
+        if Manip.Attr.offsetParent toplevel_pane = None then
+          (* A hack to determine if the element is displayed or not *)
+          (let () = Firebug.console##log "AA" in
+           select_tab Ids.toplevel_pane;
+           Learnocaml_toplevel.input_focus top)
+        else
+          (let () = Firebug.console##log "BB" in
+           select_tab Ids.editor_pane);
+        Lwt.return_unit
+  end ;
+  (* Manip.Ev.onfocus (find_component Ids.editor_pane) (fun _ -> Ace.focus ace; true); *)
   Window.onunload (fun _ev -> local_save ace id; true);
   (* ---- return -------------------------------------------------------- *)
   log "RUN";

src/toplevel/learnocaml_toplevel.ml

@@ -101,11 +101,10 @@ let start_timeout top _name timeout =
       top.current_timeout_prompt <- top.timeout_prompt top ;
       top.current_timeout_prompt
 
-let input_focus top f =
-  f () >>= fun r -> Learnocaml_toplevel_input.focus top.input; Lwt.return r
+let input_focus top =
+  Learnocaml_toplevel_input.focus top.input
 
 let reset_with_timeout top ?timeout () =
-  input_focus top @@ fun () ->
   match top.status with
   | `Reset (t, _) -> t
   | `Idle ->
@@ -136,7 +135,6 @@ let reset top =
   reset_with_timeout top ~timeout ()
 
 let protect_execution top exec =
-  input_focus top @@ fun () ->
   wait_for_prompts top >>= fun () ->
   match top.status with
   | `Reset _ | `Execute _ ->
@@ -175,7 +173,6 @@ let protect_execution top exec =
       thread
 
 let execute_phrase top ?range ?timeout content =
-  input_focus top @@ fun () ->
   let phrase = Learnocaml_toplevel_output.phrase () in
   let pp_code = Learnocaml_toplevel_output.output_code ~phrase top.output in
   let pp_answer = Learnocaml_toplevel_output.output_answer ~phrase top.output in

src/toplevel/learnocaml_toplevel.mli

@@ -167,3 +167,6 @@ val go_backward: t -> unit
 (** Go forward in the input's history.
     This is equivalent to pressing [Down] when the toplevel is focused. *)
 val go_forward: t -> unit
+
+(** Focus the HTML input field *)
+val input_focus: t -> unit

src/utils/js_utils.ml

@@ -150,6 +150,9 @@ module Manip = struct
     Js.to_bool
       elt##.classList##(toggle (Js.string s))
 
+  let querySelector elt s =
+    let elt = get_elt "querySelector" elt in
+    Js.Opt.to_option (elt##querySelector(Js.string s))
 
   let raw_appendChild ?before node elt2 =
     match before with
@@ -468,6 +471,9 @@ module Manip = struct
     let offsetHeight elt =
       let elt = get_elt "Attr.offsetHeight" elt in
       elt##.offsetHeight
+    let offsetParent elt =
+      let elt = get_elt "Attr.offsetParent" elt in
+      Js.Opt.to_option elt##.offsetParent
     let clientLeft elt =
       let elt = get_elt "Attr.clientLeft" elt in
       elt##.clientLeft

src/utils/js_utils.mli

@@ -51,6 +51,8 @@ module Manip : sig
   val setInnerText: 'a elt -> string -> unit
   val clone: ?deep:bool -> 'a elt -> 'a elt
 
+  val querySelector: 'a elt -> string -> Dom_html.element Js.t option
+
   val appendChild: ?before:'a elt -> 'b elt ->  'c elt -> unit
   val appendToHead: ?before:'a elt -> 'c elt -> unit
   val appendToBody: ?before:'a elt -> 'c elt -> unit
@@ -123,6 +125,7 @@ module Manip : sig
     val clientHeight: 'a elt -> int
     val offsetWidth: 'a elt -> int
     val offsetHeight: 'a elt -> int
+    val offsetParent: 'a elt -> Dom_html.element Js.t option
     val clientLeft: 'a elt -> int
     val clientTop: 'a elt -> int
   end