Some pages have a more nested file path than others (i.e. examples) which makes it difficult to have the non-default language as simply another folder because the links on the sidebar would have to be different on the english site vs the spanish (or other languages) site.

Currently, I think the best solution is to create a completely new domain with either a specific extension or a subdomain to represent the site in another language, so the sidebar partial stays the same for all languages.

I must figure out how exactly this should be implemented if this is how we decide to structure the site. Also, I am open to other suggestions/feedback on the issue if anyone has any!

for example: http://p5js.org/examples/mobile-simple-draw.html

processing/p5.js#1852

In reference, whenever we click on the edit button of some example. Run and reset buttons are vanishing and this is happening only when there is a grammarly extension on the browser.

Do anyone know why this is happening?

See the gif.

• look at example page build scripts, can it be integrated with current grunt process?
• once this is done, translation

Examples (first two columns) not working on Chrome / Safari on OSX.
Error: Uncaught TypeError: a.indexOf is not a function
at r.fn.init.r.fn.load (jquery-3.2.0.min.js:4)
at Object.init (examples.js:36)
at examples.js:174

Hi,

On the examples page it seems that there's a typo in the link for the Noise1D example. It's pointing at: https://p5js.org/examples/math--noise1d.html which is a 404;

https://p5js.org/examples/math-noise1d.html (single hyphen) works correctly.

Thanks,
Stephen

Hi there,

Was looking at the Smoke Particles example on the p5 website and it doesn't seem to be working. I ran the p5 sketch locally and works just fine. Might be something to do with how the site is rendering examples. I noticed the bug when I ran on chrome and firefox. The only errors on the console were a reference to "testing i18n" init.js:172

https://p5js.org/examples/simulate-smokeparticles.html

hope this helps!
-Jason

Hey, looks like the link for Sound / Measuring Amplitude on the examples page is broken.

The link should be to https://p5js.org/examples/sound-measuring-amplitude.html
but is actually to https://p5js.org/examples/sound--measuring-amplitude.html

Not sure how that extra dash got added!

The reference doesn't work anymore. When you refresh often sometimes it shows but in most cases the reference pages stay empty. (Both safari and chrome on mac. I don't know if window works).

https://p5js.org/reference/#/p5.Element
In the mousewheel() documentation on the above page,
callback is misspelled as "callabck"

