How to use classes in instance mode?

GoToLoop · March 19, 2020, 5:48pm

We can put extra sketches in their own <iframe> tag, regardless if they’re global or instance mode.

Some example sketch using both modes + class:

gist.github.com

https://gist.github.com/GoSubRoutine/60b154e52336f7fee7c5f1fe817ceb22

.block

height: 650
scrolling: no
border: yes
license: cc-by-4.0

adjustFrameSize.js

'use strict';

p5.prototype.adjustFrameSize = function () {
  if (frameElement) {
    frameElement.height = frameElement.frameBorder = 0;
    frameElement.height = this.getDocHeight() + 'px';
    frameElement.width  = this.getDocWidth()  + 'px';
  }
};

This file has been truncated. show original

all.html

<script defer src=https://cdn.JsDelivr.net/npm/p5></script>

<script defer src=adjustFrameSize.js></script>
<script defer src=ball.js></script>

<script defer src=global.js></script>
<iframe src=global.html></iframe>

<script defer src=instance.js></script>
<script defer src=instance.js></script>

There are more than three files. show original

Same sketch but also using a 3rd-party library + import & export:

Glitch :･ﾟ✧

Topic		Replies	Views
How to adapt a library for Instance Mode (P5JS) Development	7	1850	June 3, 2019
Combining classes and instance mode in p5js? Coding Questions	1	288	July 17, 2022
Help understanding Instance mode vs "normal mode" Beginners	3	499	April 11, 2021
Instance mode creating two canvas Coding Questions	8	3231	October 7, 2019
How do you combine canvases in p5j weather you overlap or organise them Coding Questions	8	1555	April 20, 2019

How to use classes in instance mode?

Related topics