Refactored Texture.toJSON implementation. See #6509

src/core/BufferGeometry.js

@@ -1141,16 +1141,14 @@ THREE.BufferGeometry.prototype = {
 		}
 	},
 
-	toJSON: function() {
+	toJSON: function () {
 
-		// we will store all serialization data on 'data'
-		var data = {};
-
-		// add metadata
-		data.metadata = {
-			version: 4.4,
-			type: 'BufferGeometry',
-			generator: 'BufferGeometry.toJSON'
+		var data = {
+			metadata: {
+				version: 4.4,
+				type: 'BufferGeometry',
+				generator: 'BufferGeometry.toJSON'
+			}
 		};
 
 		// standard BufferGeometry serialization

src/core/Geometry.js

@@ -789,16 +789,14 @@ THREE.Geometry.prototype = {
 
 	},
 
-	toJSON: function() {
+	toJSON: function () {
 
-		// we will store all serialization data on 'data'
-		var data = {};
-
-		// add metadata
-		data.metadata = {
-			version: 4.4,
-			type: 'Geometry',
-			generator: 'Geometry.toJSON'
+		var data = {
+			metadata: {
+				version: 4.4,
+				type: 'Geometry',
+				generator: 'Geometry.toJSON'
+			}
 		};
 
 		// standard Geometry serialization

src/core/Object3D.js

@@ -568,46 +568,11 @@ THREE.Object3D.prototype = {
 
 	},
 
-	toJSON: function( meta ) {
-
-		var textures = [];
-		var images = [];
-
-		var parseTexture = function ( texture ) {
-
-			console.log(texture);
-
-
-			if ( meta.textures === undefined ) {
-
-				meta.textures = [];
-				meta.images = [];
-			}
-			
-			if ( textures[ texture.uuid ] === undefined ) {
-
-				var json = texture.toJSON();
-				var jsonImage = texture.toJSONImage(json.image);
-
-				delete json.metadata;
-				delete jsonImage.metadata;
-
-				textures[ texture.uuid ] = json;
-				images[ texture.uuid ] = jsonImage;
-
-				meta.textures.push( json );
-				meta.images.push(jsonImage);
-			}
-
-			return texture.uuid;
-
-		};
+	toJSON: function ( meta ) {
 
 		var isRootObject = ( meta === undefined );
 
-		// we will store all serialization data on 'data'
 		var data = {};
-		var metadata;
 
 		// meta is a hash used to collect geometries, materials.
 		// not providing it implies that this is the root object
@@ -618,16 +583,15 @@ THREE.Object3D.prototype = {
 			meta = {
 				geometries: {},
 				materials: {},
-				textures: [],
-				images: []
+				textures: {},
+				images: {}
 			};
 
-			// add metadata
-			metadata = {
-				version: 4.41,
+			data.metadata = {
+				version: 4.4,
 				type: 'Object',
 				generator: 'Object3D.toJSON'
-			}
+			};
 
 		}
 
@@ -635,6 +599,7 @@ THREE.Object3D.prototype = {
 
 		data.uuid = this.uuid;
 		data.type = this.type;
+
 		if ( this.name !== '' ) data.name = this.name;
 		if ( JSON.stringify( this.userData ) !== '{}' ) data.userData = this.userData;
 		if ( this.visible !== true ) data.visible = this.visible;
@@ -649,64 +614,23 @@ THREE.Object3D.prototype = {
 
 				data.children.push( this.children[ i ].toJSON( meta ).object );
 
-					if(this.children[ i ].material instanceof THREE.MeshPhongMaterial){
-						var _mat = this.children[ i ].material;
-
-						
-						if(_mat.map !== null){ 
-
-							console.log(_mat.map);
-							parseTexture(_mat.map);
-						
-						}	
-						if(_mat.alphaMap !== null) parseTexture(_mat.alphaMap);
-						if(_mat.lightMap !== null) parseTexture(_mat.lightMap);
-						if(_mat.bumpMap !== null) parseTexture(_mat.bumpMap);
-						if(_mat.normalMap !== null) parseTexture(_mat.normalMap);	
-						if(_mat.specularMap !== null) parseTexture(_mat.specularMap);
-						if(_mat.envMap !== null) parseTexture(_mat.envMap);
-
-
-						// if(object.material.reflectivity !== null) data.reflectivity = object.material.reflectivity;
-						// if(object.material.bumpScale !== null) data.bumpScale = object.material.bumpScale;
-					}
 			}
 
 		}
 
-		// wrap serialized object with additional data
-
-		// if(object.material instanceof THREE.MeshPhongMaterial){
-		// 	if(object.material.map !== null) data.texture = parseTexture(object.material.map);
-		// 	if(object.material.alphaMap !== null) data.texture = parseTexture(object.material.alphaMap);
-		// 	if(object.material.lightMap !== null) data.texture = parseTexture(object.material.lightMap);
-		// 	if(object.material.bumpMap !== null) data.texture = parseTexture(object.material.bumpMap);
-		// 	if(object.material.normalMap !== null) data.texture = parseTexture(object.material.normalMap);	
-		// 	if(object.material.specularMap !== null) data.texture = parseTexture(object.material.specularMap);
-		// 	if(object.material.envMap !== null) data.texture = parseTexture(object.material.envMap);
-		// 	console.log(data.texture);
-
-		// 	if(object.material.reflectivity !== null) data.reflectivity = object.material.reflectivity;
-		// 	if(object.material.bumpScale !== null) data.bumpScale = object.material.bumpScale;
-		// }
-
 		var output = {};
 
 		if ( isRootObject ) {
 
-			output.metadata = metadata;
-
 			var geometries = extractFromCache( meta.geometries );
 			var materials = extractFromCache( meta.materials );
-			// var textures1 = extractFromCache( meta.textures );
-			// var images1 = extractFromCache( meta.images );
-
-			console.log(meta.textures);
+			var textures = extractFromCache( meta.textures );
+			var images = extractFromCache( meta.images );
 
 			if ( geometries.length > 0 ) output.geometries = geometries;
 			if ( materials.length > 0 ) output.materials = materials;
-			if ( meta.textures.length > 0 ) output.textures = meta.textures;
-			if ( meta.images.length > 0 ) output.images = meta.images;
+			if ( textures.length > 0 ) output.textures = textures;
+			if ( images.length > 0 ) output.images = images;
 
 		}
 

src/loaders/ObjectLoader.js

@@ -203,12 +203,12 @@ THREE.ObjectLoader.prototype = {
 						break;
 
 					case 'TextGeometry':
-					
+
 						geometry = new THREE.TextGeometry(
 							data.text,
 							data.data
-						); 
-						
+						);
+
 						break;
 
 				}
@@ -264,50 +264,32 @@ THREE.ObjectLoader.prototype = {
 				if ( data.alphaMap !== undefined ) {
 
 					material.alphaMap = getTexture( data.alphaMap );
-
 					material.transparent = true;
 
-				}	
-
-				if ( data.bumpMap !== undefined ) {
-
-					material.bumpMap = getTexture( data.bumpMap );
-					if ( data.bumpScale !== undefined) material.bumpScale = data.bumpScale;
 				}
 
-				if ( data.normalMap !== undefined ) {
+				if ( data.bumpMap !== undefined ) material.bumpMap = getTexture( data.bumpMap );
+				if ( data.bumpScale !== undefined ) material.bumpScale = data.bumpScale;
 
-					material.normalMap = getTexture( data.normalMap );
-					if ( data.normalScale )	material.normalScale = new THREE.Vector2( data.normalScale, data.normalScale );
-					
-				}
+				if ( data.normalMap !== undefined ) material.normalMap = getTexture( data.normalMap );
+				if ( data.normalScale )	material.normalScale = new THREE.Vector2( data.normalScale, data.normalScale );
 
 				if ( data.specularMap !== undefined ) material.specularMap = getTexture( data.specularMap );
 
 				if ( data.envMap !== undefined ) {
 
 					material.envMap = getTexture( data.envMap );
-					if ( data.reflectivity ) material.reflectivity = data.reflectivity;
-					
-					material.envMap.mapping = THREE.EquirectangularRefractionMapping;
 					material.combine = THREE.MultiplyOperation;
 
 				}
 
-				if ( data.lightMap !== undefined ) {
+				if ( data.reflectivity ) material.reflectivity = data.reflectivity;
 
-					material.lightMap = getTexture( data.lightMap );
-					if ( data.lightMapIntensity !== undefined ) material.lightMapIntensity = data.lightMapIntensity;
+				if ( data.lightMap !== undefined ) material.lightMap = getTexture( data.lightMap );
+				if ( data.lightMapIntensity !== undefined ) material.lightMapIntensity = data.lightMapIntensity;
 
-				}
-
-				if ( data.aoMap !== undefined ) {
-
-					material.aoMap = getTexture( data.aoMap );
-					if ( data.aoMapIntensity !== undefined ) {
-						material.aoMapIntensity = data.aoMapIntensity;
-					}
-				}
+				if ( data.aoMap !== undefined ) material.aoMap = getTexture( data.aoMap );
+				if ( data.aoMapIntensity !== undefined ) material.aoMapIntensity = data.aoMapIntensity;
 
 				materials[ data.uuid ] = material;
 
@@ -346,9 +328,7 @@ THREE.ObjectLoader.prototype = {
 			for ( var i = 0, l = json.length; i < l; i ++ ) {
 
 				var image = json[ i ];
-				var imageData = image.data64;
-
-				images[ image.uuid ] = loadImage(imageData);
+				images[ image.uuid ] = loadImage( image.src );
 
 			}
 
@@ -386,6 +366,7 @@ THREE.ObjectLoader.prototype = {
 				texture.uuid = data.uuid;
 
 				if ( data.name !== undefined ) texture.name = data.name;
+				if ( data.mapping !== undefined ) texture.mapping = data.mapping;
 				if ( data.repeat !== undefined ) texture.repeat = new THREE.Vector2( data.repeat[ 0 ], data.repeat[ 1 ] );
 				if ( data.minFilter !== undefined ) texture.minFilter = THREE[ data.minFilter ];
 				if ( data.magFilter !== undefined ) texture.magFilter = THREE[ data.magFilter ];
@@ -439,9 +420,6 @@ THREE.ObjectLoader.prototype = {
 
 			};
 
-			console.log(data);
-			console.log(data.type);
-
 			switch ( data.type ) {
 
 				case 'Scene':

src/materials/Material.js

@@ -108,16 +108,14 @@ THREE.Material.prototype = {
 
 	},
 
-	toJSON: function() {
+	toJSON: function ( meta ) {
 
-		// we will store all serialization data on 'data'
-		var data = {};
-
-		// add metadata
-		data.metadata = {
-			version: 4.4,
-			type: 'Material',
-			generator: 'Material.toJSON'
+		var data = {
+			metadata: {
+				version: 4.4,
+				type: 'Material',
+				generator: 'Material.toJSON'
+			}
 		};
 
 		// standard Material serialization

src/materials/MeshPhongMaterial.js

@@ -163,36 +163,36 @@ THREE.MeshPhongMaterial.prototype.clone = function () {
 
 };
 
-THREE.MeshPhongMaterial.prototype.toJSON = function () {
+THREE.MeshPhongMaterial.prototype.toJSON = function ( meta ) {
 
-	var data = THREE.Material.prototype.toJSON.call( this );
+	var data = THREE.Material.prototype.toJSON.call( this, meta );
 
 	data.color = this.color.getHex();
 	data.emissive = this.emissive.getHex();
 	data.specular = this.specular.getHex();
 	data.shininess = this.shininess;
 
-	if ( this.vertexColors !== THREE.NoColors ) data.vertexColors = this.vertexColors;
-	if ( this.shading !== THREE.SmoothShading ) data.shading = this.shading;
-	if ( this.blending !== THREE.NormalBlending ) data.blending = this.blending;
-	if ( this.side !== THREE.FrontSide ) data.side = this.side;
-
-	if(this.map !== null && this.map !== THREE.Texture ) data.map = this.map.uuid;
-	if(this.alphaMap !== null && this.alphaMap !== THREE.Texture ) data.alphaMap = this.alphaMap.uuid;
-	if(this.lightMap !== null && this.lightMap !== THREE.Texture ) data.lightMap = this.lightMap.uuid;
-	if(this.bumpMap !== null && this.bumpMap !== THREE.Texture ){ 
-		data.bumpMap = this.bumpMap.uuid;
+	if ( this.map instanceof THREE.Texture ) data.map = this.map.toJSON( meta ).uuid;
+	if ( this.alphaMap instanceof THREE.Texture ) data.alphaMap = this.alphaMap.toJSON( meta ).uuid;
+	if ( this.lightMap instanceof THREE.Texture ) data.lightMap = this.lightMap.toJSON( meta ).uuid;
+	if ( this.bumpMap instanceof THREE.Texture ) {
+		data.bumpMap = this.bumpMap.toJSON( meta ).uuid;
 		data.bumpScale = this.bumpScale;
 	}
-	if(this.normalMap !== null && this.normalMap !== THREE.Texture ){
-		data.normalMap = this.normalMap.uuid;
+	if ( this.normalMap instanceof THREE.Texture ) {
+		data.normalMap = this.normalMap.toJSON( meta ).uuid;
 		data.normalScale = this.normalScale; // Removed for now, causes issue in editor ui.js
 	}
-	if(this.specularMap !== null && this.specularMap !== THREE.Texture ) data.specularMap = this.specularMap.uuid;
-	if(this.envMap !== null && this.envMap !== THREE.Texture ){
-		data.envMap = this.envMap.uuid;
+	if ( this.specularMap instanceof THREE.Texture ) data.specularMap = this.specularMap.toJSON( meta ).uuid;
+	if ( this.envMap instanceof THREE.Texture ) {
+		data.envMap = this.envMap.toJSON( meta ).uuid;
 		data.reflectivity = this.reflectivity; // Scale behind envMap
-	} 
+	}
+
+	if ( this.vertexColors !== THREE.NoColors ) data.vertexColors = this.vertexColors;
+	if ( this.shading !== THREE.SmoothShading ) data.shading = this.shading;
+	if ( this.blending !== THREE.NormalBlending ) data.blending = this.blending;
+	if ( this.side !== THREE.FrontSide ) data.side = this.side;
 
 	return data;
 

src/objects/Mesh.js

@@ -330,12 +330,12 @@ THREE.Mesh.prototype.toJSON = function ( meta ) {
 
 	// only serialize if not in meta geometries cache
 	if ( meta.geometries[ this.geometry.uuid ] === undefined ) {
-		meta.geometries[ this.geometry.uuid ] = this.geometry.toJSON();
+		meta.geometries[ this.geometry.uuid ] = this.geometry.toJSON( meta );
 	}
 
 	// only serialize if not in meta materials cache
 	if ( meta.materials[ this.material.uuid ] === undefined ) {
-		meta.materials[ this.material.uuid ] = this.material.toJSON();
+		meta.materials[ this.material.uuid ] = this.material.toJSON( meta );
 	}
 
 	data.object.geometry = this.geometry.uuid;

src/textures/Texture.js

@@ -95,55 +95,69 @@ THREE.Texture.prototype = {
 
 	},
 
-	toJSON: function(){
+	toJSON: function ( meta ) {
+
+		if ( meta.textures[ this.uuid ] !== undefined ) {
+
+			return meta.textures[ this.uuid ];
+
+		}
 
 		var output = {
 			metadata: {
-				version: 4.41,
+				version: 4.4,
 				type: 'Texture',
-				generator: 'TextureExporter'
+				generator: 'Texture.toJSON'
 			},
-			uuid: this.uuid
-
+			uuid: this.uuid,
+			mapping: this.mapping
 		};
 
-		output.image = THREE.Math.generateUUID();
+		if ( this.image !== undefined ) {
 
-		return output;
-		
-	},
+			// TODO: Move to THREE.Image
 
-	//Bad place for something like this
-	toJSONImage: function(imageUUID){
+			var image = this.image;
 
-		var output = {
-			metadata: {
-				version: 4.41,
-				type: 'Image',
-				generator: 'ImageExporter'
-			},
-			uuid: imageUUID
-		};
+			if ( image.uuid === undefined ) {
 
-		var image = new Image();
+				image.uuid = THREE.Math.generateUUID(); // UGH
 
-		image = this.image;
+			}
 
-		var imgCanvas = document.createElement("canvas"),
-		imgContext = imgCanvas.getContext("2d");
+			if ( meta.images[ this.image.uuid ] === undefined ) {
 
-		imgCanvas.width = image.width;
-		imgCanvas.height = image.height;
+				var canvas = document.createElement( 'canvas' );
+				canvas.width = image.width;
+				canvas.height = image.height;
 
-		imgContext.drawImage(image, 0, 0, image.width, image.height );
+				var context = canvas.getContext( '2d' );
+				context.drawImage( image, 0, 0, image.width, image.height );
+
+				var src;
+
+				if ( image.width > 2048 || image.height > 2048 ) {
+
+					src = canvas.toDataURL( 'image/jpeg', 0.6 );
+
+				} else {
+
+					src = canvas.toDataURL( 'image/png' );
+
+				}
+
+				meta.images[ this.image.uuid ] = { uuid: this.image.uuid, src: src };
+
+			}
+
+			output.image = image.uuid;
 
-		if(image.width > 2048 || image.height > 2048){
-			output.data64 = imgCanvas.toDataURL("image/jpeg", 0.6);
-		}else{
-			output.data64 = imgCanvas.toDataURL("image/png");
 		}
 
+		meta.textures[ this.uuid ] = output;
+
 		return output;
+
 	},
 
 	update: function () {