SkinnedMesh/Skeleton serialization

src/core/Object3D.js

@@ -594,7 +594,8 @@ Object.assign( Object3D.prototype, EventDispatcher.prototype, {
 				geometries: {},
 				materials: {},
 				textures: {},
-				images: {}
+				images: {},
+				skeletons: {}
 			};
 
 			output.metadata = {
@@ -620,6 +621,11 @@ Object.assign( Object3D.prototype, EventDispatcher.prototype, {
 
 		object.matrix = this.matrix.toArray();
 
+		// SkinnedMesh specific
+
+		if ( this.bindMode !== undefined ) object.bindMode = this.bindMode;
+		if ( this.bindMatrix !== undefined ) object.bindMatrix = this.bindMatrix.toArray();
+
 		//
 
 		function serialize( library, element ) {
@@ -662,6 +668,20 @@ Object.assign( Object3D.prototype, EventDispatcher.prototype, {
 
 		}
 
+		// SkinnedMesh specific
+
+		if ( this.skeleton !== undefined ) {
+
+			if ( meta.skeletons[ this.skeleton.uuid ] === undefined ) {
+
+				meta.skeletons[ this.skeleton.uuid ] = this.skeleton.toJSON( meta );
+
+			}
+
+			object.skeleton = this.skeleton.uuid;
+
+		}
+
 		//
 
 		if ( this.children.length > 0 ) {
@@ -682,11 +702,13 @@ Object.assign( Object3D.prototype, EventDispatcher.prototype, {
 			var materials = extractFromCache( meta.materials );
 			var textures = extractFromCache( meta.textures );
 			var images = extractFromCache( meta.images );
+			var skeletons = extractFromCache( meta.skeletons );
 
 			if ( geometries.length > 0 ) output.geometries = geometries;
 			if ( materials.length > 0 ) output.materials = materials;
 			if ( textures.length > 0 ) output.textures = textures;
 			if ( images.length > 0 ) output.images = images;
+			if ( skeletons.length > 0 ) output.skeletons = skeletons;
 
 		}
 

src/loaders/ObjectLoader.js

@@ -31,6 +31,8 @@ import { LineSegments } from '../objects/LineSegments';
 import { LOD } from '../objects/LOD';
 import { Mesh } from '../objects/Mesh';
 import { SkinnedMesh } from '../objects/SkinnedMesh';
+import { Skeleton } from '../objects/Skeleton';
+import { Bone } from '../objects/Bone';
 import { Fog } from '../scenes/Fog';
 import { FogExp2 } from '../scenes/FogExp2';
 import { HemisphereLight } from '../lights/HemisphereLight';
@@ -136,6 +138,10 @@ Object.assign( ObjectLoader.prototype, {
 
 		var object = this.parseObject( json.object, geometries, materials );
 
+		var skeletons = this.parseSkeletons( json.skeletons, object );
+
+		this.bindSkeletons( object, skeletons );
+
 		if ( json.animations ) {
 
 			object.animations = this.parseAnimations( json.animations );
@@ -519,6 +525,47 @@ Object.assign( ObjectLoader.prototype, {
 
 	},
 
+	parseSkeletons: function ( json, object ) {
+
+		var skeletons = {};
+
+		if ( json === undefined ) return skeletons;
+
+		for ( var i = 0; i < json.length; i ++ ) {
+
+			var skeletonParams = json[ i ];
+
+			var uuid = skeletonParams.uuid;
+			var boneParams = skeletonParams.bones;
+			var boneInverseParams = skeletonParams.boneInverses;
+
+			var bones = [];
+			var boneInverses = [];
+
+			for ( var j = 0, jl = boneParams.length; j < jl; j ++ ) {
+
+				var bone = object.getObjectByProperty( 'uuid', boneParams[ j ] );
+
+				if ( bone === undefined ) {
+
+					console.warn( 'THREE.ObjectLoader: Not found Bone whose uuid is ' + boneParams[ j ] );
+					bone = new Bone();
+
+				}
+
+				bones.push( bone );
+				boneInverses.push( new Matrix4().fromArray( boneInverseParams[ j ] ) );
+
+			}
+
+			skeletons[ uuid ] = new Skeleton( bones, boneInverses );
+
+		}
+
+		return skeletons;
+
+	},
+
 	parseObject: function () {
 
 		var matrix = new Matrix4();
@@ -663,7 +710,33 @@ Object.assign( ObjectLoader.prototype, {
 
 				case 'SkinnedMesh':
 
-					console.warn( 'THREE.ObjectLoader.parseObject() does not support SkinnedMesh yet.' );
+					var geometry = getGeometry( data.geometry );
+					var material = getMaterial( data.material );
+
+					var tmpBones;
+
+					// If data has skeleton, assumes bones are already in scene graph.
+					// Then temporarily undefines geometry.bones not to create bones
+					// in SkinnedMesh constructor.
+
+					if ( data.skeleton !== undefined && geometry.bones !== undefined ) {
+
+						tmpBones = geometry.bones;
+						geometry.bones = undefined;
+
+					}
+
+					object = new SkinnedMesh( geometry, material );
+
+					// rebinds with skeleton whose uuid is data.skeleton later.
+					if ( data.skeleton !== undefined ) object.skeletonUUID = data.skeleton;
+					if ( data.bindMode !== undefined ) object.bindMode = data.bindMode;
+					if ( data.bindMatrix !== undefined ) object.bindMatrix.fromArray( data.bindMatrix );
+					object.updateMatrixWorld( true );
+
+					if ( tmpBones !== undefined ) geometry.bones = tmpBones;
+
+					break;
 
 				case 'Mesh':
 
@@ -682,6 +755,12 @@ Object.assign( ObjectLoader.prototype, {
 
 					break;
 
+				case 'Bone':
+
+					object = new Bone();
+
+					break;
+
 				case 'LOD':
 
 					object = new LOD();
@@ -796,7 +875,35 @@ Object.assign( ObjectLoader.prototype, {
 
 		};
 
-	}()
+	}(),
+
+	bindSkeletons: function ( object, skeletons ) {
+
+		if ( Object.keys( skeletons ).length === 0 ) return;
+
+		object.traverse( function ( obj ) {
+
+			if ( obj.isSkinnedMesh === true && obj.skeletonUUID !== undefined ) {
+
+				var skeleton = skeletons[ obj.skeletonUUID ];
+
+				if ( skeleton === undefined ) {
+
+					console.warn( 'THREE.ObjectLoader: Not found Skeleton whose uuid is ' + obj.sjeletonUUID );
+
+				} else {
+
+					obj.bind( skeleton, obj.bindMatrix );
+
+				}
+
+				delete obj.skeletonUUID;
+
+			}
+
+		} );
+
+	}
 
 } );
 

src/objects/Skeleton.js

@@ -1,4 +1,5 @@
 import { Matrix4 } from '../math/Matrix4';
+import { _Math } from '../math/Math';
 
 /**
  * @author mikael emtinger / http://gomo.se/
@@ -9,6 +10,8 @@ import { Matrix4 } from '../math/Matrix4';
 
 function Skeleton( bones, boneInverses ) {
 
+	this.uuid = _Math.generateUUID();
+
 	// copy the bone array
 
 	bones = bones || [];
@@ -152,6 +155,33 @@ Object.assign( Skeleton.prototype, {
 
 		return new Skeleton( this.bones, this.boneInverses );
 
+	},
+
+	toJSON: function ( meta ) {
+
+		var data = {};
+
+		var bones = [];
+		var boneInverses = [];
+
+		for ( var i = 0, il = this.bones.length; i < il; i ++ ) {
+
+			bones.push( this.bones[ i ].uuid );
+
+		}
+
+		for ( var i = 0, il = this.boneInverses.length; i < il; i ++ ) {
+
+			boneInverses.push( this.boneInverses[ i ].toArray() );
+
+		}
+
+		data.uuid = this.uuid;
+		data.bones = bones;
+		data.boneInverses = boneInverses;
+
+		return data;
+
 	}
 
 } );