Behaviors: done

sandbox updated

dist/preview release/babylon.max.js

@@ -36140,7 +36140,7 @@ var BABYLON;
             var endFrame = frameRate * (duration / 1000);
             transition.setKeys([{
                     frame: 0,
-                    value: host[property]
+                    value: host[property].clone ? host[property].clone() : host[property]
                 },
                 {
                     frame: endFrame,
@@ -48190,14 +48190,15 @@ var BABYLON;
             if (this._filesToLoad && this._filesToLoad.length > 0) {
                 var files_1 = [];
                 var folders = [];
+                var items = event.dataTransfer ? event.dataTransfer.items : null;
                 for (var i = 0; i < this._filesToLoad.length; i++) {
                     var fileToLoad = this._filesToLoad[i];
                     var name_1 = fileToLoad.name.toLowerCase();
                     var type = fileToLoad.type;
                     var entry = void 0;
                     fileToLoad.correctName = name_1;
-                    if (event.dataTransfer && event.dataTransfer.items) {
-                        var item = event.dataTransfer.items[i];
+                    if (items) {
+                        var item = items[i];
                         if (item.getAsEntry) {
                             entry = item.getAsEntry();
                         }
@@ -69695,8 +69696,7 @@ var BABYLON;
     var FramingBehavior = (function () {
         function FramingBehavior() {
             this._mode = FramingBehavior.IgnoreBoundsSizeMode;
-            this._relativeRadius = 1.0;
-            this._elevation = 0.3;
+            this._radiusScale = 1.0;
             this._positionY = 0;
             this._defaultElevation = 0.3;
             this._elevationReturnTime = 1500;
@@ -69734,47 +69734,31 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
-        Object.defineProperty(FramingBehavior.prototype, "relativeRadius", {
+        Object.defineProperty(FramingBehavior.prototype, "radiusScale", {
             /**
-             * Gets the radius of the camera relative to the target's bounding box.
+             * Gets the scale applied to the radius
              */
             get: function () {
-                return this._relativeRadius;
+                return this._radiusScale;
             },
             /**
-             * Sets the radius of the camera relative to the target's bounding box.
+             * Sets the scale applied to the radius (1 by default)
              */
             set: function (radius) {
-                this._relativeRadius = radius;
-            },
-            enumerable: true,
-            configurable: true
-        });
-        Object.defineProperty(FramingBehavior.prototype, "elevation", {
-            /**
-             * Gets the elevation of the camera from the target, in radians.
-             */
-            get: function () {
-                return this._elevation;
-            },
-            /**
-             * Sets the elevation of the camera from the target, in radians.
-             */
-            set: function (elevation) {
-                this._elevation = elevation;
+                this._radiusScale = radius;
             },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(FramingBehavior.prototype, "positionY", {
             /**
-             * Gets the Y offset of the primary model from the camera's focus.
+             * Gets the Y offset of the primary mesh from the camera's focus.
              */
             get: function () {
                 return this._positionY;
             },
             /**
-             * Sets the Y offset of the primary model from the camera's focus.
+             * Sets the Y offset of the primary mesh from the camera's focus.
              */
             set: function (positionY) {
                 this._positionY = positionY;
@@ -69836,13 +69820,13 @@ var BABYLON;
         });
         Object.defineProperty(FramingBehavior.prototype, "zoomStopsAnimation", {
             /**
-            * Gets the flag that indicates if user zooming should stop model animation.
+            * Gets the flag that indicates if user zooming should stop animation.
             */
             get: function () {
                 return this._zoomStopsAnimation;
             },
             /**
-            * Sets the flag that indicates if user zooming should stop model animation.
+            * Sets the flag that indicates if user zooming should stop animation.
             */
             set: function (flag) {
                 this._zoomStopsAnimation = flag;
@@ -69852,13 +69836,13 @@ var BABYLON;
         });
         Object.defineProperty(FramingBehavior.prototype, "framingTime", {
             /**
-             * Gets the transition time when framing the model, in milliseconds
+             * Gets the transition time when framing the mesh, in milliseconds
             */
             get: function () {
                 return this._framingTime;
             },
             /**
-             * Sets the transition time when framing the model, in milliseconds
+             * Sets the transition time when framing the mesh, in milliseconds
             */
             set: function (time) {
                 this._framingTime = time;
@@ -69909,8 +69893,8 @@ var BABYLON;
          * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
          */
         FramingBehavior.prototype.zoomOnMesh = function (mesh, radius, applyToLowerLimit, framingPositionY, focusOnOriginXZ) {
-            if (applyToLowerLimit === void 0) { applyToLowerLimit = false; }
-            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = true; }
+            if (applyToLowerLimit === void 0) { applyToLowerLimit = true; }
+            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = false; }
             if (framingPositionY == null) {
                 framingPositionY = this._positionY;
             }
@@ -69923,12 +69907,11 @@ var BABYLON;
             else {
                 zoomTarget = center.clone();
             }
-            // if (!this._vectorTransition) {
-            // 	this._vectorTransition = Animation.CreateAnimation("target", Animation.ANIMATIONTYPE_VECTOR3, 60, FramingBehavior.EasingFunction);
-            // }			
-            // this._animatables.push(Animation.TransitionTo("target", zoomTarget, this._attachedCamera, this._attachedCamera.getScene(), 
-            // 						60, this._vectorTransition, this._framingTime));
-            this._attachedCamera.setTarget(zoomTarget);
+            if (!this._vectorTransition) {
+                this._vectorTransition = BABYLON.Animation.CreateAnimation("target", BABYLON.Animation.ANIMATIONTYPE_VECTOR3, 60, FramingBehavior.EasingFunction);
+            }
+            this._betaIsAnimating = true;
+            this._animatables.push(BABYLON.Animation.TransitionTo("target", zoomTarget, this._attachedCamera, this._attachedCamera.getScene(), 60, this._vectorTransition, this._framingTime));
             // sets the radius and lower radius bounds
             if (radius == null) {
                 // Small delta ensures camera is not always at lower zoom limit.
@@ -69943,14 +69926,14 @@ var BABYLON;
                 }
             }
             if (applyToLowerLimit) {
-                this._attachedCamera.lowerRadiusLimit = radius;
+                this._attachedCamera.lowerRadiusLimit = mesh.getBoundingInfo().boundingSphere.radiusWorld;
+                ;
             }
             // transition to new radius
-            // if (!this._radiusTransition) {
-            // 	this._radiusTransition = Animation.CreateAnimation("radius", Animation.ANIMATIONTYPE_FLOAT, 60, FramingBehavior.EasingFunction);
-            // }
-            // this._animatables.push(Animation.TransitionTo("radius", radius, this._attachedCamera, this._attachedCamera.getScene(), 
-            // 						60, this._radiusTransition, this._framingTime));															
+            if (!this._radiusTransition) {
+                this._radiusTransition = BABYLON.Animation.CreateAnimation("radius", BABYLON.Animation.ANIMATIONTYPE_FLOAT, 60, FramingBehavior.EasingFunction);
+            }
+            this._animatables.push(BABYLON.Animation.TransitionTo("radius", radius, this._attachedCamera, this._attachedCamera.getScene(), 60, this._radiusTransition, this._framingTime));
         };
         /**
          * Calculates the lowest radius for the camera based on the bounding box of the mesh.
@@ -69966,8 +69949,7 @@ var BABYLON;
             // (Good explanation: http://stackoverflow.com/questions/2866350/move-camera-to-fit-3d-scene)
             var radiusWithoutFraming = boxVectorGlobalDiagonal * 0.5;
             // Horizon distance
-            var sphereRadius = mesh.getBoundingInfo().boundingSphere.radiusWorld;
-            var radius = radiusWithoutFraming * this._relativeRadius;
+            var radius = radiusWithoutFraming * this._radiusScale;
             var distanceForHorizontalFrustum = radius * Math.sqrt(1.0 + 1.0 / (frustumSlope.x * frustumSlope.x));
             var distanceForVerticalFrustum = radius * Math.sqrt(1.0 + 1.0 / (frustumSlope.y * frustumSlope.y));
             var distance = Math.max(distanceForHorizontalFrustum, distanceForVerticalFrustum);
@@ -70046,8 +70028,10 @@ var BABYLON;
         FramingBehavior.prototype.stopAllAnimations = function () {
             this._attachedCamera.animations = [];
             while (this._animatables.length) {
-                this._animatables[0].onAnimationEnd = null;
-                this._animatables[0].stop();
+                if (this._animatables[0]) {
+                    this._animatables[0].onAnimationEnd = null;
+                    this._animatables[0].stop();
+                }
                 this._animatables.shift();
             }
         };
@@ -70070,11 +70054,11 @@ var BABYLON;
         FramingBehavior.EasingMode = BABYLON.EasingFunction.EASINGMODE_EASEINOUT;
         // Statics
         /**
-         * The camera can move all the way towards the model.
+         * The camera can move all the way towards the mesh.
          */
         FramingBehavior.IgnoreBoundsSizeMode = 0;
         /**
-         * The camera is not allowed to zoom closer to the model than the point at which the adjusted bounding sphere touches the frustum sides
+         * The camera is not allowed to zoom closer to the mesh than the point at which the adjusted bounding sphere touches the frustum sides
          */
         FramingBehavior.FitFrustumSidesMode = 1;
         return FramingBehavior;
@@ -70103,6 +70087,7 @@ var BABYLON;
              * Length of the distance animated by the transition when upper radius is reached
              */
             this.upperRadiusTransitionRange = -2;
+            this._autoTransitionRange = false;
             // Animations
             this._radiusIsAnimating = false;
             this._radiusBounceTransition = null;
@@ -70115,6 +70100,42 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
+        Object.defineProperty(BouncingBehavior.prototype, "autoTransitionRange", {
+            /**
+             * Gets a value indicating if the lowerRadiusTransitionRange and upperRadiusTransitionRange are defined automatically
+             */
+            get: function () {
+                return this._autoTransitionRange;
+            },
+            /**
+             * Sets a value indicating if the lowerRadiusTransitionRange and upperRadiusTransitionRange are defined automatically
+             * Transition ranges will be set to 5% of the bounding box diagonal in world space
+             */
+            set: function (value) {
+                var _this = this;
+                if (this._autoTransitionRange === value) {
+                    return;
+                }
+                this._autoTransitionRange = value;
+                var camera = this._attachedCamera;
+                if (value) {
+                    this._onMeshTargetChangedObserver = camera.onMeshTargetChangedObservable.add(function (mesh) {
+                        if (!mesh) {
+                            return;
+                        }
+                        mesh.computeWorldMatrix(true);
+                        var diagonal = mesh.getBoundingInfo().diagonalLength;
+                        _this.lowerRadiusTransitionRange = diagonal * 0.05;
+                        _this.upperRadiusTransitionRange = diagonal * 0.05;
+                    });
+                }
+                else if (this._onMeshTargetChangedObserver) {
+                    camera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver);
+                }
+            },
+            enumerable: true,
+            configurable: true
+        });
         BouncingBehavior.prototype.attach = function (camera) {
             var _this = this;
             this._attachedCamera = camera;
@@ -70131,6 +70152,9 @@ var BABYLON;
         };
         BouncingBehavior.prototype.detach = function (camera) {
             camera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver);
+            if (this._onMeshTargetChangedObserver) {
+                camera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver);
+            }
         };
         /**
          * Checks if the camera radius is at the specified limit. Takes into account animation locks.

dist/preview release/customConfigurations/minimalGLTFViewer/babylon.max.js

@@ -29755,7 +29755,7 @@ var BABYLON;
             var endFrame = frameRate * (duration / 1000);
             transition.setKeys([{
                     frame: 0,
-                    value: host[property]
+                    value: host[property].clone ? host[property].clone() : host[property]
                 },
                 {
                     frame: endFrame,
@@ -49609,14 +49609,15 @@ var BABYLON;
             if (this._filesToLoad && this._filesToLoad.length > 0) {
                 var files_1 = [];
                 var folders = [];
+                var items = event.dataTransfer ? event.dataTransfer.items : null;
                 for (var i = 0; i < this._filesToLoad.length; i++) {
                     var fileToLoad = this._filesToLoad[i];
                     var name_1 = fileToLoad.name.toLowerCase();
                     var type = fileToLoad.type;
                     var entry = void 0;
                     fileToLoad.correctName = name_1;
-                    if (event.dataTransfer && event.dataTransfer.items) {
-                        var item = event.dataTransfer.items[i];
+                    if (items) {
+                        var item = items[i];
                         if (item.getAsEntry) {
                             entry = item.getAsEntry();
                         }
@@ -49699,8 +49700,7 @@ var BABYLON;
     var FramingBehavior = (function () {
         function FramingBehavior() {
             this._mode = FramingBehavior.IgnoreBoundsSizeMode;
-            this._relativeRadius = 1.0;
-            this._elevation = 0.3;
+            this._radiusScale = 1.0;
             this._positionY = 0;
             this._defaultElevation = 0.3;
             this._elevationReturnTime = 1500;
@@ -49738,47 +49738,31 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
-        Object.defineProperty(FramingBehavior.prototype, "relativeRadius", {
+        Object.defineProperty(FramingBehavior.prototype, "radiusScale", {
             /**
-             * Gets the radius of the camera relative to the target's bounding box.
+             * Gets the scale applied to the radius
              */
             get: function () {
-                return this._relativeRadius;
+                return this._radiusScale;
             },
             /**
-             * Sets the radius of the camera relative to the target's bounding box.
+             * Sets the scale applied to the radius (1 by default)
              */
             set: function (radius) {
-                this._relativeRadius = radius;
-            },
-            enumerable: true,
-            configurable: true
-        });
-        Object.defineProperty(FramingBehavior.prototype, "elevation", {
-            /**
-             * Gets the elevation of the camera from the target, in radians.
-             */
-            get: function () {
-                return this._elevation;
-            },
-            /**
-             * Sets the elevation of the camera from the target, in radians.
-             */
-            set: function (elevation) {
-                this._elevation = elevation;
+                this._radiusScale = radius;
             },
             enumerable: true,
             configurable: true
         });
         Object.defineProperty(FramingBehavior.prototype, "positionY", {
             /**
-             * Gets the Y offset of the primary model from the camera's focus.
+             * Gets the Y offset of the primary mesh from the camera's focus.
              */
             get: function () {
                 return this._positionY;
             },
             /**
-             * Sets the Y offset of the primary model from the camera's focus.
+             * Sets the Y offset of the primary mesh from the camera's focus.
              */
             set: function (positionY) {
                 this._positionY = positionY;
@@ -49840,13 +49824,13 @@ var BABYLON;
         });
         Object.defineProperty(FramingBehavior.prototype, "zoomStopsAnimation", {
             /**
-            * Gets the flag that indicates if user zooming should stop model animation.
+            * Gets the flag that indicates if user zooming should stop animation.
             */
             get: function () {
                 return this._zoomStopsAnimation;
             },
             /**
-            * Sets the flag that indicates if user zooming should stop model animation.
+            * Sets the flag that indicates if user zooming should stop animation.
             */
             set: function (flag) {
                 this._zoomStopsAnimation = flag;
@@ -49856,13 +49840,13 @@ var BABYLON;
         });
         Object.defineProperty(FramingBehavior.prototype, "framingTime", {
             /**
-             * Gets the transition time when framing the model, in milliseconds
+             * Gets the transition time when framing the mesh, in milliseconds
             */
             get: function () {
                 return this._framingTime;
             },
             /**
-             * Sets the transition time when framing the model, in milliseconds
+             * Sets the transition time when framing the mesh, in milliseconds
             */
             set: function (time) {
                 this._framingTime = time;
@@ -49913,8 +49897,8 @@ var BABYLON;
          * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
          */
         FramingBehavior.prototype.zoomOnMesh = function (mesh, radius, applyToLowerLimit, framingPositionY, focusOnOriginXZ) {
-            if (applyToLowerLimit === void 0) { applyToLowerLimit = false; }
-            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = true; }
+            if (applyToLowerLimit === void 0) { applyToLowerLimit = true; }
+            if (focusOnOriginXZ === void 0) { focusOnOriginXZ = false; }
             if (framingPositionY == null) {
                 framingPositionY = this._positionY;
             }
@@ -49927,12 +49911,11 @@ var BABYLON;
             else {
                 zoomTarget = center.clone();
             }
-            // if (!this._vectorTransition) {
-            // 	this._vectorTransition = Animation.CreateAnimation("target", Animation.ANIMATIONTYPE_VECTOR3, 60, FramingBehavior.EasingFunction);
-            // }			
-            // this._animatables.push(Animation.TransitionTo("target", zoomTarget, this._attachedCamera, this._attachedCamera.getScene(), 
-            // 						60, this._vectorTransition, this._framingTime));
-            this._attachedCamera.setTarget(zoomTarget);
+            if (!this._vectorTransition) {
+                this._vectorTransition = BABYLON.Animation.CreateAnimation("target", BABYLON.Animation.ANIMATIONTYPE_VECTOR3, 60, FramingBehavior.EasingFunction);
+            }
+            this._betaIsAnimating = true;
+            this._animatables.push(BABYLON.Animation.TransitionTo("target", zoomTarget, this._attachedCamera, this._attachedCamera.getScene(), 60, this._vectorTransition, this._framingTime));
             // sets the radius and lower radius bounds
             if (radius == null) {
                 // Small delta ensures camera is not always at lower zoom limit.
@@ -49947,14 +49930,14 @@ var BABYLON;
                 }
             }
             if (applyToLowerLimit) {
-                this._attachedCamera.lowerRadiusLimit = radius;
+                this._attachedCamera.lowerRadiusLimit = mesh.getBoundingInfo().boundingSphere.radiusWorld;
+                ;
             }
             // transition to new radius
-            // if (!this._radiusTransition) {
-            // 	this._radiusTransition = Animation.CreateAnimation("radius", Animation.ANIMATIONTYPE_FLOAT, 60, FramingBehavior.EasingFunction);
-            // }
-            // this._animatables.push(Animation.TransitionTo("radius", radius, this._attachedCamera, this._attachedCamera.getScene(), 
-            // 						60, this._radiusTransition, this._framingTime));															
+            if (!this._radiusTransition) {
+                this._radiusTransition = BABYLON.Animation.CreateAnimation("radius", BABYLON.Animation.ANIMATIONTYPE_FLOAT, 60, FramingBehavior.EasingFunction);
+            }
+            this._animatables.push(BABYLON.Animation.TransitionTo("radius", radius, this._attachedCamera, this._attachedCamera.getScene(), 60, this._radiusTransition, this._framingTime));
         };
         /**
          * Calculates the lowest radius for the camera based on the bounding box of the mesh.
@@ -49970,8 +49953,7 @@ var BABYLON;
             // (Good explanation: http://stackoverflow.com/questions/2866350/move-camera-to-fit-3d-scene)
             var radiusWithoutFraming = boxVectorGlobalDiagonal * 0.5;
             // Horizon distance
-            var sphereRadius = mesh.getBoundingInfo().boundingSphere.radiusWorld;
-            var radius = radiusWithoutFraming * this._relativeRadius;
+            var radius = radiusWithoutFraming * this._radiusScale;
             var distanceForHorizontalFrustum = radius * Math.sqrt(1.0 + 1.0 / (frustumSlope.x * frustumSlope.x));
             var distanceForVerticalFrustum = radius * Math.sqrt(1.0 + 1.0 / (frustumSlope.y * frustumSlope.y));
             var distance = Math.max(distanceForHorizontalFrustum, distanceForVerticalFrustum);
@@ -50050,8 +50032,10 @@ var BABYLON;
         FramingBehavior.prototype.stopAllAnimations = function () {
             this._attachedCamera.animations = [];
             while (this._animatables.length) {
-                this._animatables[0].onAnimationEnd = null;
-                this._animatables[0].stop();
+                if (this._animatables[0]) {
+                    this._animatables[0].onAnimationEnd = null;
+                    this._animatables[0].stop();
+                }
                 this._animatables.shift();
             }
         };
@@ -50074,11 +50058,11 @@ var BABYLON;
         FramingBehavior.EasingMode = BABYLON.EasingFunction.EASINGMODE_EASEINOUT;
         // Statics
         /**
-         * The camera can move all the way towards the model.
+         * The camera can move all the way towards the mesh.
          */
         FramingBehavior.IgnoreBoundsSizeMode = 0;
         /**
-         * The camera is not allowed to zoom closer to the model than the point at which the adjusted bounding sphere touches the frustum sides
+         * The camera is not allowed to zoom closer to the mesh than the point at which the adjusted bounding sphere touches the frustum sides
          */
         FramingBehavior.FitFrustumSidesMode = 1;
         return FramingBehavior;
@@ -50107,6 +50091,7 @@ var BABYLON;
              * Length of the distance animated by the transition when upper radius is reached
              */
             this.upperRadiusTransitionRange = -2;
+            this._autoTransitionRange = false;
             // Animations
             this._radiusIsAnimating = false;
             this._radiusBounceTransition = null;
@@ -50119,6 +50104,42 @@ var BABYLON;
             enumerable: true,
             configurable: true
         });
+        Object.defineProperty(BouncingBehavior.prototype, "autoTransitionRange", {
+            /**
+             * Gets a value indicating if the lowerRadiusTransitionRange and upperRadiusTransitionRange are defined automatically
+             */
+            get: function () {
+                return this._autoTransitionRange;
+            },
+            /**
+             * Sets a value indicating if the lowerRadiusTransitionRange and upperRadiusTransitionRange are defined automatically
+             * Transition ranges will be set to 5% of the bounding box diagonal in world space
+             */
+            set: function (value) {
+                var _this = this;
+                if (this._autoTransitionRange === value) {
+                    return;
+                }
+                this._autoTransitionRange = value;
+                var camera = this._attachedCamera;
+                if (value) {
+                    this._onMeshTargetChangedObserver = camera.onMeshTargetChangedObservable.add(function (mesh) {
+                        if (!mesh) {
+                            return;
+                        }
+                        mesh.computeWorldMatrix(true);
+                        var diagonal = mesh.getBoundingInfo().diagonalLength;
+                        _this.lowerRadiusTransitionRange = diagonal * 0.05;
+                        _this.upperRadiusTransitionRange = diagonal * 0.05;
+                    });
+                }
+                else if (this._onMeshTargetChangedObserver) {
+                    camera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver);
+                }
+            },
+            enumerable: true,
+            configurable: true
+        });
         BouncingBehavior.prototype.attach = function (camera) {
             var _this = this;
             this._attachedCamera = camera;
@@ -50135,6 +50156,9 @@ var BABYLON;
         };
         BouncingBehavior.prototype.detach = function (camera) {
             camera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver);
+            if (this._onMeshTargetChangedObserver) {
+                camera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver);
+            }
         };
         /**
          * Checks if the camera radius is at the specified limit. Takes into account animation locks.

sandbox/index.js

@@ -71,6 +71,12 @@
         currentScene.activeCamera.useAutoRotationBehavior  = true;
         currentScene.activeCamera.useFramingBehavior = true;
 
+        var framingBehavior = currentScene.activeCamera.getBehaviorByName("Framing");
+        framingBehavior.framingTime = 0;
+
+        var bouncingBehavior = currentScene.activeCamera.getBehaviorByName("Bouncing");
+        bouncingBehavior.autoTransitionRange = true;        
+
         if (currentScene.meshes.length) {
             // Let's zoom on the first object with geometry
             for (var index = 0; index < currentScene.meshes.length; index++) {

src/Animations/babylon.animation.ts

@@ -208,7 +208,7 @@
 
 			transition.setKeys([{
 				frame: 0,
-				value: host[property]
+				value: host[property].clone ? host[property].clone() : host[property]
 			},
 			{
 				frame: endFrame,

src/Behaviors/Cameras/babylon.bouncingBehavior.ts

@@ -32,10 +32,49 @@ module BABYLON {
          */
         public upperRadiusTransitionRange = -2;          
 
+		private _autoTransitionRange = false;
+
+		/**
+		 * Gets a value indicating if the lowerRadiusTransitionRange and upperRadiusTransitionRange are defined automatically
+		 */
+		public get autoTransitionRange(): boolean {
+			return this._autoTransitionRange;
+		}
+
+		/**
+		 * Sets a value indicating if the lowerRadiusTransitionRange and upperRadiusTransitionRange are defined automatically
+		 * Transition ranges will be set to 5% of the bounding box diagonal in world space
+		 */
+		public set autoTransitionRange(value: boolean) {
+			if (this._autoTransitionRange === value) {
+				return;
+			}
+
+			this._autoTransitionRange = value;
+
+			let camera = this._attachedCamera;
+
+			if (value) {
+				this._onMeshTargetChangedObserver = camera.onMeshTargetChangedObservable.add((mesh) => {
+					if (!mesh) {
+						return;
+					}
+
+					mesh.computeWorldMatrix(true);
+					let diagonal = mesh.getBoundingInfo().diagonalLength;
+
+					this.lowerRadiusTransitionRange = diagonal * 0.05;
+					this.upperRadiusTransitionRange = diagonal * 0.05;
+				});
+			} else if (this._onMeshTargetChangedObserver) {
+				camera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver);
+			}
+		}
         
         // Connection
         private _attachedCamera: ArcRotateCamera;
-        private _onAfterCheckInputsObserver: Observer<Camera>;
+		private _onAfterCheckInputsObserver: Observer<Camera>;	
+		private _onMeshTargetChangedObserver: Observer<AbstractMesh>;
         public attach(camera: ArcRotateCamera): void {
             this._attachedCamera = camera;
             this._onAfterCheckInputsObserver = camera.onAfterCheckInputsObservable.add(() => {
@@ -52,7 +91,10 @@ module BABYLON {
         }
         
         public detach(camera: ArcRotateCamera): void {
-            camera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver);
+			camera.onAfterCheckInputsObservable.remove(this._onAfterCheckInputsObserver);
+			if (this._onMeshTargetChangedObserver) {
+				camera.onMeshTargetChangedObservable.remove(this._onMeshTargetChangedObserver);
+			}
         }
 
         // Animations

src/Behaviors/Cameras/babylon.framingBehavior.ts

@@ -5,8 +5,7 @@ module BABYLON {
         }
 
         private _mode = FramingBehavior.IgnoreBoundsSizeMode;
-        private _relativeRadius = 1.0;
-        private _elevation = 0.3;
+        private _radiusScale = 1.0;
         private _positionY = 0;
         private _defaultElevation = 0.3;
         private _elevationReturnTime = 1500;
@@ -39,42 +38,28 @@ module BABYLON {
         }
         
 	    /**
-		 * Sets the radius of the camera relative to the target's bounding box.
+		 * Sets the scale applied to the radius (1 by default)
 		 */
-		public set relativeRadius(radius: number) {
-			this._relativeRadius = radius;
+		public set radiusScale(radius: number) {
+			this._radiusScale = radius;
 		}
 
 		/**
-		 * Gets the radius of the camera relative to the target's bounding box.
+		 * Gets the scale applied to the radius
 		 */
-		public get relativeRadius(): number {
-			return this._relativeRadius;
+		public get radiusScale(): number {
+			return this._radiusScale;
 		}
 
 		/**
-		 * Sets the elevation of the camera from the target, in radians.
-		 */
-		public set elevation(elevation: number) {
-			this._elevation = elevation;
-		}
-
-		/**
-		 * Gets the elevation of the camera from the target, in radians.
-		 */
-		public get elevation(): number {
-			return this._elevation;
-		}
-
-		/**
-		 * Sets the Y offset of the primary model from the camera's focus.
+		 * Sets the Y offset of the target mesh from the camera's focus.
 		 */
 		public set positionY(positionY: number) {
 			this._positionY = positionY;
 		}
 
 		/**
-		 * Gets the Y offset of the primary model from the camera's focus.
+		 * Gets the Y offset of the target mesh from the camera's focus.
 		 */
 		public get positionY(): number {
 			return this._positionY;
@@ -127,28 +112,28 @@ module BABYLON {
 		}
 
 		/**
-		* Sets the flag that indicates if user zooming should stop model animation.
+		* Sets the flag that indicates if user zooming should stop animation.
 		*/
 		public set zoomStopsAnimation(flag: boolean) {
 			this._zoomStopsAnimation = flag;
 		}
 
 		/**
-		* Gets the flag that indicates if user zooming should stop model animation.
+		* Gets the flag that indicates if user zooming should stop animation.
 		*/
 		public get zoomStopsAnimation(): boolean {
 			return this._zoomStopsAnimation;
         }       
         	
 		/**
-		 * Sets the transition time when framing the model, in milliseconds
+		 * Sets the transition time when framing the mesh, in milliseconds
 		*/
 		public set framingTime(time: number) {
 			this._framingTime = time;
 		}
 
         /**
-         * Gets the transition time when framing the model, in milliseconds
+         * Gets the transition time when framing the mesh, in milliseconds
         */
         public get framingTime() {
             return this._framingTime;
@@ -221,7 +206,7 @@ module BABYLON {
 		 * @param framingPositionY Position on mesh to center camera focus where 0 corresponds bottom of its bounding box and 1, the top
 		 * @param focusOnOriginXZ Determines if the camera should focus on 0 in the X and Z axis instead of the mesh
 		 */
-		public zoomOnMesh(mesh: AbstractMesh, radius?: number, applyToLowerLimit: boolean = false, framingPositionY?: number, focusOnOriginXZ: boolean = false): void {
+		public zoomOnMesh(mesh: AbstractMesh, radius?: number, applyToLowerLimit: boolean = true, framingPositionY?: number, focusOnOriginXZ: boolean = false): void {
 			if (framingPositionY == null) {
 				framingPositionY = this._positionY;
 			}
@@ -241,6 +226,7 @@ module BABYLON {
 				this._vectorTransition = Animation.CreateAnimation("target", Animation.ANIMATIONTYPE_VECTOR3, 60, FramingBehavior.EasingFunction);
 			}			
 
+			this._betaIsAnimating = true;
 			this._animatables.push(Animation.TransitionTo("target", zoomTarget, this._attachedCamera, this._attachedCamera.getScene(), 
 									60, this._vectorTransition, this._framingTime));
 
@@ -258,16 +244,16 @@ module BABYLON {
 			}
 
 			if (applyToLowerLimit) {
-				this._attachedCamera.lowerRadiusLimit = radius;
+				this._attachedCamera.lowerRadiusLimit = mesh.getBoundingInfo().boundingSphere.radiusWorld;;
 			}
 
 			// transition to new radius
-			// if (!this._radiusTransition) {
-			// 	this._radiusTransition = Animation.CreateAnimation("radius", Animation.ANIMATIONTYPE_FLOAT, 60, FramingBehavior.EasingFunction);
-			// }
+			if (!this._radiusTransition) {
+				this._radiusTransition = Animation.CreateAnimation("radius", Animation.ANIMATIONTYPE_FLOAT, 60, FramingBehavior.EasingFunction);
+			}
 
-			// this._animatables.push(Animation.TransitionTo("radius", radius, this._attachedCamera, this._attachedCamera.getScene(), 
-			// 						60, this._radiusTransition, this._framingTime));															
+			this._animatables.push(Animation.TransitionTo("radius", radius, this._attachedCamera, this._attachedCamera.getScene(), 
+									60, this._radiusTransition, this._framingTime));															
 		}	
 		
 		/**
@@ -286,8 +272,7 @@ module BABYLON {
 			let radiusWithoutFraming = boxVectorGlobalDiagonal * 0.5;
 
 			// Horizon distance
-			let sphereRadius = mesh.getBoundingInfo().boundingSphere.radiusWorld;
-			let radius = radiusWithoutFraming * this._relativeRadius;
+			let radius = radiusWithoutFraming * this._radiusScale;
 			let distanceForHorizontalFrustum = radius * Math.sqrt(1.0 + 1.0 / (frustumSlope.x * frustumSlope.x));
 			let distanceForVerticalFrustum = radius * Math.sqrt(1.0 + 1.0 / (frustumSlope.y * frustumSlope.y));
 			let distance = Math.max(distanceForHorizontalFrustum, distanceForVerticalFrustum);
@@ -382,8 +367,10 @@ module BABYLON {
         public stopAllAnimations(): void {
 			this._attachedCamera.animations = [];
 			while (this._animatables.length) {
-				this._animatables[0].onAnimationEnd = null;
-				this._animatables[0].stop();
+				if (this._animatables[0]) {
+					this._animatables[0].onAnimationEnd = null;
+					this._animatables[0].stop();
+				}
 				this._animatables.shift();
 			}
 		}        
@@ -401,12 +388,12 @@ module BABYLON {
         // Statics
 
         /**
-         * The camera can move all the way towards the model.
+         * The camera can move all the way towards the mesh.
          */
         public static IgnoreBoundsSizeMode = 0;
 
         /**
-         * The camera is not allowed to zoom closer to the model than the point at which the adjusted bounding sphere touches the frustum sides
+         * The camera is not allowed to zoom closer to the mesh than the point at which the adjusted bounding sphere touches the frustum sides
          */
         public static FitFrustumSidesMode = 1;
     }

src/Tools/babylon.filesInput.ts

@@ -128,6 +128,8 @@
         
                 let files = [];
                 let folders = [];
+                var items = event.dataTransfer ? event.dataTransfer.items : null;
+
                 for (var i = 0; i < this._filesToLoad.length; i++) {
                     let fileToLoad:any =  this._filesToLoad[i];
                     let name = fileToLoad.name.toLowerCase();
@@ -136,8 +138,8 @@
 
                     fileToLoad.correctName = name;
                     
-                    if (event.dataTransfer && event.dataTransfer.items) {
-                        let item = event.dataTransfer.items[i];
+                    if (items) {
+                        let item = items[i];
                         if (item.getAsEntry) {
                             entry = item.getAsEntry();
                         } else if (item.webkitGetAsEntry) {