trying to sequence effects in purescript-flare

nonrandom.purs

width :: Number
width = 600.0

height :: Number
height = 600.0

-- Generate a Drawing of n deterministic points
nonRandomPoints :: Int -> Drawing
nonRandomPoints n = foldMap makeCircle points
  where
    makeCircle p = filled (fillColor black) $ circle p.x p.y 10.0
    n' = toNumber n
    points = map (\i -> { x : width * (toNumber i) / n', y : height * (toNumber i) / n'}) (1..n)

main = do
  runFlareDrawing "controls" "canvas" points
  where
    points = nonRandomPoints <$> intRange "numPoints" 1 100 10

random.purs

-- Generate a random point
randomPoint :: forall eff. Eff (random :: RANDOM | eff) Point
randomPoint = do
  x <- randomRange 0.0 width
  y <- randomRange 0.0 height
  return { x: x, y: y}

-- Generate a drawing consisting of n random points
randomPoints :: forall eff. Int -> Eff (random :: RANDOM | eff) Drawing
randomPoints n = (foldMap makeCircle) <$> points
  where
    makeCircle p = filled (fillColor black) $ circle p.x p.y 10.0
    points = replicateM n randomPoint

-- this doesn't work, I need to somehow combine the `Eff RANDOM` and the `UI`
main = do
  runFlareDrawing "controls" "canvas" points
  where
    points = randomPoints <$> intRange "numPoints" 1 100 10