@needle-tools/materialx 1.1.0-next.0aa8b46 → 1.1.0-next.899791c

package/README.md

@@ -1,18 +1,32 @@
 # Needle MaterialX
 
-Web runtime support to load and display MaterialX materials in Needle Engine
+Web runtime support to load and display MaterialX materials in Needle Engine and three.js
 
 ## Installation
 `npm i @needle-tools/materialx`  
 
+## Examples
+- [three.js Example on Stackblitz](https://stackblitz.com/edit/needle-materialx-example?file=main.js,package.json,index.html)
+
 ## How to use
 
-To use with Needle Engine simply import the module
+### Use with Needle Engine
+
+```ts
+import { useNeedleMaterialX } from "@needle-tools/materialx/needle";
+// Simply call this function in global scope as soon as possible
+useNeedleMaterialX();
+```
+
+### Use with three.js
 
 ```ts
-import "@needle-tools/materialx"
+import { useNeedleMaterialX } from "@needle-tools/materialx";
+// Call the function with your GLTFLoader instance
+useNeedleMaterialX(<yourGltfLoaderInstance>);
 ```
 
+
 <br />
 
 # Contact ✒️

package/index.ts

@@ -1,2 +1,2 @@
 export * from "./src/index.js";
-export { addPluginForThree } from "./src/loader/loader.three.js";
+export { useNeedleMaterialX } from "./src/loader/loader.three.js";

package/needle.ts

@@ -1,2 +1,2 @@
 export * from "./src/index.js";
-export { addPluginForNeedleEngine } from "./src/loader/loader.needle.js";
+export { useNeedleMaterialX } from "./src/loader/loader.needle.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@needle-tools/materialx",
-  "version": "1.1.0-next.0aa8b46",
+  "version": "1.1.0-next.899791c",
   "type": "module",
   "main": "index.ts",
   "exports": {

package/src/loader/loader.needle.ts

@@ -2,7 +2,7 @@ import { addCustomExtensionPlugin } from "@needle-tools/engine";
 import { Context, GLTF, INeedleGLTFExtensionPlugin } from "@needle-tools/engine";
 import type { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader.js";
 import type { GLTFExporter } from "three/examples/jsm/exporters/GLTFExporter.js";
-import { addPluginForThree, MaterialXLoader } from "./loader.three.js";
+import { useNeedleMaterialX as _useNeedleMaterialX, MaterialXLoader } from "./loader.three.js";
 import { debug } from "../utils.js";
 import { MaterialParameters } from "three";
 
@@ -14,7 +14,7 @@ export class MaterialXLoaderPlugin implements INeedleGLTFExtensionPlugin {
 
     onImport = (loader: GLTFLoader, url: string, context: Context) => {
         if (debug) console.log("MaterialXLoaderPlugin: Registering MaterialX extension for", url);
-        addPluginForThree(loader, {
+        _useNeedleMaterialX(loader, {
             cacheKey: url,
             parameters: {
                 precision: context.renderer.capabilities.getMaxPrecision("highp") as MaterialParameters["precision"],
@@ -38,6 +38,6 @@ export class MaterialXLoaderPlugin implements INeedleGLTFExtensionPlugin {
 /**
  * Add the MaterialXLoaderPlugin to the Needle Engine.
  */
-export async function addPluginForNeedleEngine() {
+export async function useNeedleMaterialX() {
     addCustomExtensionPlugin(new MaterialXLoaderPlugin());
 }

package/src/loader/loader.three.ts

@@ -309,9 +309,9 @@ export class MaterialXLoader implements GLTFLoaderPlugin {
 
 
 /**
- * Add the MaterialXLoaderPlugin to the Needle Engine.
+ * Add the MaterialXLoader to the GLTFLoader instance.
  */
-export function addPluginForThree(loader: GLTFLoader, options?: MaterialXLoaderOptions, context?: MaterialXContext) {
+export function useNeedleMaterialX(loader: GLTFLoader, options?: MaterialXLoaderOptions, context?: MaterialXContext) {
     loader.register(p => {
         const loader = new MaterialXLoader(p, options || {}, context || {});
         return loader;