[WIP] 2.0 tutorials changes

[ksen0]

Minor changes in tutorials

• Ensure mouseX and mouseY examples either expect floating point, or cast to int. For example: https://beta.p5js.org/reference/p5/mousex/ should be updated, also https://beta.p5js.org/tutorials/variables-and-change/
• Ensure examples using fill, background and color provide in-range values. For example: https://beta.p5js.org/tutorials/organizing-code-with-functions/
• Although preload() code has been removed, phrasing should be updated too https://beta.p5js.org/tutorials/animating-with-media-objects/

These tasks are based on checking

• https://beta.p5js.org/tutorials/get-started/
• https://beta.p5js.org/tutorials/setting-up-your-environment/
• https://p5js.org/tutorials/variables-and-change/ 👀 see notes below
• https://beta.p5js.org/tutorials/conditionals-and-interactivity/
• https://beta.p5js.org/tutorials/organizing-code-with-functions/ 👀 see notes below
• https://beta.p5js.org/tutorials/repeating-with-loops/
• https://beta.p5js.org/tutorials/data-structure-garden/
• https://beta.p5js.org/tutorials/animating-with-media-objects/ 👀 see notes below (not 2.0 related)
• https://beta.p5js.org/tutorials/color-gradients/
• Custom shapes and smooth curves - (separate issue)

Variables and Change

https://beta.p5js.org/tutorials/variables-and-change/

p5js.org	beta.p5js.org

mouseX and mouseY are not integer in 2.0: text(mouseX: ${mouseX}, mouseY: ${mouseY}, 20, 20);

Organizing code with Functions

https://beta.p5js.org/tutorials/organizing-code-with-functions/

p5js.org	beta.p5js.org

Out of bounds color values behavior not consistent with 1.x: processing/p5.js#7714

Animating with media objects

See last sketch in the tutorial: https://beta.p5js.org/tutorials/animating-with-media-objects/
and compare to either 2.0 or latest 1.x: https://editor.p5js.org/ksen0/sketches/GOAfBPCy1
Something with the can sizing is off. It's not a 2.0 issue.