image sizes, cube textures

src/game-lib-a-1-event.js

@@ -21,6 +21,8 @@ GameLib.Event.IMAGE_LOADED          = 0x5;
 GameLib.Event.TEXTURE_LOADED        = 0x6;
 GameLib.Event.LOAD_IMAGE            = 0x7;
 GameLib.Event.MATERIAL_LOADED       = 0x8;
+GameLib.Event.IMAGE_CHANGE          = 0x9;
+GameLib.Event.TEXTURE_TYPE_CHANGE   = 0xa;
 
 /**
  * Subscribe to some events

src/game-lib-d3-api-image.js

@@ -4,6 +4,7 @@
  * @param name
  * @param path
  * @param contentType
+ * @param size
  * @param parentEntity GameLib.Entity
  * @constructor
  */
@@ -12,6 +13,7 @@ GameLib.D3.API.Image = function(
     name,
     path,
     contentType,
+    size,
     parentEntity
 ) {
 
@@ -55,6 +57,11 @@ GameLib.D3.API.Image = function(
         }
     }
     this.contentType = contentType;
+
+    if (GameLib.Utils.UndefinedOrNull(size)) {
+        size = 0;
+    }
+    this.size = size;
 };
 
 GameLib.D3.API.Image.prototype = Object.create(GameLib.Component.prototype);
@@ -71,6 +78,7 @@ GameLib.D3.API.Image.FromObject = function(objectImage) {
         objectImage.name,
         objectImage.path,
         objectImage.contentType,
+        objectImage.size,
         objectImage.parentEntity
     );
 };

src/game-lib-d3-api-light.js

