Skip to content

Updating all the broken refrence examples. #7739

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 26 commits into
base: dev-2.0
Choose a base branch
from

Conversation

perminder-17
Copy link
Contributor

No description provided.

@ksen0
Copy link
Member

ksen0 commented Apr 18, 2025

Hi @perminder-17 , thanks for working on this! A couple more things - some of these may not be in documentation scope, so please comment here if you end up working on this and find these can't be fixed in documentation itself:

  • Temporary fix on 2.0 reference assets URLs p5.js-website#813 these 2 URLs have a leading slash, should not in the documentation
  • Additional issues
    • src/dom/p5.MediaElement.js contains describe('The text "https://p5js.org/reference//assets/beat.mp3" written in black on a gray background.'); - also doesn't work on the main site, would be great to figure out why - bad URL? file somewhere else?
    • Many files in p5.sound examples are not working, I haven't investigated so may be unrelated issue but if it's a simple change of URL in example code, then it could be part of this perhaps?

@perminder-17
Copy link
Contributor Author

Hi kit,

some of these may not be in documentation scope, so please comment here if you end up working on this and find these can't be fixed in documentation itself:

Yes, sure. I have been looking for couple of things which can't be fixed through just changing the docs. Some additional works may be involved. I'll write it up here and open up an issue for that as well.

2 URLs have a leading slash, should not in the documentation

Yes, I think there could be more, I'll have a look.

Many files in p5.sound examples are not working, I haven't investigated so may be unrelated issue but if it's a simple change of URL in example code, then it could be part of this perhaps?

Yep, I just noticed that now. Really thanks for catching this. I'll have a look and will update this PR if its not pointing to a bigger issue.

Thanks for the updates :)

@perminder-17
Copy link
Contributor Author

Yep, I just noticed that now. Really thanks for catching this. I'll have a look and will update this PR if its not pointing to a bigger issue.

Hi @ksen0 ,
Actually I was trying to figure out why p5.Sound documentation is not working. I haven't gone too deep into looking on it but some things which i noticed and found odd were :-

Actually we get the documentation of the sound reference by cloning this repo : https://github.com/processing/p5.sound.js into the website and then it builds the jsDocs for this.

https://github.com/processing/p5.js-website/blob/9513801a6f4e6af90fbea6ff276ff45ce634f8aa/src/scripts/parsers/reference.ts#L59-L62

And, the older sound library of p5 has been closed/deprecated. https://github.com/processing/p5.js-sound.git

But now also, we are using the older build in our p5.js addons library in actual dev-2.0 branch. https://github.com/processing/p5.js/blob/dev-2.0/lib/addons/p5.sound.js

One solution might be is, removing the older library from lib/addons and updating the new version of p5.js sound new sound library and include all the functions which were present on the older sound library and not present on the new one's. This will update the website with the docs. .

Also, if we have any other approach for showing up the docs which currently uses the older-version lib/addons of sound library, I am happy to implement :")

Screenshot from 2025-04-18 19-02-03

For context, these are the docs which aren't shown when we build dev-2.0 branch, and these actually comes from the older version of sound library.

@perminder-17
Copy link
Contributor Author

Also tagging @davepagurek if this approach doesn't makes sense and needs to update the build of older-version of sound library?

@ksen0
Copy link
Member

ksen0 commented Apr 18, 2025

Hi @perminder-17 ! Just a quick note about the intent with sound: the 1.x reference on p5js.org should contain only the old sound library; and the 2.0 reference on beta.p5js.org should contain only the new one. Here's where that split was introduced: processing/p5.js-website#737 so things like PolySynth should be on 1.x site bot not on 2.0. I now see that examples not needing assets (https://beta.p5js.org/reference/p5.envelope/triggerattack/) also don't work. Anyway that's just a quick note, I will go through your notes and respond in more detail next week!

@perminder-17 perminder-17 marked this pull request as ready for review April 19, 2025 19:27
* <a href="#/p5/draw">draw()</a> begins looping. If the
* <a href="#/p5/preload">preload()</a> is declared, then `setup()` will
* run immediately after <a href="#/p5/preload">preload()</a> finishes
* <a href="#/p5/draw">draw()</a> begins looping. When `setup()` is declared async,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about a slightly more precise description:

"When setup() uses the async keyword (like this: async function setup() instead of function setup())...."

* <a href="#/p5/preload">preload()</a> is declared, then `setup()` will
* run immediately after <a href="#/p5/preload">preload()</a> finishes
* <a href="#/p5/draw">draw()</a> begins looping. When `setup()` is declared async,
* execution pauses at each `await` until the promise resolves, ensuring all assets
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Similarly, providing a bit of explanation on promise:

"execution pauses at each await: for example, font = await loadFont(...) will wait for the font asset to load. This is because the loadFont(..) function returns a promise, and the await keyword means the program will wait for the promise to resolve."

Feel free to rephrase of course.

@@ -596,7 +596,7 @@ function dom(p5, fn){
* 'https://p5js.org/assets/img/asterisk-01.png',
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Broken URL; maybe grab an image from another part of the reference that works? eg from https://beta.p5js.org/reference/p5/image/?

* box(200, 200, 200);
* describe(`red horizontal line right, green vertical line bottom.
* black background.`);
* background(220);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, thank you for the expanded example 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants