Instance Mode - calling other sketches

p5.js Coding Questions
#1

Hello,
I wanted to know if this is possible. I want to be able to call others sketches back and forth. For instance for simplicity I created 2 sketches when i click on Sketch2 it will show that sketch now in this sketch I have button to show sketch1 but that is not working. I get this message TypeError: fxn is undefined[Show stack]

My goal is to create a mini game type of scenario where the player can choose or I can choose randomly different games the player can play and in these mini games be able to go back to the main screen and select another minigame. Can I do this in openprocessing.org?
here is the code
https://www.openprocessing.org/sketch/860688

1 Like
#2

Even though I use & like that Processing sketch hosting site very much, for more complex sketches, I’d rather choose other hosting options w/ more code flexibility. :face_with_hand_over_mouth:

There are many approaches we can go with for multi-pick sketch. :motorway:

But b/c all the sketches you intend to run are using “instance mode”, that makes things much easier. :grin:

So I’ve come up with an example which uses createRadio() to pick the activeSketch from among those stored in sketches[]: :radio_button:
https://p5js.org/reference/#/p5/createRadio

Every time the current option() is changed(), it calls back runPickedSketch(); which in turn calls destroyMe() for the activeSketch, then calls createMe() using the index - 1 from method value(). :nerd_face:

You can see it running online at this JS hosting site below: :running_man:

And also edit it here: Glitch :･ﾟ✧
Fullscreen presentation: radio-pick-active-sketch.Glitch.me

P.S.: Due to a bug in methods option() & value(), I had to store sketches[]'s indices starting at 1, b/c those methods can’t store the value 0! :bug:

1 Like
#3

Thank you for the thorough explanation. Unfortunately since the course I’m taking requires me to use this website my options are limited.

#4

It does work on OpenProcessing too: :partying_face:

However, b/c we can’t control the order the multi-tabs are loaded there, the global variable sketches[] defined within the main tab may not exist yet when the other tabs happen to be run 1st. :grimacing:

As a workaround, we can have this statement on each tab: :toolbox:
var sketches = window.sketches || [];

It makes sure to create an Array and assign it to sketches[] if 1 isn’t already present in it. :bulb:

1 Like