@@ -59,7 +59,7 @@ GameLib.D3.API.Light = function(
     this.lightType = lightType;
 
     if (GameLib.Utils.UndefinedOrNull(name)) {
-        name = 'Light (' + lightType + ')';
+        name = 'Light (' + id + ')';
     }
     this.name = name;
 

src/game-lib-d3-api-texture.js

@@ -69,7 +69,7 @@ GameLib.D3.API.Texture = function(
     this.id = id;
 
     if (GameLib.Utils.UndefinedOrNull(typeId)) {
-        typeId = GameLib.D3.Texture.TEXTURE_TYPE_DIFFUSE;
+        typeId = GameLib.D3.Texture.TEXTURE_TYPE_NORMAL;
     }
     this.typeId = typeId;
 

src/game-lib-d3-image.js

@@ -49,6 +49,12 @@ GameLib.D3.Image.prototype.createInstance = function(update) {
         this.instance.contentType = this.contentType;
     } else {
 
+        // this.subscribe(
+        //     GameLib.Event.TEXTURE_TYPE_CHANGE,
+        //     function(data) {
+        //     }
+        // );
+
         this.subscribe(
             GameLib.Event.LOAD_IMAGE,
             function(data) {
@@ -56,15 +62,28 @@ GameLib.D3.Image.prototype.createInstance = function(update) {
                     data.id === this.id ||
                     data.path === this.path
                 ) {
-                    var loader = new THREE.ImageLoader();
+                    var loader = null;
+
+                    if (data.textureType === GameLib.D3.Texture.TEXTURE_TYPE_NORMAL) {
+
+                        console.log('loading normal image');
+
+                        loader = new THREE.XHRLoader();
 
                         loader.crossOrigin = true;
 
                         loader.path = data.baseUrl;
 
+                        loader.responseType = 'blob';
+
                         loader.load(
                             this.path + '?ts=' + Date.now(),
-                        function ( image ) {
+                            function (blob) {
+
+                                var image = document.createElement('img');
+                                image.onload = function ( e ) { URL.revokeObjectURL( image.src ); };
+                                image.src = URL.createObjectURL( blob );
+
                                 this.instance = image;
                                 this.publish(
                                     GameLib.Event.IMAGE_LOADED,
@@ -75,12 +94,47 @@ GameLib.D3.Image.prototype.createInstance = function(update) {
                                 );
                             }.bind(this),
                             function(xhr) {
-                            console.log( (xhr.loaded / xhr.total * 100) + '% loaded' );
+                                console.log( (xhr.loaded / xhr.total * 100) + '% loaded of ' + this.name);
-                        },
+                                this.size = xhr.total;
+                            }.bind(this),
                             function() {
                                 console.log('An image load error happened');
                             }
                         );
+
+                    } else {
+
+                        console.log('loading cube map');
+
+                        loader = new THREE.CubeTextureLoader();
+
+                        loader.crossOrigin = true;
+
+                        loader.path = data.baseUrl;
+
+                        loader.load(
+                            [
+                                this.path + '?ts=' + Date.now(),
+                                this.path + '?ts=' + Date.now(),
+                                this.path + '?ts=' + Date.now(),
+                                this.path + '?ts=' + Date.now(),
+                                this.path + '?ts=' + Date.now(),
+                                this.path + '?ts=' + Date.now()
+                            ],
+                            function (texture) {
+
+                                this.instance = texture.image;
+                                this.publish(
+                                    GameLib.Event.IMAGE_LOADED,
+                                    {
+                                        imagePath: this.path,
+                                        imageInstance: this.instance,
+                                        cubeTexture : texture
+                                    }
+                                );
+                            }.bind(this)
+                        );
+                    }
                 }
             }
         );

src/game-lib-d3-input-editor.js

@@ -193,34 +193,19 @@ GameLib.D3.Input.Editor.prototype.onMouseDown = function(entity, entityManager)
 
 			var scenes = entity.getComponents(GameLib.D3.Scene);
 
-            var meshes = entity.getComponents(GameLib.D3.Mesh);
+            var intersects = scenes.reduce(
-
-            var intersects = cameras.reduce(
-
-                function(result, camera){
-
-                	var scene = scenes.reduce(
                 function(result, scene) {
-
+                    if (!scene.activeCamera) {
-                			if (scene.activeCamera === camera) {
+                        console.warn('scene ' + scene.name + ' (' + scene.id + ') has no active cameras associated with it');
-                				result = scene;
-							}
-
                         return result;
-						},
-						null
-					);
-
-                	if (scene) {
-                		meshes = scene.meshes;
                     }
 
                     this.raycaster.instance.setFromCamera(
                         this.mouse,
-                        camera.instance
+                        scene.activeCamera.instance
                     );
 
-                    intersects = this.raycaster.getIntersectedObjects(meshes);
+                    intersects = this.raycaster.getIntersectedObjects(scene.meshes);
 
                     intersects.map(function(intersect){
                         result.push(intersect);
@@ -245,7 +230,7 @@ GameLib.D3.Input.Editor.prototype.onMouseDown = function(entity, entityManager)
 				}
 			);
 
-            meshes = intersects.map(function(intersect){
+            var meshes = intersects.map(function(intersect){
             	return intersect.mesh;
 			});
 

src/game-lib-d3-material.js

@@ -562,7 +562,7 @@ GameLib.D3.Material.prototype.updateStandardMaterialInstance = function() {
 	this.instance.visible = this.visible;
 	this.instance.side = this.side;
 	this.instance.color = this.color.instance;
-	// this.instance.specular = this.specular.instance; //standard material doesnt have specular color
+	this.instance.envMapIntensity = this.envMapIntensity; //standard material doesnt have specular color
 	this.instance.roughness = this.roughness;
 	this.instance.metalness = this.metalness;
 	this.instance.lightMapIntensity = this.lightMapIntensity;
@@ -639,6 +639,7 @@ GameLib.D3.Material.prototype.updatePhongMaterialInstance = function() {
 	this.instance.aoMapIntensity = this.aoMapIntensity;
 	this.instance.emissive = this.emissive.instance;
 	this.instance.emissiveIntensity = this.emissiveIntensity;
+    this.instance.envMapIntensity = this.envMapIntensity;
     this.instance.bumpScale = this.bumpScale;
 	this.instance.normalScale = this.normalScale;
 	this.instance.displacementScale = this.displacementScale;
@@ -753,52 +754,117 @@ GameLib.D3.Material.prototype.createInstance = function(update) {
 
                 var modified = false;
 
+                /**
+                 * We also need to check if the image of the texture is assigned -
+                 * if not we should disable the map
+                 */
                 if (this.alphaMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.alphaMap = data.texture.instance;
+                    } else {
+                        this.instance.alphaMap = null;
+                    }
+
                     modified = true;
                 }
                 if (this.aoMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.aoMap = data.texture.instance;
+                    } else {
+                        this.instance.aoMap = null;
+                    }
                     modified = true;
                 }
                 if (this.bumpMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.bumpMap = data.texture.instance;
+                    } else {
+                        this.instance.bumpMap = null;
+                    }
                     modified = true;
                 }
                 if (this.diffuseMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.map = data.texture.instance;
+                    } else {
+                        this.instance.map = null;
+                    }
                     modified = true;
                 }
                 if (this.displacementMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.displacementMap = data.texture.instance;
+                    } else {
+                        this.instance.displacementMap = null;
+                    }
                     modified = true;
                 }
                 if (this.emissiveMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.emissiveMap = data.texture.instance;
+                    } else {
+                        this.instance.emissiveMap = null;
+                    }
                     modified = true;
                 }
                 if (this.environmentMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.envMap = data.texture.instance;
+                    } else {
+                        this.instance.envMap = null;
+                    }
                     modified = true;
                 }
                 if (this.lightMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.lightMap = data.texture.instance;
+                    } else {
+                        this.instance.lightMap = null;
+                    }
                     modified = true;
                 }
                 if (this.metalnessMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.metalnessMap = data.texture.instance;
+                    } else {
+                        this.instance.metalnessMap = null;
+                    }
                     modified = true;
                 }
                 if (this.normalMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.normalMap = data.texture.instance;
+                    } else {
+                        this.instance.normalMap = null;
+                    }
                     modified = true;
                 }
                 if (this.roughnessMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.roughnessMap = data.texture.instance;
+                    } else {
+                        this.instance.roughnessMap = null;
+                    }
                     modified = true;
                 }
                 if (this.specularMap === data.texture) {
+
+                    if (data.texture.image) {
                         this.instance.specularMap = data.texture.instance;
+                    } else {
+                        this.instance.specularMap = null;
+                    }
                     modified = true;
                 }
 

src/game-lib-d3-texture.js

@@ -140,18 +140,22 @@ GameLib.D3.Texture.TYPE_RGBM7_ENCODING = 3004;
 GameLib.D3.Texture.TYPE_RGBM16_ENCODING = 3005;
 GameLib.D3.Texture.TYPE_RGBD_ENCODING = 3006; // MAXRANGE IS 256.
 
-GameLib.D3.Texture.TEXTURE_TYPE_ALPHA       = 'alpha';
+GameLib.D3.Texture.TEXTURE_TYPE_NORMAL      = 0x1;
-GameLib.D3.Texture.TEXTURE_TYPE_AO          = 'ao';
+GameLib.D3.Texture.TEXTURE_TYPE_CUBE        = 0x2;
-GameLib.D3.Texture.TEXTURE_TYPE_BUMP        = 'bump';
+
-GameLib.D3.Texture.TEXTURE_TYPE_DIFFUSE     = 'diffuse';
+
-GameLib.D3.Texture.TEXTURE_TYPE_DISPLACEMENT = 'displacement';
+// GameLib.D3.Texture.TEXTURE_TYPE_ALPHA       = 'alpha';
-GameLib.D3.Texture.TEXTURE_TYPE_EMISSIVE    = 'emissive';
+// GameLib.D3.Texture.TEXTURE_TYPE_AO          = 'ao';
-GameLib.D3.Texture.TEXTURE_TYPE_ENVIRONMENT = 'environment';
+// GameLib.D3.Texture.TEXTURE_TYPE_BUMP        = 'bump';
-GameLib.D3.Texture.TEXTURE_TYPE_LIGHT       = 'light';
+// GameLib.D3.Texture.TEXTURE_TYPE_DIFFUSE     = 'diffuse';
-GameLib.D3.Texture.TEXTURE_TYPE_METALNESS   = 'metalness';
+// GameLib.D3.Texture.TEXTURE_TYPE_DISPLACEMENT = 'displacement';
-GameLib.D3.Texture.TEXTURE_TYPE_NORMAL      = 'normal';
+// GameLib.D3.Texture.TEXTURE_TYPE_EMISSIVE    = 'emissive';
-GameLib.D3.Texture.TEXTURE_TYPE_ROUGHNESS   = 'roughness';
+// GameLib.D3.Texture.TEXTURE_TYPE_ENVIRONMENT = 'environment';
-GameLib.D3.Texture.TEXTURE_TYPE_SPECULAR    = 'specular';
+// GameLib.D3.Texture.TEXTURE_TYPE_LIGHT       = 'light';
+// GameLib.D3.Texture.TEXTURE_TYPE_METALNESS   = 'metalness';
+// GameLib.D3.Texture.TEXTURE_TYPE_NORMAL      = 'normal';
+// GameLib.D3.Texture.TEXTURE_TYPE_ROUGHNESS   = 'roughness';
+// GameLib.D3.Texture.TEXTURE_TYPE_SPECULAR    = 'specular';
 
 /**
  * Creates an instance of our texture object
@@ -173,6 +177,17 @@ GameLib.D3.Texture.prototype.createInstance = function(update) {
         this.instance.offset.y   = this.offset.y;
         this.instance.repeat.x   = this.repeat.x;
         this.instance.repeat.y   = this.repeat.y;
+        this.instance.mapping    = this.mapping;
+        this.instance.format     = this.format;
+
+        this.publish(
+            GameLib.Event.TEXTURE_LOADED,
+            {
+                texture : this
+            }
+        );
+
+        this.instance.needsUpdate = true;
 
     } else {
 
@@ -190,6 +205,15 @@ GameLib.D3.Texture.prototype.createInstance = function(update) {
                 instance.offset.y   = this.offset.y;
                 instance.repeat.x   = this.repeat.x;
                 instance.repeat.y   = this.repeat.y;
+                instance.mapping    = this.mapping;
+                instance.format     = this.format;
+
+                this.publish(
+                    GameLib.Event.TEXTURE_LOADED,
+                    {
+                        texture : this
+                    }
+                );
 
                 return instance;
             }
@@ -199,19 +223,33 @@ GameLib.D3.Texture.prototype.createInstance = function(update) {
             GameLib.Event.IMAGE_LOADED,
             function (data) {
 
+                /**
+                 * Only work with images that belong to this texture
+                 */
+                if (data.imagePath === this.image.path) {
+
                     if (!(this.image instanceof GameLib.D3.Image)) {
-                    console.warn('The image associated with this texture has not been setup properly - did you link the objects?')
+                        if (!data.cubeTexture) {
+                            console.warn('The image associated with this texture has not been setup properly - objects linked?');
                             return;
                         }
+                    }
 
-                // if (this.instance) {
+                    if (data.cubeTexture) {
-                //     /**
+
-                //      * The texture has already been loaded
+                        this.instance = data.cubeTexture;
-                //      */
+                        this.instance.name = this.name;
-                //     return;
+                        this.mapping = this.instance.mapping;
-                // }
+                        this.offset.x = this.instance.offset.x;
+                        this.offset.y = this.instance.offset.y;
+                        this.flipY = this.instance.flipY;
+                        this.encoding = this.instance.encoding;
+                        this.repeat.x = this.instance.offset.x;
+                        this.repeat.y = this.instance.offset.y;
+                        this.format = this.instance.format;
+
+                    } else {
 
-                if (data.imagePath === this.image.path) {
                         var instance = new THREE.Texture(
                             data.imageInstance
                         );
@@ -222,7 +260,9 @@ GameLib.D3.Texture.prototype.createInstance = function(update) {
                         instance.offset.y   = this.offset.y;
                         instance.repeat.x   = this.repeat.x;
                         instance.repeat.y   = this.repeat.y;
+                        this.format = instance.format;
                         this.instance = instance;
+                    }
 
                     this.publish(
                         GameLib.Event.TEXTURE_LOADED,
@@ -236,6 +276,39 @@ GameLib.D3.Texture.prototype.createInstance = function(update) {
             }
         );
 
+        this.subscribe(
+            GameLib.Event.IMAGE_CHANGE,
+            function (data) {
+
+                var instance = null;
+
+                if (this.image === null) {
+                    instance = new THREE.Texture();
+                } else {
+                    instance = new THREE.Texture(this.image.instance);
+                    instance.needsUpdate = true;
+                    instance.name       = this.name;
+                    instance.flipY      = this.flipY;
+                    instance.encoding   = this.encoding;
+                    instance.offset.x   = this.offset.x;
+                    instance.offset.y   = this.offset.y;
+                    instance.repeat.x   = this.repeat.x;
+                    instance.repeat.y   = this.repeat.y;
+                    this.format = instance.format;
+                }
+
+                this.instance = instance;
+
+                this.publish(
+                    GameLib.Event.TEXTURE_LOADED,
+                    {
+                        texture : this
+                    }
+                );
+
+            }
+        );
+
         return null;
     }
 };
@@ -253,11 +326,16 @@ GameLib.D3.Texture.prototype.updateInstance = function() {
  */
 GameLib.D3.Texture.prototype.toApiObject = function() {
 
+    var apiImage = null;
+    if (this.image) {
+        apiImage = this.image.id
+    }
+
     return new GameLib.D3.API.Texture(
         this.id,
         this.typeId,
         this.name,
-        this.image.id,
+        apiImage,
         this.wrapS,
         this.wrapT,
         this.repeat.toApiObject(),

src/game-lib-gui.js

@@ -199,7 +199,7 @@ GameLib.GUI.prototype.isVector2 = function(member) {
 // 	return (member instanceof GameLib.Quaternion)
 // };
 
-GameLib.GUI.prototype.buildControl = function(folder, object, property) {
+GameLib.GUI.prototype.buildControl = function(folder, object, property, entityManager) {
 
 	var handles = [];
 
@@ -485,6 +485,17 @@ GameLib.GUI.prototype.buildControl = function(folder, object, property) {
 				}
 				).name(property).listen()
 			);
+		} else if (object instanceof GameLib.D3.Texture && property === 'typeId') {
+            handles.push(
+                folder.add(
+                    object,
+                    property,
+                    {
+                        'normal': GameLib.D3.Texture.TEXTURE_TYPE_NORMAL,
+                        'cube': GameLib.D3.Texture.TEXTURE_TYPE_CUBE
+                    }
+                ).name(property).listen()
+            );
         } else if (object instanceof GameLib.D3.Texture && property === 'textureType') {
 			handles.push(
 				folder.add(
@@ -545,7 +556,8 @@ GameLib.GUI.prototype.buildControl = function(folder, object, property) {
 				handles.push(folder.add(object, property, 0, 1.0).step(0.001).name(property).listen());
 			} else if (
 				property === 'shininess' ||
-				property === 'fov'
+				property === 'fov'||
+                property === 'envMapIntensity'
 			) {
 				handles.push(folder.add(object, property, -255, 255).step(1).name(property).listen());
 			} else if (
@@ -562,8 +574,7 @@ GameLib.GUI.prototype.buildControl = function(folder, object, property) {
 			}  else if (
 				property === 'near' ||
 				property === 'distanceGrain' ||
-				property === 'bumpScale' ||
+				property === 'bumpScale'
-				property === 'envMapIntensity'
 			) {
 				handles.push(folder.add(object, property, 0, 100).step(0.001).name(property).listen());
 			} else if (
@@ -672,15 +683,17 @@ GameLib.GUI.prototype.buildControl = function(folder, object, property) {
 	// 		)
 	// 	);
 	//
-	// 	if (property === 'name') {
+	//
-	// 		handle.onFinishChange(
-	// 			this.buildObjectSelection.bind(this)
-	// 		);
-	// 	}
 	// });
 
 	handles.map(
-		function(handle) {
+	    function(gui) {
+	        return function(handle) {
+                if (property === 'name') {
+                    handle.onFinishChange(
+                        function(){gui.build(entityManager)}
+                    );
+                } else {
                     handle.onChange(
                         function (value) {
                             if (object[property] instanceof GameLib.Color) {
@@ -691,11 +704,33 @@ GameLib.GUI.prototype.buildControl = function(folder, object, property) {
                             } else {
                                 object[property] = value;
                             }
+
+                            if (object instanceof GameLib.D3.Texture && property === 'typeId') {
+
+                                var imageFactory = entityManager.queryComponents(GameLib.D3.ImageFactory)[0];
+
+                                if (object.image) {
+                                    object.publish(
+                                        GameLib.Event.LOAD_IMAGE,
+                                        {
+                                            id : object.image.id,
+                                            textureType : object[property],
+                                            baseUrl : imageFactory.baseUrl
+                                        }
+                                    )
+                                } else {
+                                    console.log('changing texture type but no image specified')
+                                }
+
+                            }
+
                             object.updateInstance();
                             // object.needsUpdate = true;
                         }
                     );
                 }
+            }
+        }(this)
 	);
 
 };
@@ -793,18 +828,34 @@ GameLib.GUI.prototype.buildSelectControl = function(folder, object, property, en
                         }
                     );
 
-                    gui.build(entityManager);
+                } else if (property === 'image') {
+
+                    GameLib.Event.Emit(
+                        GameLib.Event.IMAGE_CHANGE,
+                        {
+                            originalImage: this.initialValue,
+                            newImage: object[property],
+                            object: object,
+                            entityManager: entityManager
+                        }
+                    );
+
                 } else {
                     /**
                      * Old way of doing things
                      */
-                    parentObject.buildIdToObject();
                     object.updateInstance();
                 }
 
+                /**
+                 * Properties changed - rebuild the object list in the parent
+                 */
+                parentObject.buildIdToObject();
+
                 /**
                  * Properties changed - rebuild GUI
                  */
+                gui.build(entityManager);
 
             };
 
@@ -1001,7 +1052,7 @@ GameLib.GUI.prototype.build = function(entityManager) {
 							console.log('ignored: ' + property);
 						}
 					} else {
-						this.buildControl(folder, object, property);
+						this.buildControl(folder, object, property, entityManager);
 					}
 				}
 			}