Happened to be on the p5.js website today and I noticed the links in the main copy (section#home) are not clickable.

(we will hide i18n buttons until ready to go live with translation)

• add back in tagline
• disable i18n buttons and auto-detection for p5js.org domain
• add people page
• add reference
• fix spanish reference
• hook up versions for downloads
• copyright info page

This page needs to be moved to the wiki here, and updated for the current website flow.

Also need to update the link from this page: https://github.com/processing/p5.js/wiki/Development

From @ricardocanada on November 24, 2016 20:2

When I try to copy example code from https://p5js.org/examples/ in iOS Safari to use in my iPad environment, it is almost impossible to do so unless the example has an Edit button. That seems to put the code in Raw form, and then all of my selection and copy options work. Otherwise it is almost impossible to select text, and when occasionally I do get the menu with a Select All option, the menu with the Copy option does not appear. Very frustrating this morning, and I didn't get the code I wanted. I hope that the webmaster of the site will consider 1. Giving every example an Edit button or 2. GIving examples without an Edit button a Raw button the way GitHub does.

Thanks for listening.

Copied from original issue: processing/p5.js#1677

this is a trickier one, it seems like it should be a second stage focus after the initial site launch

to keep track of additional translation edits we need to make

• http://p5js.org/download/ (text inside p5.js complete box)
• http://p5js.org/learn/ - added optimization
• http://p5js.org/libraries/ - added p5.func
• https://p5js.org/contributors-conference
• https://p5js.org/get-started (download7, download8)
• taglines
• tutorial page
• footer4
• http://p5js.org/download/support.html
• check that the footer "p5.js was created by Lauren McCarthy and is developed by a community of collaborators, with support from the Processing Foundation and NYU ITP. Identity and graphic design by Jerel Johnson. © Info." is translated in every kind of subdomain on the site.
• mailing list section on http://p5js.org/community/
• p5.js can't be downloaded from p5js.org/es/download, version doesn't appear too
• http://p5js.org/reference/ (offline reference link at top)
• p5js.org/es/reference page menu and header is still in English
• translate "If you see any errors or have suggestions, please let us know" to "Si encuentras algún error o tienes alguna sugerencia, por favor avísanos" in all of the Reference entries
• translate "Find any typos or bugs? X is documented and defined in Y. Please feel free to edit the file and issue a pull request!" to "¿Encontraste algún error? X está documentado y definido en Y. Por favor ten la libertad de editar el archivo y hacer un pull request" in all of the Reference entries
• translate "Parameters" to "Parámetros" in all of the Reference entries
• at p5js.org/es/reference, translate "Search the API" to "Busca en la API"
• at every entry of the p5jsorg/es/reference, translate "Search the API" to "Busca en la API"
• make hover-on texts in reference appear in Spanish
• add subtitles to http://hello.p5js.org/, it is linked from "hello" on the spanish version of the website.
• fix bug where [p5 Element] turns into [object Object] at https://p5js.org/es/reference/#/libraries/p5.dom
• translate example src/data/examples/es/00_Structure/en/08_Create_Graphics.js
• double-check that comments on reference examples are translated to Spanish
• add a sketch by a spanish speaking artist to celebrate the launch of the website.
• for translating the site https://p5js.org/es/reference/#/libraries/p5.dom to Spanish, do I need to modify the file p5.js/docs/reference/api.js ?

https://p5js.org/reference/#/p5/texture

link to the example under the description is broken, links to: https://http//p5js.org/examples/3d-materials.html

Feel free to close this one if it's not relevant yet or already in progress etc.

I'm just wondering if the translation for the site for other languages other than Spanish are ongoing? If not what are the plans if any?

I want to, for example, change the link for "code editor" in the "getting started" in spanish, to point to the spanish link on wikipedia, instead of english.

I suppose it has to do with the index.hbs file, but still can't figure it out.

We can use google translate APIs or bing language APIs for translating the page automatically than to do manually for every language.

Any suggestions?

need to choose what sketch will be put on the home page when the site goes live.

I think we used to have hover feedback for run/reset example buttons but it seems to have disappared. Maybe the button should come to full opacity (background and text) on hover?

to translate the entire site, we need to have all of the text (currently stored as strings in a yml file) translated into another language and stored.

• download
• reference (and all of its subpages)
• form to submit work
• hello.p5js.org ?

need to implement search site function in the upper-right hand corner of the header

Reported here: fathominfo/processing-p5js-mode#12

Uncaught ReferenceError: w is not defined
at window.onload (init.js:103)

this doesn't happen on the p5js active website,
maybe because the i18n buttons are not enabled yet?

The normalMaterial reference page has a broken link to the example (currently https://http//p5js.org/examples/3d-materials.html).

In the majority of cases I used canvas libs for simple drawings, but I had to download the complete library. In my view it's a huge disadvantage, because the libraries are almost fat.

It would be a huge advantage, if we could offer a download of a modular generated library. I imagine something like the Modernizr download page, where you can select parts of the library (primitives, lights, camrea, ...).

In addition we could add a seperate namespace.

What do you think?

Regards,
Darius

I'm running grunt server, and it freezes on the imagemin:images task. If it's not frozen, then it takes a very long time to run (I let it run for as long as 7 minutes) and we might want to warn about that. This is my first time building the new website, I am following the steps from the readme.

When clicking on a reference example using Chrome 56 Mac the editor is glitching out and does not function. I noticed that some attributes are being changed very frequently to some very strange values.

URL Tested: https://p5js.org/reference/#/p5/alpha
Chrome: Version 56.0.2924.87 (64-bit)
OSX: 10.11.6

Works fine on Firefox Latest Macosx. I will continue to investigate and send a PR if I find a fix.

I'm using Chromium v. 57.0.2987.133 (64-bit) on GNU-Linux (8.4.13-1-ARCH) to navigate through the p5 reference pages. Every so often (in intervals ranging from about .5 < 4 seconds) the browser falls behind.

Sometimes I can't move the pointer for up to two seconds! And if I play sound or video in a background tab, it seems to seek back?! Using devtools, I observed the timeline and call stack. Here are some of the violations I get in the console. Note that I had disabled my extensions, and had only two tabs open.

[Violation] 'setTimeout' handler took 54ms
[Violation] 'requestAnimationFrame' handler took 1555ms
p5.min.js:6 [Violation] Handling of 'wheel' input event was delayed for 1868 ms due to main thread being busy. Consider marking event handler as 'passive' to make the page more responsive.
[Violation] 'requestAnimationFrame' handler took 1816ms
[Violation] 'mousemove' handler took 965ms
[Violation] Forced reflow while executing JavaScript took 965ms
[Violation] 'requestAnimationFrame' handler took 1781ms
[Violation] 'requestAnimationFrame' handler took 1289ms
etc ...

Is the wildcard animation really necessary? I think most users would agree that this experience makes the reference pages completely unusable. In an issue in the p5 repo, offline documentation is proposed. That did not really work for me (it depends on some php page?). I'd personally rather have it presented in one big happy plain text file or a pdf version anyway. I'm willing to contribute to that.

Currently the reference pages all have the title of "p5.js | reference". This makes going back through history a difficult task. It seems like these should all have unique titles.

proposed title: p5.js | reference | Image()
Processing's web documentation is more or less reversed: Image() | p5.js | Reference

I believe this would be a relatively easy template change.

Reposting bug from processing/p5.js-website-OLD#234

This is still an issue on the new website.

Problem can be seen here: http://p5js.org/reference/#/p5/rect

Problem occurs both in Chrome and in IE

The desktop version of the website has menu items which wrap themselves in mobile view. It would be a lot better if there is a top collapsible navigation bar for mobile view only.

@lmccart What do you think about this?

The descriptions for the p5.tiledmap, p5.dimensions and p5.SceneManager libraries appear in English in the Spanish version of the website.

How or which repository will be the future main repository, mayaman/p5js-website or processing/p5.js-website? I'm worried about the differences in the content between these repositories. For instance the gallery and contribution section aren't in the scope or focus of the current translation. What is the plan?

The menu can lock into the bottom of the window which causes a sort of autoscroll

Chrome Version 56.0.2924.87 (64-bit)

This is especially noticeable on the reference page:

It looks like the site is currently down, can anyone confirm?

http://downforeveryoneorjustme.com/p5js.org

i have to manually add "/es" at the end of the address to show the spanish version

This should ideally be one line. Maybe "Processing for Android" could just become "Android" on mobile header. Maybe "Processing.py" could become "py" or "Python".

the search bar in upper right should appear and expand on hover, you can see it in action here: http://p5js.org, on the staging site this seems to be broken.

the relevant code is here: https://github.com/mayaman/p5js-website/blob/master/src/assets/js/main.js.

@nok has jquery been removed completely from the site? I'd guess this is the issue then. however, while I like the idea of improving speed by removing jquery, I'm not sure it's sustainable from a development perspective to not have access to the helpers it provides. or maybe I'm misunderstanding the rearrangement that happened with jquery? it seems like it is being recognized in some places.. can you clarify? sorry if I missed the explanation somewhere earlier.

sorry, missed the right repository... pasting to the right one

Clicking on the examples in the Material reference pages that includes normalMaterial(), texture(), ambientMaterial(), specularMaterial() leads to 404 error.

We typically try to switch these out each month. For the next couple months we're doing a series featuring Asian women and gender non-conforming artists (see http://diversity.p5js.org for more info). But we have nothing planned after that. It would be awesome to curate other group collections.

When we hit a search query, the website is directing to a google search page, it would be nice if it is displayed on the web page itself.

Issue first reported here: processing/p5.js-website-OLD#176

Still experiencing issue on new version of the site.

Can reproduce in Chrome on Windows 10.
Problem occurs without the resizing of the window described in the original ticket.