Skip to content

Creating and rendering into a canvas #39

Open
@justinlovinger

Description

@justinlovinger

I'm trying to create a canvas element containing an animation, but I'm not sure how to compose the canvas itself with the render Effect.

With React, you can use a componentDidMount callback to render on a canvas, when the canvas is created in the dom. However, I don't see anything like onComponentDidMount.

Currently, my solution looks like

canvasId ← liftEffect random
myCanvas ← canvas [ _id $ show canvasId, onClick ] []
_ ← liftEffect $ runCanvas canvasId
canvas [ _id $ show canvasId] []

This solution is not ideal for a few reasons. The onClick is just a placeholder to get the runCanvas effect to run, and ending with a second canvas feels like a hack.

I have also considered starting an asyncronous effect with a wait loop, before calling the first canvas, but then I have an unnecessary wait loop and might leave orphan scripts.

I'm not sure how to bundle a canvas element with it's corresponding render effect, without resorting to a workaround.

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions