Fix ContactShadowGroundPlugin, Fix for dependency updates, add some docs for dropzone options, add lib exports to package.json.

.idea/threepipe.iml

@@ -7,6 +7,11 @@
       <excludeFolder url="file://$MODULE_DIR$/tmp" />
       <excludeFolder url="file://$MODULE_DIR$/docs" />
       <excludeFolder url="file://$MODULE_DIR$/dist" />
+      <excludeFolder url="file://$MODULE_DIR$/lib" />
+      <excludeFolder url="file://$MODULE_DIR$/plugins/extra-importers/docs" />
+      <excludeFolder url="file://$MODULE_DIR$/plugins/blueprintjs/docs" />
+      <excludeFolder url="file://$MODULE_DIR$/plugins/tweakpane/docs" />
+      <excludeFolder url="file://$MODULE_DIR$/website/.vitepress/cache" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />

examples/tweakpane-editor/script.ts

@@ -65,7 +65,7 @@ import {GaussianSplattingPlugin} from '@threepipe/plugin-gaussian-splatting'
 import {MaterialConfiguratorPlugin, SwitchNodePlugin} from '@threepipe/plugin-configurator'
 import {AWSClientPlugin, TransfrSharePlugin} from '@threepipe/plugin-network'
 import {GLTFDracoExportPlugin} from '@threepipe/plugin-gltf-transform'
