пре 2 година · e79cbca3e4
--- a/README.md
+++ b/README.md
@@ -217,6 +217,7 @@ Plugins can add additional formats:
 * Models
  * 3dm - Using [Rhino3dmLoadPlugin](#Rhino3dmLoadPlugin)
  * ply - Using [PLYLoadPlugin](#PLYLoadPlugin)
  * usdz - Using [USDZLoadPlugin](#USDZLoadPlugin)
  * stl - Using [STLLoadPlugin](#STLLoadPlugin)
  * ktx - Using [KTXLoadPlugin](#KTXLoadPlugin)
  * ktx2 - Using [KTX2LoadPlugin](#KTX2LoadPlugin)
@@ -2262,6 +2263,24 @@ viewer.addPluginSync(new PLYLoadPlugin())
 const mesh = await viewer.load('file.ply')
 ```

 ## USDZLoadPlugin

 Example: https://threepipe.org/examples/#usdz-load/

 Source Code: [src/plugins/import/USDZLoadPlugin.ts](./src/plugins/import/USDZLoadPlugin.ts)

 API Reference: [USDZLoadPlugin](https://threepipe.org/docs/classes/USDZLoadPlugin.html)

 Adds support for loading .usdz and .usda ([Universal Scene Description](https://graphics.pixar.com/usd/docs/index.html)) files.

 ```typescript
 import {USDZLoadPlugin} from 'threepipe'
 viewer.addPluginSync(new USDZLoadPlugin())

 const mesh = await viewer.load('file.usdz')
 const mesh2 = await viewer.load('file.usda')
 ```

 ## STLLoadPlugin

 Example: https://threepipe.org/examples/#stl-load/
--- a/examples/index.html
+++ b/examples/index.html
@@ -244,6 +244,7 @@
            <li><a href="./hdr-load/">HDR Load </a></li>
            <li><a href="./exr-load/">EXR Load </a></li>
            <li><a href="./image-load/">Image(png, jpeg, svg, ico, webp, avif) Load </a></li>
            <li><a href="./usdz-load/">USDZ, USDA Load </a></li>
            <li><a href="./ply-load/">PLY Load </a></li>
            <li><a href="./stl-load/">STL Load </a></li>
            <li><a href="./ktx2-load/">KTX2 Load </a></li>
--- a/examples/usdz-load/index.html
+++ b/examples/usdz-load/index.html
@@ -0,0 +1,35 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <title>USDZ / USDA Load</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- Import maps polyfill -->
    <!-- Remove this when import maps will be widely supported -->
    <script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>

    <script type="importmap">
    {
        "imports": {
          "threepipe": "./../../dist/index.mjs"
        }
    }

    </script>
    <style id="example-style">
        html, body, #canvas-container, #mcanvas {
            width: 100%;
            height: 100%;
            margin: 0;
            overflow: hidden;
        }
    </style>
    <script type="module" src="../examples-utils/simple-code-preview.mjs"></script>
    <script id="example-script" type="module" src="./script.js" data-scripts="./script.ts;./script.js"></script>
 </head>
 <body>
 <div id="canvas-container">
    <canvas id="mcanvas"></canvas>
 </div>

 </body>
--- a/examples/usdz-load/script.ts
+++ b/examples/usdz-load/script.ts
@@ -0,0 +1,31 @@
 import {_testFinish, IObject3D, ThreeViewer, USDZLoadPlugin} from 'threepipe'

 async function init() {

    const viewer = new ThreeViewer({
        canvas: document.getElementById('mcanvas') as HTMLCanvasElement,
        msaa: true,
        dropzone: {
            allowedExtensions: ['usdz', 'usda', 'hdr', 'exr'],
            addOptions: {
                disposeSceneObjects: true,
                autoSetEnvironment: true, // when hdr is dropped
                autoSetBackground: true,
            },
        },
    })

    viewer.addPluginSync(USDZLoadPlugin)

    const options = {
        autoCenter: true,
        autoScale: true,
    }
    await Promise.all([
        viewer.setEnvironmentMap('https://threejs.org/examples/textures/equirectangular/venice_sunset_1k.hdr'),
        viewer.load<IObject3D>('https://threejs.org/examples/models/usdz/saeukkang.usdz', options),
    ])

 }

 init().then(_testFinish)
--- a/src/plugins/import/USDZLoadPlugin.ts
+++ b/src/plugins/import/USDZLoadPlugin.ts
@@ -0,0 +1,50 @@
 import {IViewerPluginSync, ThreeViewer} from '../../viewer'
 import {Importer} from '../../assetmanager'
 import {USDZLoader} from 'three/examples/jsm/loaders/USDZLoader.js'
 import {Group, Mesh} from 'three'
 import {Zippable, zipSync} from 'three/examples/jsm/libs/fflate.module.js'

 /**
 * Adds support for loading `.usdz`, `model/vnd.usd+zip` and `.usda`, `model/vnd.usda` files and data uris
 * @category Plugins
 */
 export class USDZLoadPlugin implements IViewerPluginSync {
    declare ['constructor']: typeof USDZLoadPlugin

    public static readonly PluginType = 'USDZLoadPlugin'
    private _importer = new Importer(class extends USDZLoader {
        private _currentUrl = ''
        async loadAsync(url: string, onProgress?: (event: ProgressEvent) => void): Promise<Mesh> {
            this._currentUrl = url
            const res = await super.loadAsync(url, onProgress)
            this._currentUrl = ''
            return res
        }

        parse(buffer: ArrayBuffer): Group {
            // todo make changes in three.js to allow passing unzipped buffer directly for usda
            if (this._currentUrl.endsWith('.usda')) {
                const filename = this._currentUrl.split('/').pop()
                if (filename) {
                    const zip: Zippable = {}
                    zip[filename] = new Uint8Array(buffer)
                    buffer = zipSync(zip).buffer
                }
            }
            return super.parse(buffer)
        }
    }, ['usdz', 'usda'], ['model/vnd.usd+zip', 'model/vnd.usdz+zip', 'model/vnd.usda'], false)

    onAdded(viewer: ThreeViewer) {
        viewer.assetManager.importer.addImporter(this._importer)
    }

    onRemove(viewer: ThreeViewer) {
        viewer.assetManager.importer.removeImporter(this._importer)
    }

    dispose() {
        return
    }

 }
--- a/src/plugins/index.ts
+++ b/src/plugins/index.ts
@@ -22,6 +22,7 @@ export {FullScreenPlugin} from './interaction/FullScreenPlugin'

 // import
 export {Rhino3dmLoadPlugin} from './import/Rhino3dmLoadPlugin'
 export {USDZLoadPlugin} from './import/USDZLoadPlugin'
 export {PLYLoadPlugin} from './import/PLYLoadPlugin'
 export {STLLoadPlugin} from './import/STLLoadPlugin'
 export {KTXLoadPlugin} from './import/KTXLoadPlugin'