gadgetobrr/examples/slider.ml

(* This add a slidder to into <main>
   moving the slider print its value to the console *)
open Brr
open Slippery_slidy

let append_el_to_main el =
  let main =
    match El.find_first_by_selector (Jstr.v "main") with
    | Some main -> main
    | None -> failwith "append_el_to_main: main element not found"
  in
  El.append_children main [ el ];
  ()

let () =
  let datalist =
    mk_datalist
      (List.map Jstr.of_float [ 2.; 3.; 5.; 8.; 13. ])
      "my-slider-datalist"
  in
  let slider =
    mk_slider ~min:0. ~max:100. ~step:Any ~value:50. ~id:"my-slider"
      ~label:"Important slider, slide carefully"
      ~datalist_id:(Some datalist.datalist_id)
  in
  append_el_to_main (el slider);
  (* don't forget to add datalist to document too! *)
  append_el_to_main datalist.datalist_el;

  (* add listener on slider change *)
  add_input_listener slider (fun x -> Printf.printf "slider value: %f !!@." x);
  mk_dragable slider;
  ()