I want to animate the position of this object using tweening, and once the animation is complete, fade it out. Currently, I am just hiding it when the animation finishes.
this.tweenBox2.onUpdate(function ()
{
that.box.position = a;
that.box.Show();
});
this.tweenBox2.onComplete(function () {
for (var i = 0; i < that.box.children.length; i++) {
that.box.children[i].visible = false;
}
that.box.position = new THREE.Vector3().copy(storagePos);
});
Here is what is inside box.children[0]
THREE.Mesh
webglActive : true __webglInit : true _modelViewMatrix : THREE.Matrix4 _normalMatrix : THREE.Matrix3 castShadow : false children : Array[0] eulerOrder : (...) frustumCulled : true geometry : THREE.Geometry id : 4672 material : THREE.MeshLambertMaterial matrix : THREE.Matrix4 matrixAutoUpdate : true matrixWorld : THREE.Matrix4 matrixWorldNeedsUpdate : false name : "" parent : Box position : THREE.Vector3 quaternion : THREE.Quaternion receiveShadow : false renderDepth : null rotation : THREE.Euler rotationAutoUpdate : true scale : THREE.Vector3 up : THREE.Vector3 useQuaternion : (...) userData : Object uuid : "9C6DC789-20D0-4F9F-88B6-CDA9A2C372B9" visible : true __proto : THREE.Object3D
The material is created in the following manner:
var box = boxModel.scene.children[3].children[0].clone();
box.traverse(function (child)
{
if (child instanceof THREE.Mesh)
{
child.material = child.material.clone();
}
});