Add JavaScript bindings

Co-authored-by: Roland Ruiters-Christou <[email protected]>
Co-authored-by: Sebastian Dunkel <[email protected]>
Co-authored-by: Aura Munoz <[email protected]>
Co-authored-by: Philipp Frericks <[email protected]>
Co-authored-by: Cedrick Muenstermann <[email protected]>

Author: 6 people

extras/usd/js_bindings/CMakeLists.txt

@@ -0,0 +1,49 @@
+set(PXR_PREFIX jsBindings)
+set(PXR_PACKAGE jsBindings)
+
+if (NOT PXR_ENABLE_JS_SUPPORT)
+  return()
+endif()
+
+set(BINDINGS_NAME "jsBindings")
+set(BINDING_DEPENDENCIES "")
+list(APPEND BINDING_DEPENDENCIES usd usdLux usdGeom usdUtils sdf tf)
+
+set(RESOURCE_PARAMETERS "")
+function(add_resources target)
+    # This local var is needed since list append cannot update the PARENT_SCOPE
+    set(LOCAL_VAR ${RESOURCE_PARAMETERS})
+    get_property(RESSOURCES TARGET ${target} PROPERTY EMSCRIPTEN_RESOURCES)
+    list(APPEND LOCAL_VAR "${RESSOURCES}")
+    set(RESOURCE_PARAMETERS "${LOCAL_VAR}" PARENT_SCOPE)
+endfunction()
+
+# Gather resources (schemas) to make them available to attach them to the bundle
+add_resources(usdShade)
+add_resources(sdf)
+add_resources(usdHydra)
+add_resources(usd)
+add_resources(usdLux)
+add_resources(ar)
+add_resources(usdGeom)
+add_resources(ndr)
+
+list(APPEND RESOURCE_PARAMETERS "--embed-file ${PROJECT_BINARY_DIR}/plugins_plugInfo.json@/usd/plugInfo.json")
+
+pxr_cpp_bin(${BINDINGS_NAME}
+    LIBRARIES
+      ${BINDING_DEPENDENCIES}
+      ${RESOURCE_PARAMETERS}
+)
+
+set(BUILD_FILES
+    ${CMAKE_CURRENT_BINARY_DIR}/${BINDINGS_NAME}.js
+    ${CMAKE_CURRENT_BINARY_DIR}/${BINDINGS_NAME}.wasm
+    ${CMAKE_CURRENT_BINARY_DIR}/${BINDINGS_NAME}.worker.js
+)
+
+install(
+    FILES
+      ${BUILD_FILES}
+    DESTINATION ${CMAKE_CURRENT_SOURCE_DIR}/../../../js/bindings/${CMAKE_BUILD_TYPE}
+)

extras/usd/js_bindings/jsBindings.cpp

@@ -0,0 +1,2 @@
+node_modules/
+bindings/

js/.gitignore

@@ -0,0 +1,83 @@
+Additional Requirements
+-----------------------
+
+Node version 16.0.0^
+Emscripten version 2.0.24^
+
+Setup
+-----
+
+Build USD with Emscripten for NodeJS (in the root of this repository):
+
+locally
+```sh
+python build_scripts/build_usd.py --emscripten <build_folder>
+```
+or in a Docker container
+```sh
+docker build -t <CONTAINER_TAG> .
+docker run -it -w //src -p 6931:6931 <CONTAINER_TAG>
+```
+
+and run
+
+```sh
+npm install
+```
+
+in this `js` folder.
+
+Tests
+------
+
+Run
+
+```sh
+npm run test
+```
+
+or in watch mode
+
+```sh
+npm run test --  --watch
+```
+
+NPM package consumption
+------------------------
+
+Currently we only support consumption of the bindings via Script tags in the browser or via Node.js
+
+If you are using Webpack you can add the bindings to your application with
+
+```
+  externals: {
+    "usd": 'usd', // indicates global variable
+  },
+  plugins: [
+    new CopyPlugin({
+      patterns: [
+        { from: "<PATH TO BINDINGS>" },
+      ],
+    }),
+  ],
+```
+
+and after adding `<script src="jsBindings.js"></script>` to your HTML page use it in your code with
+
+```
+    <script src="jsBindings.js"></script>
+    <script type="module">
+      import {UsdStage} from './usd.js';
+      let stage = UsdStage.CreateNew('HelloWorld.usda');
+    </script>
+```
+
+In Node.Js you can load it via 
+```
+const usdModule = require("usd");
+let Usd = await usdModule();
+let UsdStage = Usd.UsdStage;
+
+let stage = UsdStage.CreateNew('HelloWorld.usda');
+...
+```

js/README.md

@@ -0,0 +1,38 @@
+const usdModule = require("usd");
+
+let Usd;
+let stage;
+
+beforeEach(async () => {
+  Usd = await usdModule();
+  const fileName = "HelloWorld.usda";
+  stage = Usd.UsdStage.CreateNew(fileName);
+});
+
+afterAll(() => {
+  Usd.PThread.runningWorkers.forEach(x => x.onmessage = function() {});
+  Usd.PThread.terminateAllThreads();
+  Usd = null;
+  stage = null;
+  process.removeAllListeners('unhandledRejection')
+  process.removeAllListeners('uncaughtException')
+});
+
+describe('USD Stage', () => {
+  test("CreateNew", () => {
+    expect(stage).not.toBeUndefined();
+  });
+
+  test("DefinePrim", () => {
+    let sphere = stage.DefinePrim("/hello/world", "Sphere");
+    expect(sphere).not.toBeUndefined();
+  });
+
+  test("ExportToString", () => {
+    stage.DefinePrim("/hello", "Xform");
+    stage.DefinePrim("/hello/world", "Sphere");
+    const data = stage.ExportToString();
+    expect(data).toEqual(expect.stringMatching('Sphere'));
+    expect(data).toEqual(expect.stringMatching('Xform'));
+  });
+});