Set up WebGPU build for packaging as an addon

Author: davepagurek

rollup.config.mjs

@@ -36,7 +36,7 @@ const bundleSize = (name, sourcemap) => {
   });
 };
 
-const modules = ['math'];
+const modules = ['webgpu']; // TODO: also generate math build
 const generateModuleBuild = () => {
   return modules.map(module => {
     return {
@@ -195,7 +195,6 @@ export default [
     },
     external: /node_modules/,
     plugins
-  }
-  // NOTE: comment to NOT build standalone math module
-  // ...generateModuleBuild()
+  },
+  ...generateModuleBuild()
 ];

src/core/p5.Renderer3D.js

@@ -18,31 +18,7 @@ import { RenderBuffer } from "../webgl/p5.RenderBuffer";
 import { Image } from "../image/p5.Image";
 import { Texture } from "../webgl/p5.Texture";
 import { makeFilterShader } from "../core/filterShaders";
-
-export function getStrokeDefs(shaderConstant) {
-  const STROKE_CAP_ENUM = {};
-  const STROKE_JOIN_ENUM = {};
-  let lineDefs = "";
-  const defineStrokeCapEnum = function (key, val) {
-    lineDefs += shaderConstant(`STROKE_CAP_${key}`, `${val}`, 'u32');
-    STROKE_CAP_ENUM[constants[key]] = val;
-  };
-  const defineStrokeJoinEnum = function (key, val) {
-    lineDefs += shaderConstant(`STROKE_JOIN_${key}`, `${val}`, 'u32');
-    STROKE_JOIN_ENUM[constants[key]] = val;
-  };
-
-  // Define constants in line shaders for each type of cap/join, and also record
-  // the values in JS objects
-  defineStrokeCapEnum("ROUND", 0);
-  defineStrokeCapEnum("PROJECT", 1);
-  defineStrokeCapEnum("SQUARE", 2);
-  defineStrokeJoinEnum("ROUND", 0);
-  defineStrokeJoinEnum("MITER", 1);
-  defineStrokeJoinEnum("BEVEL", 2);
-
-  return { STROKE_CAP_ENUM, STROKE_JOIN_ENUM, lineDefs };
-}
+import { getStrokeDefs } from "../webgl/enums";
 
 const { STROKE_CAP_ENUM, STROKE_JOIN_ENUM } = getStrokeDefs(()=>"");
 
@@ -2035,3 +2011,13 @@ export class Renderer3D extends Renderer {
     super.remove();
   }
 }
+
+function renderer3D(p5, fn) {
+  p5.Renderer3D = Renderer3D;
+}
+
+export default renderer3D;
+
+if (typeof p5 !== "undefined") {
+  renderer3D(p5, p5.prototype);
+}

src/core/rendering.js

@@ -10,7 +10,10 @@ import { Framebuffer } from '../webgl/p5.Framebuffer';
 let renderers;
 function rendering(p5, fn){
   // Extend additional renderers object to p5 class, new renderer can be similarly attached
-  renderers = p5.renderers = {};
+  if (!p5.renderers) {
+    p5.renderers = {};
+  }
+  renderers = p5.renderers;
 
   /**
    * Creates a canvas element on the web page.

src/webgl/enums.js

@@ -0,0 +1,25 @@
+import * as constants from '../core/constants';
+export function getStrokeDefs(shaderConstant) {
+  const STROKE_CAP_ENUM = {};
+  const STROKE_JOIN_ENUM = {};
+  let lineDefs = "";
+  const defineStrokeCapEnum = function (key, val) {
+    lineDefs += shaderConstant(`STROKE_CAP_${key}`, `${val}`, 'u32');
+    STROKE_CAP_ENUM[constants[key]] = val;
+  };
+  const defineStrokeJoinEnum = function (key, val) {
+    lineDefs += shaderConstant(`STROKE_JOIN_${key}`, `${val}`, 'u32');
+    STROKE_JOIN_ENUM[constants[key]] = val;
+  };
+
+  // Define constants in line shaders for each type of cap/join, and also record
+  // the values in JS objects
+  defineStrokeCapEnum("ROUND", 0);
+  defineStrokeCapEnum("PROJECT", 1);
+  defineStrokeCapEnum("SQUARE", 2);
+  defineStrokeJoinEnum("ROUND", 0);
+  defineStrokeJoinEnum("MITER", 1);
+  defineStrokeJoinEnum("BEVEL", 2);
+
+  return { STROKE_CAP_ENUM, STROKE_JOIN_ENUM, lineDefs };
+}

src/webgl/index.js

@@ -12,9 +12,11 @@ import framebuffer from './p5.Framebuffer';
 import dataArray from './p5.DataArray';
 import camera from './p5.Camera';
 import texture from './p5.Texture';
+import renderer3D from '../core/p5.Renderer3D';
 import rendererGL from './p5.RendererGL';
 
 export default function(p5){
+  p5.registerAddon(renderer3D);
   p5.registerAddon(rendererGL);
   p5.registerAddon(primitives3D);
   p5.registerAddon(interaction);

src/webgl/p5.RendererGL.js

@@ -9,7 +9,8 @@ import {
   setWebGLUniformValue,
   checkWebGLCapabilities
 } from './utils';
-import { Renderer3D, getStrokeDefs } from '../core/p5.Renderer3D';
+import { Renderer3D } from '../core/p5.Renderer3D';
+import { getStrokeDefs } from './enums';
 import { Shader } from './p5.Shader';
 import { MipmapTexture } from './p5.Texture';
 import { Framebuffer } from './p5.Framebuffer';

src/webgpu/index.js

@@ -1,37 +1,5 @@
-import primitives3D from '../webgl/3d_primitives';
-import interaction from '../webgl/interaction';
-import light from '../webgl/light';
-import loading from '../webgl/loading';
-import material from '../webgl/material';
-import text from '../webgl/text';
-import renderBuffer from '../webgl/p5.RenderBuffer';
-import quat from '../webgl/p5.Quat';
-import matrix from '../math/p5.Matrix';
-import geometry from '../webgl/p5.Geometry';
-import framebuffer from '../webgl/p5.Framebuffer';
-import dataArray from '../webgl/p5.DataArray';
-import shader from '../webgl/p5.Shader';
-import camera from '../webgl/p5.Camera';
-import texture from '../webgl/p5.Texture';
-import rendererGL from '../webgl/p5.RendererGL';
-import strands from '../strands/p5.strands';
+import rendererWebGPU from './p5.RendererWebGPU';
 
 export default function(p5){
-  p5.registerAddon(rendererGL);
-  p5.registerAddon(primitives3D);
-  p5.registerAddon(interaction);
-  p5.registerAddon(light);
-  p5.registerAddon(loading);
-  p5.registerAddon(material);
-  p5.registerAddon(text);
-  p5.registerAddon(renderBuffer);
-  p5.registerAddon(quat);
-  p5.registerAddon(matrix);
-  p5.registerAddon(geometry);
-  p5.registerAddon(camera);
-  p5.registerAddon(framebuffer);
-  p5.registerAddon(dataArray);
-  p5.registerAddon(shader);
-  p5.registerAddon(texture);
-  p5.registerAddon(strands);
+  p5.registerAddon(rendererWebGPU);
 }