elalish · elalish · May 25, 2023 · May 15, 2023 · May 15, 2023 · May 16, 2023
diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml
@@ -20,16 +20,15 @@ jobs:
         mkdir public
         mv ./samples ./public
         mv ./docs ./public
-        mv ./bindings/wasm/examples/* ./public
 
-    - name: Download WASM files
+    - name: Download built examples
       uses: dawidd6/action-download-artifact@v2
       with:
         workflow: manifold.yml
         workflow_conclusion: completed
         pr: ${{github.event.pull_request.number}}
         name: wasm
-        path: ./public/built
+        path: ./public
 
     - name: Deploy to Github Pages
       uses: peaceiris/actions-gh-pages@v3

diff --git a/.github/workflows/manifold.yml b/.github/workflows/manifold.yml
@@ -127,19 +127,17 @@ jobs:
       run: |
         cd build/test
         node ./manifold_test.js
-        cd ../bindings/wasm
-        npm install
+    - name: Test examples
+      run: |
+        cd bindings/wasm/examples
+        npm ci
+        npm run build
         npm test
     - name: Upload WASM files
       uses: actions/upload-artifact@v3
       with:
         name: wasm
-        path: |
-          build/bindings/wasm/manifold.js
-          build/bindings/wasm/manifold.wasm
-          build/bindings/wasm/manifold.d.ts
-          build/bindings/wasm/manifold-global-types.d.ts
-          build/bindings/wasm/manifold-encapsulated-types.d.ts
+        path: bindings/wasm/examples/dist/
         retention-days: 90
 
   build_windows:

diff --git a/bindings/wasm/CMakeLists.txt b/bindings/wasm/CMakeLists.txt
@@ -27,12 +27,17 @@ target_link_options(manifoldjs PUBLIC --pre-js ${CMAKE_CURRENT_SOURCE_DIR}/bindi
 target_compile_features(manifoldjs PUBLIC cxx_std_17)
 set_target_properties(manifoldjs PROPERTIES OUTPUT_NAME "manifold")
 
-file(COPY examples;test;. DESTINATION ${CMAKE_CURRENT_BINARY_DIR})
-set_property(DIRECTORY APPEND PROPERTY CMAKE_CONFIGURE_DEPENDS examples;test)
+file(MAKE_DIRECTORY ${CMAKE_CURRENT_SOURCE_DIR}/examples/built)
 
 add_custom_command(
         TARGET manifoldjs POST_BUILD
         COMMAND ${CMAKE_COMMAND} -E copy
                 ${CMAKE_CURRENT_BINARY_DIR}/manifold.*
-                ${CMAKE_CURRENT_BINARY_DIR}/manifold-*.d.ts
+                ${CMAKE_CURRENT_SOURCE_DIR}/manifold*.d.ts
                 ${CMAKE_CURRENT_SOURCE_DIR}/examples/built/)
+
+add_custom_command(
+        TARGET manifoldjs POST_BUILD
+        COMMAND ${CMAKE_COMMAND} -E copy
+                ${CMAKE_CURRENT_SOURCE_DIR}/manifold*.d.ts
+                ${CMAKE_CURRENT_SOURCE_DIR}/examples/public/)
diff --git a/bindings/wasm/README.md b/bindings/wasm/README.md
@@ -22,22 +22,9 @@ The most significant contribution here is a guaranteed-manifold [mesh Boolean](h
 
 Since Manifold is a WASM module, it does not automatically garbage-collect like regular JavaScript. You must manually `delete()` each manifold object constructed by your scripts, see [discussion](https://github.com/elalish/manifold/discussions/256#discussioncomment-3944287).
 
-## Local development
+## Examples
 
-First, follow the directions in the root README to get your C++ build environment set up and working for WASM. From this directory (`bindings/wasm/`) you can test the JS bindings by running:
-
-```
-npm install
-npm test
-```
-
-    You can also test the manifoldCAD.org editor as well as our other example pages by serving from `bindings/wasm/examples/` with e.g. `npx http-server`.
-
-Note that the `emcmake` command automatically copies your WASM build into `examples/built/` - these are checked into our repo in order to make sharing repro cases much easier. Note that you can test manifoldCAD.org on anyone's branch by simply going to: `https://raw.githack.com/<user>/manifold/<branch>/bindings/wasm/examples/index.html` e.g. https://raw.githack.com/elalish/manifold/glTFextension/bindings/wasm/examples/index.html
-
-Of course these built files may easily end up with conflicts, but there's no need to address them; simply overwrite them with your newer build. These files are also not used for our deployed pages, as the deployment process overwrites them with current builds. Never edit anything in the `built` directory by hand. 
-
-When testing [manifoldCAD.org](https://manifoldcad.org/) (either locally or the deployed version) note that it uses a service worker for faster loading. This means you need to open the page twice to see updates (the first time loads the old version and caches the new one, the second time loads the new version from cache). To see changes on each reload, open Chrome dev tools, go to the Application tab and check "update on reload".
+Please see our usage [examples](https://github.com/elalish/manifold/tree/master/bindings/wasm/examples) to see how to interface this library with `three.js`, `<model-viewer>`, and `glTF`. Of particular note are the included libraries for lossless roundtrip of manifold meshes through glTF files, via a new extension: [EXT_manifold](https://github.com/KhronosGroup/glTF/pull/2286). 
 
 ## About the author
 

diff --git a/bindings/wasm/bindings.cpp b/bindings/wasm/bindings.cpp
@@ -173,6 +173,12 @@ Manifold Warp(Manifold& manifold, uintptr_t funcPtr) {
   return manifold.Warp(f);
 }
 
+Manifold SetProperties(Manifold& manifold, int numProp, uintptr_t funcPtr) {
+  void (*f)(float*, glm::vec3, const float*) =
+      reinterpret_cast<void (*)(float*, glm::vec3, const float*)>(funcPtr);
+  return manifold.SetProperties(numProp, f);
+}
+
 Manifold LevelSetJs(uintptr_t funcPtr, Box bounds, float edgeLength,
                     float level) {
   float (*f)(const glm::vec3&) =
@@ -254,6 +260,7 @@ EMSCRIPTEN_BINDINGS(whatever) {
       .function("_GetMeshJS", &GetMeshJS)
       .function("refine", &Manifold::Refine)
       .function("_Warp", &Warp)
+      .function("_SetProperties", &SetProperties)
       .function("transform", &Transform)
       .function("_Translate", &Manifold::Translate)
       .function("_Rotate", &Manifold::Rotate)

diff --git a/bindings/wasm/bindings.js b/bindings/wasm/bindings.js
@@ -75,6 +75,33 @@ Module.setup = function() {
     return out;
   };
 
+  Module.Manifold.prototype.setProperties = function(numProp, func) {
+    const oldNumProp = this.numProp;
+    const wasmFuncPtr = addFunction(function(newPtr, vec3Ptr, oldPtr) {
+      const newProp = [];
+      for (let i = 0; i < numProp; ++i) {
+        newProp[i] = getValue(newPtr + 4 * i, 'float');
+      }
+      const pos = [];
+      for (let i = 0; i < 3; ++i) {
+        pos[i] = getValue(vec3Ptr + 4 * i, 'float');
+      }
+      const oldProp = [];
+      for (let i = 0; i < oldNumProp; ++i) {
+        oldProp[i] = getValue(oldPtr + 4 * i, 'float');
+      }
+
+      func(newProp, pos, oldProp);
+
+      for (let i = 0; i < numProp; ++i) {
+        setValue(newPtr + 4 * i, newProp[i], 'float');
+      }
+    }, 'viii');
+    const out = this._SetProperties(numProp, wasmFuncPtr);
+    removeFunction(wasmFuncPtr);
+    return out;
+  };
+
   Module.Manifold.prototype.translate = function(...vec) {
     return this._Translate(vararg2vec(vec));
   };

diff --git a/bindings/wasm/examples/README.md b/bindings/wasm/examples/README.md
@@ -0,0 +1,26 @@
+# WASM/JS Examples
+
+This is the home of our editor, [ManifoldCAD.org](https://manifoldcad.org/), as well as our other public examples of integrations with `three.js`, `<model-viewer>`, and `glTF`. Included are `manifold-gltf.js` and `gltf-io.js`, which are intended to be fairly general-purpose libraries for interfacing between manifolds and glTF. We should probably make them into their own npm package at some point.
+
+## Local development
+
+First, follow the directions in the root README to get your C++ build environment set up and working for WASM. From this directory (`bindings/wasm/examples/`) you can test the JS bindings by running:
+
+```
+npm install
+npm test
+```
+
+To develop the manifoldCAD.org editor as well as our other example pages, run 
+```
+npm run dev
+```
+which will serve the pages, watch for changes, and automatically rebuild and refresh. This build step doesn't do TS type-checking, so to verify everything is correct (beyond VSCode's TS linting), run
+```
+npm run build
+```
+See `package.json` for other useful scripts.
+
+Note that the `emcmake` command automatically copies your WASM build into `built/`, (here, not just under the `buildWASM` directory) which is then packaged by Vite into `dist/assets/`.
+
+When testing [ManifoldCAD.org](https://manifoldcad.org/) (either locally or the deployed version) note that it uses a service worker for faster loading. This means you need to open the page twice to see updates (the first time loads the old version and caches the new one, the second time loads the new version from cache). To see changes on each reload, open Chrome dev tools, go to the Application tab and check "update on reload".