How to use canvas with Concur

Help
#1

Is there a simple example on how to use canvas with concur that I could look into?

I have managed to insert the canvas element into the DOM, but I fail to see how to arrange code in order to get its reference and paint into it.
I am trying to write a widget that would generate some dynamic SVG with some mixed-in canvas (also with dynamic content). I have managed to set the SVG part, but I am struggling with the canvas.

Thanks for any pointer.

2 Likes
#2

Are you asking for a Concur-like model for canvas rendering as well? That’s certainly possible, it would basically be a new backend for Concur.

Since with Canvas, everything gets rendered onto a shared space, I think something really simple might work. For example the view could just be “painters” that overwrite each other -

— A Painter (i.e. view) is basically a render function for this part of the UI
type Painter = { paint :: Context2D -> Effect Unit }

Instance monoidPainter :: Monoid Painter where
  mempty = { paint: \_ -> pure unit }

instance semigroupPainter :: Semigroup Painter where
  append a b = {paint: \c -> a.paint c *> b.paint c}

Then a widget that emits views of this kind would have the type Widget Painter a.

No VDOM required :slight_smile:

3 Likes
#3

Thanks @ajnsit; the idea of having “painters” is very interesting.

I will try to check how far I can go with the canvas backend idea, but I already fear that I will probably need some further along the way. :smiley:

THANKS!