# p5.js

**URL:** https://discourse.processing.org/c/p5js/10.md?page=31

[Latest](https://discourse.processing.org/latest.md) · [Categories](https://discourse.processing.org/categories.md) · [Tags](https://discourse.processing.org/tags.md)

**Page:** 32

---

## [What is wrong with this simple code](https://discourse.processing.org/t/what-is-wrong-with-this-simple-code/34289)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 4\
**Last updated:** [December 26, 2021, 5:55pm UTC](https://discourse.processing.org/t/what-is-wrong-with-this-simple-code/34289 "2021-12-26T17:55:37Z")

</div>

When the ball goes to the down right corner it freezes. I tried everything. What is wrong with that code. let x = 50 let y = 50 let s1 = 1 let s2 = 1 function setup() { createCanvas(400, 400); } function draw() { b…

---

## [What is the best way to make a if statement that activates when a shape hits the outer part of another shape or as some people may call it the outline](https://discourse.processing.org/t/what-is-the-best-way-to-make-a-if-statement-that-activates-when-a-shape-hits-the-outer-part-of-another-shape-or-as-some-people-may-call-it-the-outline/34287)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 2\
**Last updated:** [December 25, 2021, 1:16pm UTC](https://discourse.processing.org/t/what-is-the-best-way-to-make-a-if-statement-that-activates-when-a-shape-hits-the-outer-part-of-another-shape-or-as-some-people-may-call-it-the-outline/34287 "2021-12-25T13:16:46Z")

</div>

Lets say you are making a game where if a moving circle hits a rect it bounces off . Now the hard thing for me is to make the ball to do something if it hits the outline of the shape cause I need to make if x \> x-width/2…

---

## [P5.js Soft body dynamics on text](https://discourse.processing.org/t/p5-js-soft-body-dynamics-on-text/34225)

<div class="topic-metadata">

**Author:** [@Didicw93](https://discourse.processing.org/u/Didicw93)\
**Replies:** 1\
**Last updated:** [December 24, 2021, 8:05am UTC](https://discourse.processing.org/t/p5-js-soft-body-dynamics-on-text/34225 "2021-12-24T08:05:44Z")

</div>

I’m trying to figure out how to apply the basic soft dynamic in the reference page of P5.js on to typography/text. at the moment i think that the only option is to draw the shapes of the letters via “beginShape()” any s…

---

## [Img.line() crash in Safari](https://discourse.processing.org/t/img-line-crash-in-safari/34251)

<div class="topic-metadata">

**Author:** [@roberthodgin](https://discourse.processing.org/u/roberthodgin)\
**Replies:** 1\
**Last updated:** [December 23, 2021, 8:31pm UTC](https://discourse.processing.org/t/img-line-crash-in-safari/34251 "2021-12-23T20:31:00Z")

</div>

Hello. I am working on a p5js piece and having good success. Everything works beautifully in Chrome on desktop and mobile. However, in Safari and on iPhone, the project crashes. I have narrowed it down to one line: bg.l…

---

## [Can you use eval() in p5js?](https://discourse.processing.org/t/can-you-use-eval-in-p5js/34183)

<div class="topic-metadata">

**Author:** [@MoonAlien822](https://discourse.processing.org/u/MoonAlien822)\
**Replies:** 9\
**Last updated:** [December 23, 2021, 8:24pm UTC](https://discourse.processing.org/t/can-you-use-eval-in-p5js/34183 "2021-12-23T20:24:05Z")

</div>

is the eval() function available for p5js?

---

## [Eval() not working](https://discourse.processing.org/t/eval-not-working/34248)

<div class="topic-metadata">

**Author:** [@MoonAlien822](https://discourse.processing.org/u/MoonAlien822)\
**Replies:** 1\
**Last updated:** [December 22, 2021, 3:46pm UTC](https://discourse.processing.org/t/eval-not-working/34248 "2021-12-22T15:46:51Z")

</div>

var x; var y; var z; var alpha; function setup() { createCanvas(600,600); x = "if(millis() % 1000 = 0){ eval(alpha);}"; y = "hello world"; z = "text(y, width/2, height/2);"; alpha = "background(rand…

---

## [Calling Method Properties Issue](https://discourse.processing.org/t/calling-method-properties-issue/34138)

<div class="topic-metadata">

**Author:** [@anoniem](https://discourse.processing.org/u/anoniem)\
**Replies:** 2\
**Last updated:** [December 20, 2021, 2:43pm UTC](https://discourse.processing.org/t/calling-method-properties-issue/34138 "2021-12-20T14:43:43Z")

</div>

Hi, I’m having problem with my OOP homework. So I’m basically working on a sheep that moves around, and is draggable. When those Sheeps intersect a new one should be made. I wrote down the code for this on line 101 an…

---

## [Paint an image with transparency on a quad via a fragment shader](https://discourse.processing.org/t/paint-an-image-with-transparency-on-a-quad-via-a-fragment-shader/34189)

<div class="topic-metadata">

**Author:** [@stewart](https://discourse.processing.org/u/stewart)\
**Replies:** 5\
**Last updated:** [December 20, 2021, 2:21am UTC](https://discourse.processing.org/t/paint-an-image-with-transparency-on-a-quad-via-a-fragment-shader/34189 "2021-12-20T02:21:12Z")

</div>

Hi I would appreciate help implementing this feature for an art project I’m working on. Functionally it would be similar to a p5.Image filter() but using my own fragment shader instead of the built in filters. So what I…

---

## [Where is the \`whileLoadingCallback\` for images?](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200)

<div class="topic-metadata">

**Author:** [@Errorbot1122](https://discourse.processing.org/u/Errorbot1122)\
**Replies:** 1\
**Last updated:** [December 20, 2021, 12:00am UTC](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200 "2021-12-20T00:00:04Z")

</div>

Where is the whileLoadingCallback for images? I know p5 has one for sound, but not images for some reason… Well, you know what, if you’re going to add on for images, what about adding them for tables or XML Files, etc.

---

## [Is there any way to upload a p5.js game to the galaxy store?](https://discourse.processing.org/t/is-there-any-way-to-upload-a-p5-js-game-to-the-galaxy-store/33799)

<div class="topic-metadata">

**Author:** [@MoonAlien822](https://discourse.processing.org/u/MoonAlien822)\
**Replies:** 1\
**Last updated:** [December 19, 2021, 3:13am UTC](https://discourse.processing.org/t/is-there-any-way-to-upload-a-p5-js-game-to-the-galaxy-store/33799 "2021-12-19T03:13:25Z")

</div>

I tried to figure out if you can upload a p5.js game to the galaxy store but I’m struggling to do it. I’m especially having trouble with this I have no idea what I have to but in here. well it’s probably the binary …

---

## [\[p5.js\] Web page source code security issues / How can I do 'p5 Encryption'?](https://discourse.processing.org/t/p5-js-web-page-source-code-security-issues-how-can-i-do-p5-encryption/34094)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 14\
**Last updated:** [December 19, 2021, 1:58am UTC](https://discourse.processing.org/t/p5-js-web-page-source-code-security-issues-how-can-i-do-p5-encryption/34094 "2021-12-19T01:58:27Z")

</div>

\[p5.js\] Web page source code security issues Hello. You can easily create web pages through ‘p5.js’. good. However, I am curious about one thing. Can’t you hide the code? If you press the ‘F12’ button after implementi…

---

## [\[p5.js\] How to use 'CryptoJS'](https://discourse.processing.org/t/p5-js-how-to-use-cryptojs/34185)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 0\
**Last updated:** [December 18, 2021, 2:51pm UTC](https://discourse.processing.org/t/p5-js-how-to-use-cryptojs/34185 "2021-12-18T14:51:56Z")

</div>

How to use ‘CryptoJS’ Add library \<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.2/rollups/aes.js"\>\</script\> Add code var encrypted = CryptoJS.AES.encrypt(myString, myPassword); var decrypted…

---

## [Saving canvas to a file](https://discourse.processing.org/t/saving-canvas-to-a-file/11027)

<div class="topic-metadata">

**Author:** [@astraszab](https://discourse.processing.org/u/astraszab)\
**Replies:** 4\
**Last updated:** [December 17, 2021, 1:36pm UTC](https://discourse.processing.org/t/saving-canvas-to-a-file/11027 "2021-12-17T13:36:03Z")

</div>

I need to save canvas to a file inside a server directory to process it later in another program. When I use saveCanvas() browser creates a prompt window. How can I save a file to a specified directory without a prompt w…

---

## [How do you create an instance of an object and reference it eg. to rotate an object at a later time?](https://discourse.processing.org/t/how-do-you-create-an-instance-of-an-object-and-reference-it-eg-to-rotate-an-object-at-a-later-time/34067)

<div class="topic-metadata">

**Author:** [@jmg007](https://discourse.processing.org/u/jmg007)\
**Replies:** 5\
**Last updated:** [December 17, 2021, 12:27pm UTC](https://discourse.processing.org/t/how-do-you-create-an-instance-of-an-object-and-reference-it-eg-to-rotate-an-object-at-a-later-time/34067 "2021-12-17T12:27:11Z")

</div>

Hi, I’ve loaded in a 3d model and I looked at the p5 docs for rotating the model and one of the functions is: function draw() { background(200); rotateX(frameCount \* 0.01); rotateY(frameCount \* 0.01); model(oct…

---

## [P5 js collision of classes ALL HELP WELCOME 🙏](https://discourse.processing.org/t/p5-js-collision-of-classes-all-help-welcome/34144)

<div class="topic-metadata">

**Author:** [@maximleyssens](https://discourse.processing.org/u/maximleyssens)\
**Replies:** 1\
**Last updated:** [December 16, 2021, 10:29pm UTC](https://discourse.processing.org/t/p5-js-collision-of-classes-all-help-welcome/34144 "2021-12-16T22:29:03Z")

</div>

i am trying to make the class whitecell eat the bloodscells can anyone help me with this I have tried everything but noting works I am obligated to use oop but if this Is to hard to do i will just use functions , all i r…

---

## [P5js Class issue](https://discourse.processing.org/t/p5js-class-issue/33869)

<div class="topic-metadata">

**Author:** [@anoniem](https://discourse.processing.org/u/anoniem)\
**Replies:** 14\
**Last updated:** [December 15, 2021, 11:29am UTC](https://discourse.processing.org/t/p5js-class-issue/33869 "2021-12-15T11:29:13Z")

</div>

I want to drag multiple squares around, that’s why I put it in a class. Also because the subject at school is OOP. Why exactly isn’t it working? It worked perfectly fine without using a class. Online editor: p5.js Web…

---

## [Collision problem I really need your help ... begging](https://discourse.processing.org/t/collision-problem-i-really-need-your-help-begging/34136)

<div class="topic-metadata">

**Author:** [@maximleyssens](https://discourse.processing.org/u/maximleyssens)\
**Replies:** 7\
**Last updated:** [December 16, 2021, 7:31am UTC](https://discourse.processing.org/t/collision-problem-i-really-need-your-help-begging/34136 "2021-12-16T07:31:11Z")

</div>

hey i am really struggeling with this collision issue I want to make the white cell eat the bloodcell when they collide can u please help me let MAX\_NUM = 50; let circles = \[\]; class Circle { constructor(x, y, ) …

---

## [How to make a wait statement in p5js (if its even possible)](https://discourse.processing.org/t/how-to-make-a-wait-statement-in-p5js-if-its-even-possible/34134)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 1\
**Last updated:** [December 16, 2021, 12:38am UTC](https://discourse.processing.org/t/how-to-make-a-wait-statement-in-p5js-if-its-even-possible/34134 "2021-12-16T00:38:43Z")

</div>

I am working on a code that will be a lot easier if I knew how to make a wait statement. If you know please leave a quick reply.

---

## [\['p5.js' project\] Making web visible on smartphone](https://discourse.processing.org/t/p5-js-project-making-web-visible-on-smartphone/34125)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 0\
**Last updated:** [December 15, 2021, 12:52am UTC](https://discourse.processing.org/t/p5-js-project-making-web-visible-on-smartphone/34125 "2021-12-15T00:52:40Z")

</div>

\[‘p5.js’ project\] Making web visible on smartphone @KumuPaul @GoToLoop @javagar thank you. Thanks to you, I made it simple with a test version. I made ‘WEB’ for the first time, and it was difficult, but…

---

## [Collision in p5 js](https://discourse.processing.org/t/collision-in-p5-js/34120)

<div class="topic-metadata">

**Author:** [@maximleyssens](https://discourse.processing.org/u/maximleyssens)\
**Replies:** 0\
**Last updated:** [December 14, 2021, 8:56pm UTC](https://discourse.processing.org/t/collision-in-p5-js/34120 "2021-12-14T20:56:35Z")

</div>

hey, i have a school project where I need to let creatures interact with each other this is done by collision I already have made a big part but now I wanted to make that u can eat the red circles by moving on them with…

---

## [Failing to "resizeCanvas" in instance mode within a for loop](https://discourse.processing.org/t/failing-to-resizecanvas-in-instance-mode-within-a-for-loop/34119)

<div class="topic-metadata">

**Author:** [@Sofie](https://discourse.processing.org/u/Sofie)\
**Replies:** 1\
**Last updated:** [December 14, 2021, 8:04pm UTC](https://discourse.processing.org/t/failing-to-resizecanvas-in-instance-mode-within-a-for-loop/34119 "2021-12-14T20:04:07Z")

</div>

i try to create a sketch with p5s dom lib. I managed to create all my p5 Canvas Elements (grey tones)in a for loop and linking them to the matching divs(brown). When i try to resize the window, all sketches just disappea…

---

## [Help needed creating simple p5.js library](https://discourse.processing.org/t/help-needed-creating-simple-p5-js-library/34045)

<div class="topic-metadata">

**Author:** [@scottc19](https://discourse.processing.org/u/scottc19)\
**Replies:** 0\
**Last updated:** [December 11, 2021, 12:00am UTC](https://discourse.processing.org/t/help-needed-creating-simple-p5-js-library/34045 "2021-12-11T00:00:45Z")

</div>

Quick background I am using p5.js in instance mode (long story why I have to use instance mode, so just pretend its required) and I want to write a simple library that contains stuff that I do in all my sketches, for exa…

---

## [I need a quick explanation how this works cause i don't get it](https://discourse.processing.org/t/i-need-a-quick-explanation-how-this-works-cause-i-dont-get-it/34096)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 3\
**Last updated:** [December 13, 2021, 2:54pm UTC](https://discourse.processing.org/t/i-need-a-quick-explanation-how-this-works-cause-i-dont-get-it/34096 "2021-12-13T14:54:07Z")

</div>

let x let y let s1 let s2 function setup() { createCanvas(400, 400); frameRate(60) x = 50 y = 50 s1 = 1 s2 = 1 } function draw() { background('black'); ellipse(x,y,100) x += s1 y += s2 if (y \> 350 && x \> 350){ s2 \*= -1 …

---

## [\[p5.js\] Is it possible to edit the 'initial-scale' of 'meta\[name=viewport\]'?](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 8\
**Last updated:** [December 13, 2021, 9:16am UTC](https://discourse.processing.org/t/p5-js-is-it-possible-to-edit-the-initial-scale-of-meta-name-viewport/34087 "2021-12-13T09:16:29Z")

</div>

Is it possible to edit the ‘initial-scale’ of ‘meta\[name=viewport\]’? through ‘js’ \*link: html - Change initial scale with javascript - Stack Overflow if (document.documentElement.clientWidth \< 480) { document.q…

---

## [\[p5.js\] Split operation does not work with text obtained by loadStrings](https://discourse.processing.org/t/p5-js-split-operation-does-not-work-with-text-obtained-by-loadstrings/34056)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 9\
**Last updated:** [December 13, 2021, 5:24am UTC](https://discourse.processing.org/t/p5-js-split-operation-does-not-work-with-text-obtained-by-loadstrings/34056 "2021-12-13T05:24:51Z")

</div>

\[P5.JS\] var value1; var value2; function setup() { createCanvas(450, 150); background(220); textSize(12); let url = " SITE IP ADDRESS /split\_test/user\_check.php?"; value1 = loadStrings(url)…

---

## [Trying to make a multidimensional array which can connect to my buttons Please Help as soon as possible Please](https://discourse.processing.org/t/trying-to-make-a-multidimensional-array-which-can-connect-to-my-buttons-please-help-as-soon-as-possible-please/34047)

<div class="topic-metadata">

**Author:** [@tkenyon](https://discourse.processing.org/u/tkenyon)\
**Replies:** 1\
**Last updated:** [December 11, 2021, 8:34am UTC](https://discourse.processing.org/t/trying-to-make-a-multidimensional-array-which-can-connect-to-my-buttons-please-help-as-soon-as-possible-please/34047 "2021-12-11T08:34:08Z")

</div>

please format code with \</\> button \* homework policy \* asking questions I am trying to make a multidimensional array, storing my array of images on one and states on the left side and storing the images on the right s…

---

## [Storing a one snapshot of value within a draw loop?](https://discourse.processing.org/t/storing-a-one-snapshot-of-value-within-a-draw-loop/33510)

<div class="topic-metadata">

**Author:** [@basicvisual](https://discourse.processing.org/u/basicvisual)\
**Replies:** 12\
**Last updated:** [December 11, 2021, 10:28pm UTC](https://discourse.processing.org/t/storing-a-one-snapshot-of-value-within-a-draw-loop/33510 "2021-12-11T22:28:12Z")

</div>

Hi I am exploring Ml5js posenet model to get the 2D keypoints. I am using these keypoints to calculate the angle around a joint area , for example shoulder joint. I am looking for a way to store the x and y co .ordinate…

---

## [Merging 2 sketches into 1](https://discourse.processing.org/t/merging-2-sketches-into-1/34051)

<div class="topic-metadata">

**Author:** [@medikid](https://discourse.processing.org/u/medikid)\
**Replies:** 2\
**Last updated:** [December 11, 2021, 3:17pm UTC](https://discourse.processing.org/t/merging-2-sketches-into-1/34051 "2021-12-11T15:17:44Z")

</div>

please format code with \</\> button \* homework policy \* asking questions hi, i have two sketches let scale = 0.004; function setup() { createCanvas(1200, 1200); smooth() } function draw() { for(let x = 100;…

---

## [8 bezier parameters to 12 bezier parameters in 3d](https://discourse.processing.org/t/8-bezier-parameters-to-12-bezier-parameters-in-3d/33595)

<div class="topic-metadata">

**Author:** [@medikid](https://discourse.processing.org/u/medikid)\
**Replies:** 7\
**Last updated:** [December 11, 2021, 3:10pm UTC](https://discourse.processing.org/t/8-bezier-parameters-to-12-bezier-parameters-in-3d/33595 "2021-12-11T15:10:39Z")

</div>

please format code with \</\> button \* homework policy \* asking questions hi, i have old piece of code which i somehow transported to newest processing. it makes piles of bezier curves, circles in this case. from th…

---

## [Please help asap for homework](https://discourse.processing.org/t/please-help-asap-for-homework/34035)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 2\
**Last updated:** [December 11, 2021, 2:26am UTC](https://discourse.processing.org/t/please-help-asap-for-homework/34035 "2021-12-11T02:26:44Z")

</div>

I have a homework till today 12 i need to make a circle change shape when it hits the wall and a circle that bounces of walls

[Previous page](https://discourse.processing.org/c/p5js/10.md?page=30)

[Next page](https://discourse.processing.org/c/p5js/10.md?page=32)