super-three 0.176.0 → 0.177.0

package/examples/jsm/Addons.js

@@ -28,7 +28,6 @@ export * from './effects/AnaglyphEffect.js';
 export * from './effects/AsciiEffect.js';
 export * from './effects/OutlineEffect.js';
 export * from './effects/ParallaxBarrierEffect.js';
-export * from './effects/PeppersGhostEffect.js';
 export * from './effects/StereoEffect.js';
 
 export * from './environments/DebugEnvironment.js';

package/examples/jsm/animation/AnimationClipCreator.js

@@ -11,6 +11,7 @@ import {
  * A utility class with factory methods for creating basic animation clips.
  *
  * @hideconstructor
+ * @three_import import { AnimationClipCreator } from 'three/addons/animation/AnimationClipCreator.js';
  */
 class AnimationClipCreator {
 

package/examples/jsm/animation/CCDIKSolver.js

@@ -13,7 +13,7 @@ import {
 	Vector3
 } from 'three';
 
-const _q = new Quaternion();
+const _quaternion = new Quaternion();
 const _targetPos = new Vector3();
 const _targetVec = new Vector3();
 const _effectorPos = new Vector3();
@@ -29,6 +29,8 @@ const _matrix = new Matrix4();
  * This class solves the Inverse Kinematics Problem with a [CCD Algorithm]{@link https://web.archive.org/web/20221206080850/https://sites.google.com/site/auraliusproject/ccd-algorithm}.
  *
  * `CCDIKSolver` is designed to work with instances of {@link SkinnedMesh}.
+ *
+ * @three_import import { CCDIKSolver } from 'three/addons/animation/CCDIKSolver.js';
  */
 class CCDIKSolver {
 
@@ -192,8 +194,8 @@ class CCDIKSolver {
 				_axis.crossVectors( _effectorVec, _targetVec );
 				_axis.normalize();
 
-				_q.setFromAxisAngle( _axis, angle );
-				link.quaternion.multiply( _q );
+				_quaternion.setFromAxisAngle( _axis, angle );
+				link.quaternion.multiply( _quaternion );
 
 				// TODO: re-consider the limitation specification
 				if ( limitation !== undefined ) {
@@ -322,6 +324,7 @@ function setPositionOfBoneToAttributeArray( array, index, bone, matrixWorldInv )
  * Helper for visualizing IK bones.
  *
  * @augments Object3D
+ * @three_import import { CCDIKHelper } from 'three/addons/animation/CCDIKSolver.js';
  */
 class CCDIKHelper extends Object3D {
 

package/examples/jsm/capabilities/WebGL.js

@@ -2,6 +2,7 @@
  * A utility module with basic WebGL 2 capability testing.
  *
  * @hideconstructor
+ * @three_import import WebGL from 'three/addons/capabilities/WebGL.js';
  */
 class WebGL {
 

package/examples/jsm/capabilities/WebGPU.js

@@ -10,6 +10,7 @@ if ( typeof window !== 'undefined' && isAvailable ) {
  * A utility module with basic WebGPU capability testing.
  *
  * @hideconstructor
+ * @three_import import WebGPU from 'three/addons/capabilities/WebGPU.js';
  */
 class WebGPU {
 

package/examples/jsm/controls/ArcballControls.js

@@ -96,7 +96,7 @@ const _EPS = 0.000001;
  * Arcball controls allow the camera to be controlled by a virtual trackball with full touch support and advanced navigation functionality.
  * Cursor/finger positions and movements are mapped over a virtual trackball surface represented by a gizmo and mapped in intuitive and
  * consistent camera movements. Dragging cursor/fingers will cause camera to orbit around the center of the trackball in a conservative
- * way (returning to the starting point will make the camera to return to its starting orientation).
+ * way (returning to the starting point will make the camera return to its starting orientation).
  *
  * In addition to supporting pan, zoom and pinch gestures, Arcball controls provide focus< functionality with a double click/tap for intuitively
  * moving the object's point of interest in the center of the virtual trackball. Focus allows a much better inspection and navigation in complex
@@ -107,6 +107,7 @@ const _EPS = 0.000001;
  * animation loop when animations are on.
  *
  * @augments Controls
+ * @three_import import { ArcballControls } from 'three/addons/controls/ArcballControls.js';
  */
 class ArcballControls extends Controls {
 
@@ -195,6 +196,7 @@ class ArcballControls extends Controls {
 		this._farPos0 = 0;
 		this._cameraMatrixState0 = new Matrix4();
 		this._gizmoMatrixState0 = new Matrix4();
+		this._target0 = new Vector3();
 
 		//pointers array
 		this._button = - 1;
@@ -2228,6 +2230,7 @@ class ArcballControls extends Controls {
 	 */
 	reset() {
 
+		this.target.copy( this._target0 );
 		this.object.zoom = this._zoom0;
 
 		if ( this.object.isPerspectiveCamera ) {
@@ -2300,7 +2303,8 @@ class ArcballControls extends Controls {
 					cameraNear: this.object.near,
 					cameraUp: this.object.up,
 					cameraZoom: this.object.zoom,
-					gizmoMatrix: this._gizmos.matrix
+					gizmoMatrix: this._gizmos.matrix,
+					target: this.target
 
 				}
 			} );
@@ -2315,7 +2319,8 @@ class ArcballControls extends Controls {
 					cameraNear: this.object.near,
 					cameraUp: this.object.up,
 					cameraZoom: this.object.zoom,
-					gizmoMatrix: this._gizmos.matrix
+					gizmoMatrix: this._gizmos.matrix,
+					target: this.target
 
 				}
 			} );
@@ -2346,6 +2351,10 @@ class ArcballControls extends Controls {
 	 */
 	saveState() {
 
+		this.object.updateMatrix();
+		this._gizmos.updateMatrix();
+
+		this._target0.copy( this.target );
 		this._cameraMatrixState0.copy( this.object.matrix );
 		this._gizmoMatrixState0.copy( this._gizmos.matrix );
 		this._nearPos = this.object.near;
@@ -2946,6 +2955,8 @@ class ArcballControls extends Controls {
 
 		if ( state.arcballState != undefined ) {
 
+			this.target.fromArray( state.arcballState.target );
+
 			this._cameraMatrixState.fromArray( state.arcballState.cameraMatrix.elements );
 			this._cameraMatrixState.decompose( this.object.position, this.object.quaternion, this.object.scale );
 

package/examples/jsm/controls/DragControls.js

@@ -52,6 +52,7 @@ const STATE = {
  * ```
  *
  * @augments Controls
+ * @three_import import { DragControls } from 'three/addons/controls/DragControls.js';
  */
 class DragControls extends Controls {
 

package/examples/jsm/controls/FirstPersonControls.js

@@ -14,6 +14,7 @@ const _targetPosition = new Vector3();
  * This class is an alternative implementation of {@link FlyControls}.
  *
  * @augments Controls
+ * @three_import import { FirstPersonControls } from 'three/addons/controls/FirstPersonControls.js';
  */
 class FirstPersonControls extends Controls {
 

package/examples/jsm/controls/FlyControls.js

@@ -21,6 +21,7 @@ const _tmpQuaternion = new Quaternion();
  * (e.g. focus on a specific target).
  *
  * @augments Controls
+ * @three_import import { FlyControls } from 'three/addons/controls/FlyControls.js';
  */
 class FlyControls extends Controls {
 

package/examples/jsm/controls/MapControls.js

@@ -12,6 +12,7 @@ import { OrbitControls } from './OrbitControls.js';
  * - Pan: Left mouse, or arrow keys / touch: one-finger move.
  *
  * @augments OrbitControls
+ * @three_import import { MapControls } from 'three/addons/controls/MapControls.js';
  */
 class MapControls extends OrbitControls {
 

package/examples/jsm/controls/OrbitControls.js

@@ -83,6 +83,7 @@ const _EPS = 0.000001;
  * ```
  *
  * @augments Controls
+ * @three_import import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
  */
 class OrbitControls extends Controls {
 

package/examples/jsm/controls/PointerLockControls.js

@@ -31,6 +31,7 @@ const _lockEvent = { type: 'lock' };
  */
 const _unlockEvent = { type: 'unlock' };
 
+const _MOUSE_SENSITIVITY = 0.002;
 const _PI_2 = Math.PI / 2;
 
 /**
@@ -55,6 +56,7 @@ const _PI_2 = Math.PI / 2;
  * ```
  *
  * @augments Controls
+ * @three_import import { PointerLockControls } from 'three/addons/controls/PointerLockControls.js';
  */
 class PointerLockControls extends Controls {
 
@@ -200,7 +202,7 @@ class PointerLockControls extends Controls {
 
 	/**
 	 * Activates the pointer lock.
-	 * 
+	 *
 	 * @param {boolean} [unadjustedMovement=false] - Disables OS-level adjustment for mouse acceleration, and accesses raw mouse input instead.
 	 * Setting it to true will disable mouse acceleration.
 	 */
@@ -232,8 +234,8 @@ function onMouseMove( event ) {
 	const camera = this.object;
 	_euler.setFromQuaternion( camera.quaternion );
 
-	_euler.y -= event.movementX * 0.002 * this.pointerSpeed;
-	_euler.x -= event.movementY * 0.002 * this.pointerSpeed;
+	_euler.y -= event.movementX * _MOUSE_SENSITIVITY * this.pointerSpeed;
+	_euler.x -= event.movementY * _MOUSE_SENSITIVITY * this.pointerSpeed;
 
 	_euler.x = Math.max( _PI_2 - this.maxPolarAngle, Math.min( _PI_2 - this.minPolarAngle, _euler.x ) );
 

package/examples/jsm/controls/TrackballControls.js

@@ -51,6 +51,7 @@ const _moveDirection = new Vector3();
  * to stay "right side up".
  *
  * @augments Controls
+ * @three_import import { TrackballControls } from 'three/addons/controls/TrackballControls.js';
  */
 class TrackballControls extends Controls {
 

package/examples/jsm/controls/TransformControls.js

@@ -72,6 +72,7 @@ const _objectChangeEvent = { type: 'objectChange' };
  * `TransformControls` expects that its attached 3D object is part of the scene graph.
  *
  * @augments Controls
+ * @three_import import { TransformControls } from 'three/addons/controls/TransformControls.js';
  */
 class TransformControls extends Controls {
 

package/examples/jsm/csm/CSM.js

@@ -25,6 +25,8 @@ const _up = new Vector3( 0, 1, 0 );
  *
  * This module can only be used with {@link WebGLRenderer}. When using {@link WebGPURenderer},
  * use {@link CSMShadowNode} instead.
+ *
+ * @three_import import { CSM } from 'three/addons/csm/CSM.js';
  */
 export class CSM {
 

package/examples/jsm/csm/CSMFrustum.js

@@ -4,6 +4,8 @@ const inverseProjectionMatrix = new Matrix4();
 
 /**
  * Represents the frustum of a CSM instance.
+ *
+ * @three_import import { CSMFrustum } from 'three/addons/csm/CSMFrustum.js';
  */
 class CSMFrustum {
 

package/examples/jsm/csm/CSMHelper.js

@@ -16,6 +16,7 @@ import {
  * A helper for visualizing the cascades of a CSM instance.
  *
  * @augments Group
+ * @three_import import { CSMHelper } from 'three/addons/csm/CSMHelper.js';
  */
 class CSMHelper extends Group {
 

package/examples/jsm/csm/CSMShader.js

@@ -1,6 +1,9 @@
 import { ShaderChunk } from 'three';
 
-/** @module CSMShader */
+/**
+ * @module CSMShader
+ * @three_import import { CSMShader } from 'three/addons/csm/CSMShader.js';
+ */
 
 /**
  * The object that holds the GLSL enhancements to enable CSM. This

package/examples/jsm/csm/CSMShadowNode.js

@@ -42,6 +42,7 @@ class LwLight extends Object3D {
  * use {@link CSM} instead.
  *
  * @augments ShadowBaseNode
+ * @three_import import { CSMShadowNode } from 'three/addons/csm/CSMShadowNode.js';
  */
 class CSMShadowNode extends ShadowBaseNode {
 
@@ -162,7 +163,6 @@ class CSMShadowNode extends ShadowBaseNode {
 		this.mainFrustum = new CSMFrustum( data );
 
 		const light = this.light;
-		const parent = light.parent;
 
 		for ( let i = 0; i < this.cascades; i ++ ) {
 
@@ -174,9 +174,6 @@ class CSMShadowNode extends ShadowBaseNode {
 
 			this.lights.push( lwLight );
 
-			parent.add( lwLight );
-			parent.add( lwLight.target );
-
 			lwLight.shadow = lShadow;
 
 			this._shadowNodes.push( shadow( lwLight, lShadow ) );
@@ -502,9 +499,26 @@ class CSMShadowNode extends ShadowBaseNode {
 	updateBefore( /*builder*/ ) {
 
 		const light = this.light;
+		const parent = light.parent;
 		const camera = this.camera;
 		const frustums = this.frustums;
 
+		// make sure the placeholder light objects which represent the
+		// multiple cascade shadow casters are part of the scene graph
+
+		for ( let i = 0; i < this.lights.length; i ++ ) {
+
+			const lwLight = this.lights[ i ];
+
+			if ( lwLight.parent === null ) {
+
+				parent.add( lwLight.target );
+				parent.add( lwLight );
+
+			}
+
+		}
+
 		_lightDirection.subVectors( light.target.position, light.position ).normalize();
 
 		// for each frustum we need to find its min-max box aligned with the light orientation

package/examples/jsm/curves/CurveExtras.js

@@ -17,6 +17,7 @@ import {
  * A Granny Knot curve.
  *
  * @augments Curve
+ * @three_import import { GrannyKnot } from 'three/addons/curves/CurveExtras.js';
  */
 class GrannyKnot extends Curve {
 
@@ -47,6 +48,7 @@ class GrannyKnot extends Curve {
  * A heart curve.
  *
  * @augments Curve
+ * @three_import import { HeartCurve } from 'three/addons/curves/CurveExtras.js';
  */
 class HeartCurve extends Curve {
 
@@ -96,6 +98,7 @@ class HeartCurve extends Curve {
  * A Viviani curve.
  *
  * @augments Curve
+ * @three_import import { VivianiCurve } from 'three/addons/curves/CurveExtras.js';
  */
 class VivianiCurve extends Curve {
 
@@ -146,6 +149,7 @@ class VivianiCurve extends Curve {
  * A knot curve.
  *
  * @augments Curve
+ * @three_import import { KnotCurve } from 'three/addons/curves/CurveExtras.js';
  */
 class KnotCurve extends Curve {
 
@@ -179,6 +183,7 @@ class KnotCurve extends Curve {
  * A helix curve.
  *
  * @augments Curve
+ * @three_import import { HelixCurve } from 'three/addons/curves/CurveExtras.js';
  */
 class HelixCurve extends Curve {
 
@@ -212,6 +217,7 @@ class HelixCurve extends Curve {
  * A Trefoil Knot.
  *
  * @augments Curve
+ * @three_import import { TrefoilKnot } from 'three/addons/curves/CurveExtras.js';
  */
 class TrefoilKnot extends Curve {
 
@@ -261,6 +267,7 @@ class TrefoilKnot extends Curve {
  * A torus knot.
  *
  * @augments Curve
+ * @three_import import { TorusKnot } from 'three/addons/curves/CurveExtras.js';
  */
 class TorusKnot extends Curve {
 
@@ -313,6 +320,7 @@ class TorusKnot extends Curve {
  * A Cinquefoil Knot.
  *
  * @augments Curve
+ * @three_import import { CinquefoilKnot } from 'three/addons/curves/CurveExtras.js';
  */
 class CinquefoilKnot extends Curve {
 
@@ -365,6 +373,7 @@ class CinquefoilKnot extends Curve {
  * A Trefoil Polynomial Knot.
  *
  * @augments Curve
+ * @three_import import { TrefoilPolynomialKnot } from 'three/addons/curves/CurveExtras.js';
  */
 class TrefoilPolynomialKnot extends Curve {
 
@@ -421,6 +430,7 @@ function scaleTo( x, y, t ) {
  * A Figure Eight Polynomial Knot.
  *
  * @augments Curve
+ * @three_import import { FigureEightPolynomialKnot } from 'three/addons/curves/CurveExtras.js';
  */
 class FigureEightPolynomialKnot extends Curve {
 
@@ -470,6 +480,7 @@ class FigureEightPolynomialKnot extends Curve {
  * A Decorated Torus Knot 4a.
  *
  * @augments Curve
+ * @three_import import { DecoratedTorusKnot4a } from 'three/addons/curves/CurveExtras.js';
  */
 class DecoratedTorusKnot4a extends Curve {
 
@@ -519,6 +530,7 @@ class DecoratedTorusKnot4a extends Curve {
  * A Decorated Torus Knot 4b.
  *
  * @augments Curve
+ * @three_import import { DecoratedTorusKnot4b } from 'three/addons/curves/CurveExtras.js';
  */
 class DecoratedTorusKnot4b extends Curve {
 
@@ -568,6 +580,7 @@ class DecoratedTorusKnot4b extends Curve {
  * A Decorated Torus Knot 5a.
  *
  * @augments Curve
+ * @three_import import { DecoratedTorusKnot5a } from 'three/addons/curves/CurveExtras.js';
  */
 class DecoratedTorusKnot5a extends Curve {
 
@@ -617,6 +630,7 @@ class DecoratedTorusKnot5a extends Curve {
  * A Decorated Torus Knot 5c.
  *
  * @augments Curve
+ * @three_import import { DecoratedTorusKnot5c } from 'three/addons/curves/CurveExtras.js';
  */
 class DecoratedTorusKnot5c extends Curve {
 

package/examples/jsm/curves/NURBSCurve.js

@@ -11,6 +11,7 @@ import * as NURBSUtils from '../curves/NURBSUtils.js';
  * Implementation is based on `(x, y [, z=0 [, w=1]])` control points with `w=weight`.
  *
  * @augments Curve
+ * @three_import import { NURBSCurve } from 'three/addons/curves/NURBSCurve.js';
  */
 class NURBSCurve extends Curve {
 

package/examples/jsm/curves/NURBSSurface.js

@@ -7,6 +7,8 @@ import * as NURBSUtils from '../curves/NURBSUtils.js';
  * This class represents a NURBS surface.
  *
  * Implementation is based on `(x, y [, z=0 [, w=1]])` control points with `w=weight`.
+ *
+ * @three_import import { NURBSSurface } from 'three/addons/curves/NURBSSurface.js';
  */
 class NURBSSurface {
 

package/examples/jsm/curves/NURBSUtils.js

@@ -3,7 +3,10 @@ import {
 	Vector4
 } from 'three';
 
-/** @module NURBSUtils */
+/**
+ * @module NURBSUtils
+ * @three_import import * as NURBSUtils from 'three/addons/curves/NURBSUtils.js';
+ */
 
 /**
  * Finds knot vector span.

package/examples/jsm/curves/NURBSVolume.js

@@ -7,6 +7,8 @@ import * as NURBSUtils from '../curves/NURBSUtils.js';
  * This class represents a NURBS volume.
  *
  * Implementation is based on `(x, y [, z=0 [, w=1]])` control points with `w=weight`.
+ *
+ * @three_import import { NURBSVolume } from 'three/addons/curves/NURBSVolume.js';
  */
 class NURBSVolume {
 

package/examples/jsm/effects/AnaglyphEffect.js

@@ -14,6 +14,8 @@ import { FullScreenQuad } from '../postprocessing/Pass.js';
  *
  * Note that this class can only be used with {@link WebGLRenderer}.
  * When using {@link WebGPURenderer}, use {@link AnaglyphPassNode}.
+ *
+ * @three_import import { AnaglyphEffect } from 'three/addons/effects/AnaglyphEffect.js';
  */
 class AnaglyphEffect {
 

package/examples/jsm/effects/AsciiEffect.js

@@ -2,6 +2,8 @@
  * A class that creates an ASCII effect.
  *
  * The ASCII generation is based on [jsascii]{@link https://github.com/hassadee/jsascii/blob/master/jsascii.js}.
+ *
+ * @three_import import { AsciiEffect } from 'three/addons/effects/AsciiEffect.js';
  */
 class AsciiEffect {
 

package/examples/jsm/effects/OutlineEffect.js

@@ -21,6 +21,8 @@ import {
  *
  * }
  * ```
+ *
+ * @three_import import { OutlineEffect } from 'three/addons/effects/OutlineEffect.js';
  */
 class OutlineEffect {
 

package/examples/jsm/effects/ParallaxBarrierEffect.js

@@ -13,6 +13,8 @@ import { FullScreenQuad } from '../postprocessing/Pass.js';
  *
  * Note that this class can only be used with {@link WebGLRenderer}.
  * When using {@link WebGPURenderer}, use {@link ParallaxBarrierPassNode}.
+ *
+ * @three_import import { ParallaxBarrierEffect } from 'three/addons/effects/ParallaxBarrierEffect.js';
  */
 class ParallaxBarrierEffect {
 

package/examples/jsm/effects/StereoEffect.js

@@ -8,6 +8,8 @@ import {
  *
  * Note that this class can only be used with {@link WebGLRenderer}.
  * When using {@link WebGPURenderer}, use {@link StereoPassNode}.
+ *
+ * @three_import import { StereoEffect } from 'three/addons/effects/StereoEffect.js';
  */
 class StereoEffect {
 

package/examples/jsm/environments/DebugEnvironment.js

@@ -26,6 +26,7 @@ import {
  * ```
  *
  * @augments Scene
+ * @three_import import { DebugEnvironment } from 'three/addons/environments/DebugEnvironment.js';
  */
 class DebugEnvironment extends Scene {
 

package/examples/jsm/environments/RoomEnvironment.js

@@ -1,11 +1,13 @@
 import {
  	BackSide,
  	BoxGeometry,
+ 	InstancedMesh,
  	Mesh,
 	MeshBasicMaterial,
  	MeshStandardMaterial,
  	PointLight,
  	Scene,
+ 	Object3D,
 } from 'three';
 
 /**
@@ -26,6 +28,7 @@ import {
  * ```
  *
  * @augments Scene
+ * @three_import import { RoomEnvironment } from 'three/addons/environments/RoomEnvironment.js';
  */
 class RoomEnvironment extends Scene {
 
@@ -48,41 +51,52 @@ class RoomEnvironment extends Scene {
 		room.scale.set( 31.713, 28.305, 28.591 );
 		this.add( room );
 
-		const box1 = new Mesh( geometry, boxMaterial );
-		box1.position.set( - 10.906, 2.009, 1.846 );
-		box1.rotation.set( 0, - 0.195, 0 );
-		box1.scale.set( 2.328, 7.905, 4.651 );
-		this.add( box1 );
-
-		const box2 = new Mesh( geometry, boxMaterial );
-		box2.position.set( - 5.607, - 0.754, - 0.758 );
-		box2.rotation.set( 0, 0.994, 0 );
-		box2.scale.set( 1.970, 1.534, 3.955 );
-		this.add( box2 );
-
-		const box3 = new Mesh( geometry, boxMaterial );
-		box3.position.set( 6.167, 0.857, 7.803 );
-		box3.rotation.set( 0, 0.561, 0 );
-		box3.scale.set( 3.927, 6.285, 3.687 );
-		this.add( box3 );
-
-		const box4 = new Mesh( geometry, boxMaterial );
-		box4.position.set( - 2.017, 0.018, 6.124 );
-		box4.rotation.set( 0, 0.333, 0 );
-		box4.scale.set( 2.002, 4.566, 2.064 );
-		this.add( box4 );
-
-		const box5 = new Mesh( geometry, boxMaterial );
-		box5.position.set( 2.291, - 0.756, - 2.621 );
-		box5.rotation.set( 0, - 0.286, 0 );
-		box5.scale.set( 1.546, 1.552, 1.496 );
-		this.add( box5 );
-
-		const box6 = new Mesh( geometry, boxMaterial );
-		box6.position.set( - 2.193, - 0.369, - 5.547 );
-		box6.rotation.set( 0, 0.516, 0 );
-		box6.scale.set( 3.875, 3.487, 2.986 );
-		this.add( box6 );
+		const boxes = new InstancedMesh( geometry, boxMaterial, 6 );
+		const transform = new Object3D();
+
+		// box1
+		transform.position.set( - 10.906, 2.009, 1.846 );
+		transform.rotation.set( 0, - 0.195, 0 );
+		transform.scale.set( 2.328, 7.905, 4.651 );
+		transform.updateMatrix();
+		boxes.setMatrixAt( 0, transform.matrix );
+
+		// box2
+		transform.position.set( - 5.607, - 0.754, - 0.758 );
+		transform.rotation.set( 0, 0.994, 0 );
+		transform.scale.set( 1.970, 1.534, 3.955 );
+		transform.updateMatrix();
+		boxes.setMatrixAt( 1, transform.matrix );
+
+		// box3
+		transform.position.set( 6.167, 0.857, 7.803 );
+		transform.rotation.set( 0, 0.561, 0 );
+		transform.scale.set( 3.927, 6.285, 3.687 );
+		transform.updateMatrix();
+		boxes.setMatrixAt( 2, transform.matrix );
+
+		// box4
+		transform.position.set( - 2.017, 0.018, 6.124 );
+		transform.rotation.set( 0, 0.333, 0 );
+		transform.scale.set( 2.002, 4.566, 2.064 );
+		transform.updateMatrix();
+		boxes.setMatrixAt( 3, transform.matrix );
+
+		// box5
+		transform.position.set( 2.291, - 0.756, - 2.621 );
+		transform.rotation.set( 0, - 0.286, 0 );
+		transform.scale.set( 1.546, 1.552, 1.496 );
+		transform.updateMatrix();
+		boxes.setMatrixAt( 4, transform.matrix );
+
+		// box6
+		transform.position.set( - 2.193, - 0.369, - 5.547 );
+		transform.rotation.set( 0, 0.516, 0 );
+		transform.scale.set( 3.875, 3.487, 2.986 );
+		transform.updateMatrix();
+		boxes.setMatrixAt( 5, transform.matrix );
+
+		this.add( boxes );
 
 
 		// -x right