-// @ts-expect-error todo fix
+// @ts-expect-error todo fix import
 import {BloomPlugin, DepthOfFieldPlugin, SSContactShadowsPlugin, SSReflectionPlugin, TemporalAAPlugin, VelocityBufferPlugin} from '@threepipe/webgi-plugins'
 
 function checkQuery(key: string, def = true) {
@@ -86,6 +86,8 @@ async function init() {
         // set it to true if you only have opaque objects in the scene to get better performance.
         zPrepass: checkQuery('depthPrepass', checkQuery('zPrepass', false)),
         dropzone: {
+            autoImport: true,
+            autoAdd: true,
             addOptions: {
                 clearSceneObjects: false, // clear the scene before adding new objects on drop.
             },
@@ -173,7 +175,6 @@ async function init() {
     // disable fading on update
     viewer.getPlugin(FrameFadePlugin)!.isEditor = true
 
-
     viewer.getPlugin(TemporalAAPlugin)!.stableNoise = true
 
     const rt = viewer.getOrAddPluginSync(RenderTargetPreviewPlugin)

package-lock.json

@@ -1,12 +1,12 @@
 {
   "name": "threepipe",
-  "version": "0.0.34",
+  "version": "0.0.35-dev",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "threepipe",
-      "version": "0.0.34",
+      "version": "0.0.35-dev",
       "license": "Apache-2.0",
       "dependencies": {
         "@types/three": "https://github.com/repalash/three-ts-types/releases/download/v0.153.1002/package.tgz",
@@ -14,7 +14,7 @@
         "@types/wicg-file-system-access": "^2020.9.5",
         "popmotion": "^11.0.5",
         "stats.js": "^0.17.0",
-        "ts-browser-helpers": "^0.16.1",
+        "ts-browser-helpers": "^0.16.2",
         "uiconfig.js": "^0.1.2"
       },
       "devDependencies": {
@@ -47,6 +47,14 @@
       },
       "optionalDependencies": {
         "win-node-env": "^0.6.1"
+      },
+      "peerDependencies": {
+        "three": "https://github.com/repalash/three.js-modded/releases/download/v0.153.1006/package.tgz"
+      },
+      "peerDependenciesMeta": {
+        "three": {
+          "optional": true
+        }
       }
     },
     "node_modules/@75lb/deep-merge": {
@@ -9976,9 +9984,9 @@
       }
     },
     "node_modules/ts-browser-helpers": {
-      "version": "0.16.1",
-      "resolved": "https://registry.npmjs.org/ts-browser-helpers/-/ts-browser-helpers-0.16.1.tgz",
-      "integrity": "sha512-2IWya+H8ahKfrMVNrtu2fjjbCh/Y0NdddOnkuX4lGUc/xF7tFXZfM1eR/XKbGsC8/2VnL7LDj06Agl37EloBLQ==",
+      "version": "0.16.2",
+      "resolved": "https://registry.npmjs.org/ts-browser-helpers/-/ts-browser-helpers-0.16.2.tgz",
+      "integrity": "sha512-4HHBBSML8e8Jve4Gba21gmgu6ARCVTKCnfjf01nV4V/ZEjExW9X5aJiHSyqlV2JWNlD7PQScljgMT0XyamnESA==",
       "license": "MIT",
       "dependencies": {
         "@types/wicg-file-system-access": "^2020.9.5"

package.json

@@ -1,6 +1,6 @@
 {
   "name": "threepipe",
-  "version": "0.0.35-dev",
+  "version": "0.0.35",
   "description": "A 3D viewer framework built on top of three.js in TypeScript with a focus on quality rendering, modularity and extensibility.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -16,6 +16,14 @@
     "./dist/": {
       "import": "./dist/",
       "require": "./dist/"
+    },
+    "./lib": {
+      "import": "./lib/index.js",
+      "types": "./lib/index.d.ts"
+    },
+    "./lib/": {
+      "import": "./lib/",
+      "require": "./lib/"
     }
   },
   "type": "module",
@@ -115,7 +123,7 @@
     "@types/webxr": "^0.5.1",
     "@types/wicg-file-system-access": "^2020.9.5",
     "stats.js": "^0.17.0",
-    "ts-browser-helpers": "^0.16.1",
+    "ts-browser-helpers": "^0.16.2",
     "uiconfig.js": "^0.1.2",
     "popmotion": "^11.0.5"
   },
@@ -130,7 +138,7 @@
   "//": {
     "dependencies": {
       "uiconfig.js": "^0.1.2",
-      "ts-browser-helpers": "^0.16.1",
+      "ts-browser-helpers": "^0.16.2",
       "three": "https://github.com/repalash/three.js-modded/releases/download/v0.153.1006/package.tgz",
       "three-f": "https://github.com/repalash/three.js-modded/archive/refs/tags/v0.153.1006.tar.gz",
       "@types/three": "https://github.com/repalash/three-ts-types/releases/download/v0.153.1002/package.tgz",

plugins/blueprintjs/package-lock.json

@@ -12,7 +12,7 @@
                 "threepipe": "file:./../../src/"
             },
             "devDependencies": {
-                "uiconfig-blueprint": "0.1.0-dev.4"
+                "uiconfig-blueprint": "0.1.0-dev.5"
             }
         },
         "../../src": {},
@@ -380,6 +380,17 @@
                 "node": ">=0.10.0"
             }
         },
+        "node_modules/react-colorful": {
+            "version": "5.6.1",
+            "resolved": "https://registry.npmjs.org/react-colorful/-/react-colorful-5.6.1.tgz",
+            "integrity": "sha512-1exovf0uGTGyq5mXQT0zgQ80uvj2PCwvF8zY1RN9/vbJVSjSo3fsB/4L3ObbF7u70NduSiK4xu4Y6q1MHoUGEw==",
+            "dev": true,
+            "license": "MIT",
+            "peerDependencies": {
+                "react": ">=16.8.0",
+                "react-dom": ">=16.8.0"
+            }
+        },
         "node_modules/react-dom": {
             "version": "18.3.1",
             "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz",
@@ -510,9 +521,9 @@
             "link": true
         },
         "node_modules/ts-browser-helpers": {
-            "version": "0.16.1",
-            "resolved": "https://registry.npmjs.org/ts-browser-helpers/-/ts-browser-helpers-0.16.1.tgz",
-            "integrity": "sha512-2IWya+H8ahKfrMVNrtu2fjjbCh/Y0NdddOnkuX4lGUc/xF7tFXZfM1eR/XKbGsC8/2VnL7LDj06Agl37EloBLQ==",
+            "version": "0.16.2",
+            "resolved": "https://registry.npmjs.org/ts-browser-helpers/-/ts-browser-helpers-0.16.2.tgz",
+            "integrity": "sha512-4HHBBSML8e8Jve4Gba21gmgu6ARCVTKCnfjf01nV4V/ZEjExW9X5aJiHSyqlV2JWNlD7PQScljgMT0XyamnESA==",
             "dev": true,
             "license": "MIT",
             "dependencies": {
@@ -530,16 +541,17 @@
             "license": "0BSD"
         },
         "node_modules/uiconfig-blueprint": {
-            "version": "0.1.0-dev.4",
-            "resolved": "https://registry.npmjs.org/uiconfig-blueprint/-/uiconfig-blueprint-0.1.0-dev.4.tgz",
-            "integrity": "sha512-ugXTrrLbkCkWoI7DLBXDZl4JrmIQwPRe7zfEYov126OOTe8+fpea5okIrl7NtXnUwYlGJ3DRSrF1zrQvzF1Bag==",
+            "version": "0.1.0-dev.5",
+            "resolved": "https://registry.npmjs.org/uiconfig-blueprint/-/uiconfig-blueprint-0.1.0-dev.5.tgz",
+            "integrity": "sha512-ERj0t4MIPa/77ktWxRjar8z9Ke51RlLlR94QftBB009DOm9Hx5BCYaAhrVJVjM3wolLlfCcFbPIbiw0MxyLkWw==",
             "dev": true,
             "license": "Apache-2.0",
             "dependencies": {
                 "@blueprintjs/icons": "^5.11.0",
                 "@blueprintjs/select": "^5.2.2",
                 "blueprint-styler": "^5.0.2",
-                "ts-browser-helpers": "^0.16.1",
+                "react-colorful": "^5.6.1",
+                "ts-browser-helpers": "^0.16.2",
                 "uiconfig.js": "^0.1.2"
             },
             "peerDependencies": {
@@ -549,7 +561,6 @@
                 "@types/three": "^0.152.1",
                 "@types/webxr": "^0.5.10",
                 "react": "^18.2.0",
-                "react-colorful": "^5.6.1",
                 "react-dom": "^18.2.0"
             },
             "peerDependenciesMeta": {
@@ -571,9 +582,6 @@
                 "react": {
                     "optional": true
                 },
-                "react-colorful": {
-                    "optional": true
-                },
                 "react-dom": {
                     "optional": true
                 }

plugins/blueprintjs/package.json

@@ -3,7 +3,7 @@
     "description": "Blueprint.js UI Plugin for ThreePipe",
     "version": "0.3.0",
     "devDependencies": {
-        "uiconfig-blueprint": "0.1.0-dev.4"
+        "uiconfig-blueprint": "0.1.0-dev.5"
     },
     "dependencies": {
         "threepipe": "file:./../../src/"
@@ -63,7 +63,7 @@
         "replace": {
             "dependencies": {},
             "peerDependencies": {
-                "threepipe": "^0.0.34"
+                "threepipe": "^0.0.35"
             }
         }
     },

plugins/blueprintjs/src/BlueprintJsUiPlugin.ts

@@ -32,7 +32,7 @@ export class BlueprintJsUiPlugin extends UiConfigRendererBlueprint implements IV
 
     protected _viewer?: ThreeViewer
 
-    private _lastManager?: UndoManagerPlugin['undoManager']
+    private _lastManager?: BlueprintJsUiPlugin['undoManager']
 
     onAdded(viewer: ThreeViewer): void {
         this._viewer = viewer
@@ -41,11 +41,12 @@ export class BlueprintJsUiPlugin extends UiConfigRendererBlueprint implements IV
         viewer.addEventListener('preFrame', this._preFrame)
         viewer.addEventListener('postFrame', this._postFrame)
         const undo = viewer.getOrAddPluginSync(UndoManagerPlugin) // yes, manual dependency
-        if (undo?.undoManager) {
+        const manager = undo?.undoManager
+        if (manager) {
             this._lastManager?.dispose()
             this._lastManager = this.undoManager
-            this.undoManager = undo.undoManager
-            if (this._lastManager) Object.assign(this.undoManager.presets, this._lastManager.presets)
+            this.undoManager = manager
+            if (this._lastManager) Object.assign(manager.presets, this._lastManager.presets)
         }
     }
     onRemove(viewer: ThreeViewer): void {

plugins/gaussian-splatting/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@threepipe/plugin-gaussian-splatting",
     "description": "Gaussian Splatting for Threepipe",
-    "version": "0.2.2",
+    "version": "0.2.3",
     "devDependencies": {
         "comlink": "^4.4.1",
         "@types/emscripten": "^1.39.10"
@@ -31,7 +31,7 @@
         "replace": {
             "dependencies": {},
             "peerDependencies": {
-                "threepipe": "^0.0.23"
+                "threepipe": "^0.0.35"
             }
         }
     },

plugins/gaussian-splatting/src/three-gaussian-splat/geometry/GaussianSplatGeometry.ts

@@ -30,6 +30,7 @@ export class GaussianSplatGeometry extends InstancedBufferGeometry implements IG
     readonly isGaussianSplatGeometry = true
 
     assetType: 'geometry' // dont set the value here since its checked in upgradeGeometry
+    center2 = iGeometryCommons.center2
     setDirty = iGeometryCommons.setDirty
     refreshUi = iGeometryCommons.refreshUi
     appliedMeshes = new Set<IObject3D>()

src/assetmanager/IAssetImporter.ts

@@ -116,15 +116,26 @@ export interface ProcessRawOptions {
 }
 
 export interface LoadFileOptions {
-    fileHandler?: any, // custom {@link ILoader} for the file
+    /**
+     * The custom {@link ILoader} to use for the file. If not specified, the importer will try to determine the loader from the file extension.
+     */
+    fileHandler?: any,
     /**
      * Query string to add to the url. Default = undefined
      */
     queryString?: string,
-    rootPath?: string, // internal use
+    /**
+     * for internal use
+     */
+    rootPath?: string,
 }
 
-export interface ImportFilesOptions extends ProcessRawOptions, LoadFileOptions {allowedExtensions?: string[]}
+export interface ImportFilesOptions extends ProcessRawOptions, LoadFileOptions {
+    /**
+     * Allowed file extensions. If undefined, all files are allowed.
+     */
+    allowedExtensions?: string[]
+}
 
 export interface ImportAssetOptions extends ProcessRawOptions, LoadFileOptions {
     /**

src/core/geometry/BufferGeometry2.ts

@@ -5,6 +5,7 @@ import type {IObject3D} from '../IObject'
 
 export class BufferGeometry2<Attributes extends NormalOrGLBufferAttributes = NormalBufferAttributes> extends BufferGeometry<Attributes, IGeometryEvent, IGeometryEventTypes> implements IGeometry<Attributes> {
     assetType: 'geometry' // dont set the value here since its checked in upgradeGeometry
+    center2 = iGeometryCommons.center2
     setDirty = iGeometryCommons.setDirty
     refreshUi = iGeometryCommons.refreshUi
     appliedMeshes = new Set<IObject3D>()

src/plugins/base/BaseGroundPlugin.ts

@@ -261,14 +261,12 @@ export class BaseGroundPlugin<TEvent extends string = ''> extends AViewerPluginS
         return material
     }
 
-    protected _refreshMaterial(): boolean {
-        if (!this._viewer) return false
-        if (this.isDisabled()) return false
-        const mat = this._material ?? this._createMaterial()
-        const isNewMaterial = this._mesh.material !== this._material
-        if (isNewMaterial) { // new material
+    protected _refreshMaterial() {
+        if (!this._viewer) return
+        if (this.isDisabled()) return
+        if (!this._material) { // new material
             // this._removeMaterial()
-            this._material = mat
+            this._material = this._createMaterial()
             // const id = this._material?.uuid
             // if (!id) console.warn('No material found for ground')
             this._viewer.scene.setDirty()
@@ -301,7 +299,7 @@ export class BaseGroundPlugin<TEvent extends string = ''> extends AViewerPluginS
             // }
         }
         this._viewer.setDirty(this) // todo: something else also?
-        return isNewMaterial
+        return
     }
 
     get material() {

src/plugins/extras/ContactShadowGroundPlugin.ts

@@ -1,4 +1,4 @@
-import {onChange, serialize} from 'ts-browser-helpers'
+import {getOrCall, onChange, serialize} from 'ts-browser-helpers'
 import {
     BasicDepthPacking,
     Color,
@@ -20,6 +20,7 @@ import {IRenderTarget} from '../../rendering'
 import {uiPanelContainer, uiSlider, uiToggle} from 'uiconfig.js'
 import {HVBlurHelper} from '../../three/utils/HVBlurHelper'
 import {shaderReplaceString} from '../../utils'
+import {PhysicalMaterial} from '../../core'
 
 @uiPanelContainer('Contact Shadow Ground')
 export class ContactShadowGroundPlugin extends BaseGroundPlugin {
@@ -91,7 +92,7 @@ export class ContactShadowGroundPlugin extends BaseGroundPlugin {
     }
 
     onRemove(viewer: ThreeViewer): void {
-        const target = this._depthPass?.target
+        const target = getOrCall(this._depthPass?.target)
         if (target) this._viewer?.renderManager.disposeTarget(target)
         this._depthPass?.dispose()
         this._depthPass = undefined
@@ -115,7 +116,10 @@ export class ContactShadowGroundPlugin extends BaseGroundPlugin {
         this._depthPass.camera = this.shadowCamera
         this._depthPass.render(this._viewer.renderManager.renderer, null)
 
-        const blurTarget = this._viewer.renderManager.getTempTarget<IRenderTarget&WebGLRenderTarget>({
+        const target = getOrCall(this._depthPass.target)
+        if (!target) return
+        
+        const blurTarget = this._viewer.renderManager.getTempTarget<IRenderTarget & WebGLRenderTarget>({
             type: UnsignedByteType,
             format: RGBAFormat,
             colorSpace: NoColorSpace,
@@ -126,12 +130,9 @@ export class ContactShadowGroundPlugin extends BaseGroundPlugin {
             magFilter: LinearFilter,
             // isAntialiased: this._viewer.isAntialiased,
         })
-
-        this._blurHelper.blur(this._depthPass.target.texture, this._depthPass.target, blurTarget, this.blurAmount / 256)
-        this._blurHelper.blur(this._depthPass.target.texture, this._depthPass.target, blurTarget, 0.4 * this.blurAmount / 256)
-
+        this._blurHelper.blur(target.texture, target, blurTarget, this.blurAmount / 256)
+        this._blurHelper.blur(target.texture, target, blurTarget, 0.4 * this.blurAmount / 256)
         this._viewer.renderManager.releaseTempTarget(blurTarget)
-
     }
 
     protected _refreshTransform() {
@@ -164,7 +165,9 @@ export class ContactShadowGroundPlugin extends BaseGroundPlugin {
 
     protected _removeMaterial() {
         if (!this._material) return
-        // todo: remove map or render target thats assigned
+        this._material.alphaMap = null
+        if (this._material.userData.ssreflDisabled) delete this._material.userData.ssreflDisabled
+        if (this._material.userData.ssreflNonPhysical) delete this._material.userData.ssreflNonPhysical
         super._removeMaterial()
     }
 
@@ -174,24 +177,24 @@ export class ContactShadowGroundPlugin extends BaseGroundPlugin {
         super.refresh()
     }
 
-    protected _refreshMaterial(): boolean {
+    protected _createMaterial(material?: PhysicalMaterial): PhysicalMaterial {
+        const mat = super._createMaterial(material)
+        mat.roughness = 1
+        mat.metalness = 0
+        mat.color.set(0x111111)
+        mat.transparent = true
+        mat.userData.ssreflDisabled = true
+        mat.userData.ssreflNonPhysical = false
+        // mat.userData.inverseAlphaMap = false // this must be false, if getting inverted colors, check clear color of gbuffer render pass.
+        return mat
+    }
+
+    protected _refreshMaterial() {
         if (!this._viewer) return false
         const isNewMaterial = super._refreshMaterial()
         if (!this._material) return isNewMaterial
-        this._material.alphaMap = this._depthPass?.target.texture || null
-
-        if (isNewMaterial) {
-            this._material.roughness = 1
-            this._material.metalness = 0
-            this._material.color.set(0x111111)
-            this._material.transparent = true
-            this._material.userData.ssreflDisabled = true // todo: unset this in remove material.
-            this._material.userData.ssreflNonPhysical = false
-            // this._material.materialObject.userData.inverseAlphaMap = false // this must be false, if getting inverted colors, check clear color of gbuffer render pass.
-        }
-
+        this._material.alphaMap = getOrCall(this._depthPass?.target)?.texture || null
         return isNewMaterial
-
     }
 
 }

src/plugins/interaction/DropzonePlugin.ts

@@ -7,11 +7,32 @@ import type {AddAssetOptions, ImportFilesOptions, ImportResult} from '../../asse
 import {serialize} from 'ts-browser-helpers'
 
 export interface DropzonePluginOptions {
+    /**
+     * The DOM element to attach the dropzone to.
+     */
     domElement?: HTMLElement
+    /**
+     * Allowed file extensions. If undefined, all files are allowed.
+     */
     allowedExtensions?: string[]
+    /**
+     * Automatically import assets when dropped.
+     * @default true
+     */
     autoImport?: boolean
+    /**
+     * Automatically add dropped and imported assets to the scene.
+     * Works only if {@link autoImport} is true.
+     * @default true
+     */
     autoAdd?: boolean
+    /**
+     * Import options for the {@link AssetImporter.importFiles}, used when importing files.
+     */
     importOptions?: ImportFilesOptions
+    /**
+     * Add options for the {@link RootScene.addObject}, used when adding assets to the scene.
+     */
     addOptions?: AddAssetOptions
 }
 

src/viewer/version.ts

@@ -1 +1 @@
-export const VERSION = '0.0.34'
+export const VERSION = '0.0.35-dev'