Module syntax conversion

[limzykenneth]

I'm currently in the process of converting all modules that are not worked on by someone immediately into using the new module syntax, ie. not Typography, FES, or WebGL, these can be converted at the implementers' own discretion.

Do have a look at the already converted ones for guidance on how to convert or let me know if further clarifications are needed. I'll outline below.

Each folder inside src/ is considered a module (ie. if we were to distribute the library in modular form, these are not likely to be further split up). Each file inside of each module is considered a submodule/library file and uses the new library syntax as described in #7015. In addition, each module folder will have a new file index.js which comes in the form:

import arrayFunctions from './array_functions.js';
// ...

export default function(p5){
  p5.registerAddon(arrayFunctions);
  // ...
}

The bundler entry point app.js will then import these index file and pass p5 to the exported default function, kick starting the module linking process. To put it shortly, the convention/syntax described above plus some minor details I omitted here is to enable the different use cases needed. In addition to global mode and instance mode, the following:

ES6 modular import

import calculation from './src/math/calculation.js';
p5.registerAddon(calculation);

Script tag modular library import

<script src="./p5.js" />
<script src="./p5.math.js" />
<script src="./sketch.js" />