This adds a new build that can be included in p5 sketches to mix Shader Park sdfs with other p5 objects, including depth support, so that p5 objects don't clip the sdf in unexpected ways.

A small demo with two Shader Park spheres and a p5 cube:

Live here: https://editor.p5js.org/davepagurek/sketches/elqEKyApr

This exposes a few function people can use:

• loadShaderPark(url, options): Call this in preload() to load source code from a file
  • Annoyingly, this doesn't work in the p5 editor if your shader park source file ends in .js, because the web editor renames .js files to a jumble of letters and numbers. It works with .txt, but loses syntax highlighting. So this option is probably best only for people using a different setup.
• createShaderParkFromSrc(src, options): Creates a shader park object from string source code
• createShaderPark(fn, options): Like the createShaderParkFromSrc option, but it lets you pass in a js function. Under the hood, this just calls .toString() on the function. This is maybe the easiest option within the p5 editor that also gives you js syntax highlighting.

For all of those methods:

• You can call the method globally when using p5 in global mode
• You can call it on a p5 instance when using p5's instance mode
• You can also call this on a createGraphics object to get an object you can use on that instead of the main canvas
• The options object is optional but can include:
  • scale: Defaults to 1, and scales up or down the sdf
  • drawGeometry: A function that draws the host object the shader will run on. Defaults to a sphere, but could be anything.

To use this, you'll need a build of p5 off of the main branch (there isn't a release yet with WebGL2 support, but it'll be in the next one!) and you'll need to add a script tag referencing dist/shader-park-p5.js.