Im new to p5js but decent in processing 3, so my apologies up front. I would like to have lets say 4 sketches in p5js available for users to swap between. Lets say for simplicity a 400x400 canvas and below the canvas 4 numbered buttons. What is the most robust way to swap between them? Can there be multiple draw functions in the main js file and the button calls the different draw functions? Would i make separate classes? Im sure this is a common thing but I havent found anything exactly like this yet. Thanks in advance!
It sounds like you are looking for instance mode. Don’t know if learning by video is your thing, but this one shows you the ropes. The video ends up with two sketches at once, then it’s trivial to scale that up to four.
Finally, there’s just the swapping functionality left to implement. That should be solvable by sprinkling a little CSS and/or JavaScript around.
Thanks a lot. Dan and the coding train is the main reason I know anything about processing, so thanks a million. I am going through the series 8 videos now to familiarize myself more and will check that one out next! I actually got to meet Dan briefly at Processing day in NY earlier this year!
Hey again, so I dont think that really solves what I am trying to do. I only want one canvas, but what I want is to swap out the content of the canvas with sketches I already have made, I dont want to have to rename every variable in each sketch, that seems crazy. Im basically trying to make a little VJ type webpage that the user can choose what sketch they want to see at any given time. Does that make sense?
I see, then maybe embedding sketches using iframes is closer to what you’re after? You’ll find instructions below the heading Embed a p5 sketch using an iframe on this page.
