open Canvas

let canvas = getElementById document "my_canvas"
let ctx = getContext canvas "2d"


let display () =
  (* draw the background *)
  fillStyle ctx "#dde";
  fillRect ctx 0 0 360 220;

  (* draw a rectangle *)
  fillStyle ctx "#88f";
  fillRect ctx 80 60 60 40;
  ()
;;


let update () =
  ()
;;

type key_change = KeyDown | KeyUp

let keychange_event key_change ev =
  match key_change, ev.Canvas.keyCode with
  | KeyDown, 37 -> ()  (* left *)
  | KeyDown, 39 -> ()  (* right *)
  | KeyDown, 38 -> ()  (* up *)
  | KeyDown, 40 -> ()  (* down *)

  | KeyUp, 37 -> ()  (* left *)
  | KeyUp, 39 -> ()  (* right *)
  | KeyUp, 38 -> ()  (* up *)
  | KeyUp, 40 -> ()  (* down *)

  | _ -> ()


let () =
  (* init *)

  let animate () =
    update ();
    display ();
    ()
  in

  Canvas.addKeyEventListener Canvas.window "keydown" (keychange_event KeyDown) true;
  Canvas.addKeyEventListener Canvas.window "keyup"   (keychange_event KeyUp) true;

  let _ = Canvas.setInterval animate (1000/20) in   (* 20 frames per seconds *)
  ()
;;