Skip to content

Instantly share code, notes, and snippets.

@dmitryshelomanov
Created February 8, 2019 22:13
Show Gist options
  • Save dmitryshelomanov/5daf77088a33273575b4eeaafa1f033e to your computer and use it in GitHub Desktop.
Save dmitryshelomanov/5daf77088a33273575b4eeaafa1f033e to your computer and use it in GitHub Desktop.
open Webapi.Dom;
open Webapi.Canvas.Canvas2d;
open Webapi.Canvas.CanvasElement;
type position = (float, float);
type shape('s, 'a) = {
state: 's,
reducer: ('a, 's) => 's,
render: (shape('s, 'a)) => unit
};
let getPositionByCenterOfMass = (~r: float, pos: position): position => {
let (x, y) = pos;
(x +. r, y +. r);
};
type state = {
position,
radius: float,
};
type action =
| Move(position);
let makeShape = (~pos, ~r, ctx: t) => {
state: {
position: pos,
radius: r,
},
reducer: (action, state) =>
switch (action) {
| Move(position) => ({ ...state, position })
},
render: (self) => {
let (x, y) = getPositionByCenterOfMass(~r=self.state.radius, self.state.position);
beginPath(ctx);
arc(
~x,
~y,
~r=self.state.radius,
~startAngle=0.0,
~endAngle=Js.Math._PI *. 2.0,
~anticw=false,
ctx,
);
fill(ctx);
}
};
let main = () => {
let canvas =
switch (Document.getElementById("app", document)) {
| Some(element) => element
| None => failwith("canvas not found")
};
let ctx = getContext2d(canvas);
let player = makeShape(~pos=(0.0, 0.0), ~r=10.0, ctx);
player.render(player);
};
main();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment