Given p5js isn’t a JS module, but instead it is distributed as a normal JS file, I don’t think we can use the JS keyword import
for it.
If you make a class
that needs to request a specific object reference many times, it’s much simpler to request that from its constructor and store it as 1 of its properties.
In the sketch link below, the class
Ball asks for a p5 object as its constructor’s parameter; then stores it as property p :
.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
.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
1 Like