Fixing an issue with touch devices

dist/preview release/babylon.max.js

@@ -4035,9 +4035,9 @@ var BABYLON;
         Tools.GetPointerPrefix = function () {
             var eventPrefix = "pointer";
             // Check if hand.js is referenced or if the browser natively supports pointer events
-            if (!navigator.pointerEnabled) {
-                eventPrefix = "mouse";
-            }
+            //if (!navigator.pointerEnabled) {
+            //    eventPrefix = "mouse";
+            //}
             return eventPrefix;
         };
         Tools.QueueNewFrame = function (func) {
@@ -10911,7 +10911,7 @@ var BABYLON;
             ]);
         };
         FreeCamera.prototype.detachControl = function (element) {
-            if (this._attachedElement != element) {
+            if (this._attachedElement !== element) {
                 return;
             }
             element.removeEventListener("mousedown", this._onMouseDown);
@@ -11182,7 +11182,7 @@ var BABYLON;
             ]);
         };
         TouchCamera.prototype.detachControl = function (canvas) {
-            if (this._attachedCanvas != canvas) {
+            if (this._attachedCanvas !== canvas) {
                 return;
             }
             canvas.removeEventListener("pointerdown", this._onPointerDown);

src/Cameras/babylon.freeCamera.js

@@ -148,7 +148,7 @@ var BABYLON;
             ]);
         };
         FreeCamera.prototype.detachControl = function (element) {
-            if (this._attachedElement != element) {
+            if (this._attachedElement !== element) {
                 return;
             }
             element.removeEventListener("mousedown", this._onMouseDown);

src/Cameras/babylon.freeCamera.ts

@@ -1,278 +1,278 @@
-module BABYLON {
-    export class FreeCamera extends TargetCamera {
-        public ellipsoid = new Vector3(0.5, 1, 0.5);
-        public keysUp = [38];
-        public keysDown = [40];
-        public keysLeft = [37];
-        public keysRight = [39];
-        public checkCollisions = false;
-        public applyGravity = false;
-        public angularSensibility = 2000.0;
-        public onCollide: (collidedMesh: AbstractMesh) => void;
-
-        private _keys = [];
-        private _collider = new Collider();
-        private _needMoveForGravity = false;
-        private _oldPosition = Vector3.Zero();
-        private _diffPosition = Vector3.Zero();
-        private _newPosition = Vector3.Zero();
-        private _attachedElement: HTMLElement;
-        private _localDirection: Vector3;
-        private _transformedDirection: Vector3;
-
-        private _onMouseDown: (e: MouseEvent) => any;
-        private _onMouseUp: (e: MouseEvent) => any;
-        private _onMouseOut: (e: MouseEvent) => any;
-        private _onMouseMove: (e: MouseEvent) => any;
-        private _onKeyDown: (e: KeyboardEvent) => any;
-        private _onKeyUp: (e: KeyboardEvent) => any;
-        public _onLostFocus: (e: FocusEvent) => any;
-
-        public _waitingLockedTargetId: string;
-
-        constructor(name: string, position: Vector3, scene: Scene) {
-            super(name, position, scene);
-        }
-
-        // Controls
-        public attachControl(element: HTMLElement, noPreventDefault?: boolean): void {
-            var previousPosition;
-            var engine = this.getEngine();
-
-            if (this._attachedElement) {
-                return;
-            }
-            this._attachedElement = element;
-
-            if (this._onMouseDown === undefined) {
-                this._onMouseDown = evt => {
-                    previousPosition = {
-                        x: evt.clientX,
-                        y: evt.clientY
-                    };
-
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-                };
-
-                this._onMouseUp = evt => {
-                    previousPosition = null;
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-                };
-
-                this._onMouseOut = evt => {
-                    previousPosition = null;
-                    this._keys = [];
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-                };
-
-                this._onMouseMove = evt => {
-                    if (!previousPosition && !engine.isPointerLock) {
-                        return;
-                    }
-
-                    var offsetX;
-                    var offsetY;
-
-                    if (!engine.isPointerLock) {
-                        offsetX = evt.clientX - previousPosition.x;
-                        offsetY = evt.clientY - previousPosition.y;
-                    } else {
-                        offsetX = evt.movementX || evt.mozMovementX || evt.webkitMovementX || evt.msMovementX || 0;
-                        offsetY = evt.movementY || evt.mozMovementY || evt.webkitMovementY || evt.msMovementY || 0;
-                    }
-
-                    this.cameraRotation.y += offsetX / this.angularSensibility;
-                    this.cameraRotation.x += offsetY / this.angularSensibility;
-
-                    previousPosition = {
-                        x: evt.clientX,
-                        y: evt.clientY
-                    };
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-                };
-
-                this._onKeyDown = evt => {
-                    if (this.keysUp.indexOf(evt.keyCode) !== -1 ||
-                        this.keysDown.indexOf(evt.keyCode) !== -1 ||
-                        this.keysLeft.indexOf(evt.keyCode) !== -1 ||
-                        this.keysRight.indexOf(evt.keyCode) !== -1) {
-                        var index = this._keys.indexOf(evt.keyCode);
-
-                        if (index === -1) {
-                            this._keys.push(evt.keyCode);
-                        }
-                        if (!noPreventDefault) {
-                            evt.preventDefault();
-                        }
-                    }
-                };
-
-                this._onKeyUp = evt => {
-                    if (this.keysUp.indexOf(evt.keyCode) !== -1 ||
-                        this.keysDown.indexOf(evt.keyCode) !== -1 ||
-                        this.keysLeft.indexOf(evt.keyCode) !== -1 ||
-                        this.keysRight.indexOf(evt.keyCode) !== -1) {
-                        var index = this._keys.indexOf(evt.keyCode);
-
-                        if (index >= 0) {
-                            this._keys.splice(index, 1);
-                        }
-                        if (!noPreventDefault) {
-                            evt.preventDefault();
-                        }
-                    }
-                };
-
-                this._onLostFocus = () => {
-                    this._keys = [];
-                };
-
-                this._reset = () => {
-                    this._keys = [];
-                    previousPosition = null;
-                    this.cameraDirection = new Vector3(0, 0, 0);
-                    this.cameraRotation = new Vector2(0, 0);
-                };
-            }
-
-            element.addEventListener("mousedown", this._onMouseDown, false);
-            element.addEventListener("mouseup", this._onMouseUp, false);
-            element.addEventListener("mouseout", this._onMouseOut, false);
-            element.addEventListener("mousemove", this._onMouseMove, false);
-
-            Tools.RegisterTopRootEvents([
-                { name: "keydown", handler: this._onKeyDown },
-                { name: "keyup", handler: this._onKeyUp },
-                { name: "blur", handler: this._onLostFocus }
-            ]);
-        }
-
-        public detachControl(element: HTMLElement): void {
-            if (this._attachedElement != element) {
-                return;
-            }
-
-            element.removeEventListener("mousedown", this._onMouseDown);
-            element.removeEventListener("mouseup", this._onMouseUp);
-            element.removeEventListener("mouseout", this._onMouseOut);
-            element.removeEventListener("mousemove", this._onMouseMove);
-
-            Tools.UnregisterTopRootEvents([
-                { name: "keydown", handler: this._onKeyDown },
-                { name: "keyup", handler: this._onKeyUp },
-                { name: "blur", handler: this._onLostFocus }
-            ]);
-
-            this._attachedElement = null;
-            if (this._reset) {
-                this._reset();
-            }
-        }
-
-        public _collideWithWorld(velocity: Vector3): void {
-            var globalPosition: Vector3;
-
-            if (this.parent) {
-                globalPosition = Vector3.TransformCoordinates(this.position, this.parent.getWorldMatrix());
-            } else {
-                globalPosition = this.position;
-            }
-
-            globalPosition.subtractFromFloatsToRef(0, this.ellipsoid.y, 0, this._oldPosition);
-            this._collider.radius = this.ellipsoid;
-
-            //no need for clone, as long as gravity is not on.
-            var actualVelocity = velocity;
-			
-            //add gravity to the velocity to prevent the dual-collision checking
-            if (this.applyGravity) {
-                //this prevents mending with cameraDirection, a global variable of the free camera class.
-                actualVelocity = velocity.add(this.getScene().gravity);
-            }
-
-            this.getScene().collisionCoordinator.getNewPosition(this._oldPosition, actualVelocity, this._collider, 3, null, this._onCollisionPositionChange, this.uniqueId);
-
-        }
-
-        private _onCollisionPositionChange = (collisionId: number, newPosition: Vector3, collidedMesh: AbstractMesh = null) => {
-            //TODO move this to the collision coordinator!
-            if (this.getScene().workerCollisions)
-                newPosition.multiplyInPlace(this._collider.radius);
-
-            var updatePosition = (newPos) => {
-                this._newPosition.copyFrom(newPos);
-
-                this._newPosition.subtractToRef(this._oldPosition, this._diffPosition);
-
-                var oldPosition = this.position.clone();
-                if (this._diffPosition.length() > Engine.CollisionsEpsilon) {
-                    this.position.addInPlace(this._diffPosition);
-                    if (this.onCollide && collidedMesh) {
-                        this.onCollide(collidedMesh);
-                    }
-                }
-            }
-
-            updatePosition(newPosition);
-        }
-
-        public _checkInputs(): void {
-            if (!this._localDirection) {
-                this._localDirection = Vector3.Zero();
-                this._transformedDirection = Vector3.Zero();
-            }
-
-            // Keyboard
-            for (var index = 0; index < this._keys.length; index++) {
-                var keyCode = this._keys[index];
-                var speed = this._computeLocalCameraSpeed();
-
-                if (this.keysLeft.indexOf(keyCode) !== -1) {
-                    this._localDirection.copyFromFloats(-speed, 0, 0);
-                } else if (this.keysUp.indexOf(keyCode) !== -1) {
-                    this._localDirection.copyFromFloats(0, 0, speed);
-                } else if (this.keysRight.indexOf(keyCode) !== -1) {
-                    this._localDirection.copyFromFloats(speed, 0, 0);
-                } else if (this.keysDown.indexOf(keyCode) !== -1) {
-                    this._localDirection.copyFromFloats(0, 0, -speed);
-                }
-
-                this.getViewMatrix().invertToRef(this._cameraTransformMatrix);
-                Vector3.TransformNormalToRef(this._localDirection, this._cameraTransformMatrix, this._transformedDirection);
-                this.cameraDirection.addInPlace(this._transformedDirection);
-            }
-
-            super._checkInputs();
-        }
-
-        public _decideIfNeedsToMove(): boolean {
-            return this._needMoveForGravity || Math.abs(this.cameraDirection.x) > 0 || Math.abs(this.cameraDirection.y) > 0 || Math.abs(this.cameraDirection.z) > 0;
-        }
-
-        public _updatePosition(): void {
-            if (this.checkCollisions && this.getScene().collisionsEnabled) {
-                this._collideWithWorld(this.cameraDirection);
-            } else {
-                this.position.addInPlace(this.cameraDirection);
-            }
-        }
-
-        public serialize(): any {
-            var serializationObject = super.serialize();
-
-            serializationObject.checkCollisions = this.checkCollisions;
-            serializationObject.applyGravity = this.applyGravity;
-            serializationObject.ellipsoid = this.ellipsoid.asArray();
-
-            return serializationObject;
-        }
-    }
-} 
+module BABYLON {
+    export class FreeCamera extends TargetCamera {
+        public ellipsoid = new Vector3(0.5, 1, 0.5);
+        public keysUp = [38];
+        public keysDown = [40];
+        public keysLeft = [37];
+        public keysRight = [39];
+        public checkCollisions = false;
+        public applyGravity = false;
+        public angularSensibility = 2000.0;
+        public onCollide: (collidedMesh: AbstractMesh) => void;
+
+        private _keys = [];
+        private _collider = new Collider();
+        private _needMoveForGravity = false;
+        private _oldPosition = Vector3.Zero();
+        private _diffPosition = Vector3.Zero();
+        private _newPosition = Vector3.Zero();
+        private _attachedElement: HTMLElement;
+        private _localDirection: Vector3;
+        private _transformedDirection: Vector3;
+
+        private _onMouseDown: (e: MouseEvent) => any;
+        private _onMouseUp: (e: MouseEvent) => any;
+        private _onMouseOut: (e: MouseEvent) => any;
+        private _onMouseMove: (e: MouseEvent) => any;
+        private _onKeyDown: (e: KeyboardEvent) => any;
+        private _onKeyUp: (e: KeyboardEvent) => any;
+        public _onLostFocus: (e: FocusEvent) => any;
+
+        public _waitingLockedTargetId: string;
+
+        constructor(name: string, position: Vector3, scene: Scene) {
+            super(name, position, scene);
+        }
+
+        // Controls
+        public attachControl(element: HTMLElement, noPreventDefault?: boolean): void {
+            var previousPosition;
+            var engine = this.getEngine();
+
+            if (this._attachedElement) {
+                return;
+            }
+            this._attachedElement = element;
+
+            if (this._onMouseDown === undefined) {
+                this._onMouseDown = evt => {
+                    previousPosition = {
+                        x: evt.clientX,
+                        y: evt.clientY
+                    };
+
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+                };
+
+                this._onMouseUp = evt => {
+                    previousPosition = null;
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+                };
+
+                this._onMouseOut = evt => {
+                    previousPosition = null;
+                    this._keys = [];
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+                };
+
+                this._onMouseMove = evt => {
+                    if (!previousPosition && !engine.isPointerLock) {
+                        return;
+                    }
+
+                    var offsetX;
+                    var offsetY;
+
+                    if (!engine.isPointerLock) {
+                        offsetX = evt.clientX - previousPosition.x;
+                        offsetY = evt.clientY - previousPosition.y;
+                    } else {
+                        offsetX = evt.movementX || evt.mozMovementX || evt.webkitMovementX || evt.msMovementX || 0;
+                        offsetY = evt.movementY || evt.mozMovementY || evt.webkitMovementY || evt.msMovementY || 0;
+                    }
+
+                    this.cameraRotation.y += offsetX / this.angularSensibility;
+                    this.cameraRotation.x += offsetY / this.angularSensibility;
+
+                    previousPosition = {
+                        x: evt.clientX,
+                        y: evt.clientY
+                    };
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+                };
+
+                this._onKeyDown = evt => {
+                    if (this.keysUp.indexOf(evt.keyCode) !== -1 ||
+                        this.keysDown.indexOf(evt.keyCode) !== -1 ||
+                        this.keysLeft.indexOf(evt.keyCode) !== -1 ||
+                        this.keysRight.indexOf(evt.keyCode) !== -1) {
+                        var index = this._keys.indexOf(evt.keyCode);
+
+                        if (index === -1) {
+                            this._keys.push(evt.keyCode);
+                        }
+                        if (!noPreventDefault) {
+                            evt.preventDefault();
+                        }
+                    }
+                };
+
+                this._onKeyUp = evt => {
+                    if (this.keysUp.indexOf(evt.keyCode) !== -1 ||
+                        this.keysDown.indexOf(evt.keyCode) !== -1 ||
+                        this.keysLeft.indexOf(evt.keyCode) !== -1 ||
+                        this.keysRight.indexOf(evt.keyCode) !== -1) {
+                        var index = this._keys.indexOf(evt.keyCode);
+
+                        if (index >= 0) {
+                            this._keys.splice(index, 1);
+                        }
+                        if (!noPreventDefault) {
+                            evt.preventDefault();
+                        }
+                    }
+                };
+
+                this._onLostFocus = () => {
+                    this._keys = [];
+                };
+
+                this._reset = () => {
+                    this._keys = [];
+                    previousPosition = null;
+                    this.cameraDirection = new Vector3(0, 0, 0);
+                    this.cameraRotation = new Vector2(0, 0);
+                };
+            }
+
+            element.addEventListener("mousedown", this._onMouseDown, false);
+            element.addEventListener("mouseup", this._onMouseUp, false);
+            element.addEventListener("mouseout", this._onMouseOut, false);
+            element.addEventListener("mousemove", this._onMouseMove, false);
+
+            Tools.RegisterTopRootEvents([
+                { name: "keydown", handler: this._onKeyDown },
+                { name: "keyup", handler: this._onKeyUp },
+                { name: "blur", handler: this._onLostFocus }
+            ]);
+        }
+
+        public detachControl(element: HTMLElement): void {
+            if (this._attachedElement !== element) {
+                return;
+            }
+
+            element.removeEventListener("mousedown", this._onMouseDown);
+            element.removeEventListener("mouseup", this._onMouseUp);
+            element.removeEventListener("mouseout", this._onMouseOut);
+            element.removeEventListener("mousemove", this._onMouseMove);
+
+            Tools.UnregisterTopRootEvents([
+                { name: "keydown", handler: this._onKeyDown },
+                { name: "keyup", handler: this._onKeyUp },
+                { name: "blur", handler: this._onLostFocus }
+            ]);
+
+            this._attachedElement = null;
+            if (this._reset) {
+                this._reset();
+            }
+        }
+
+        public _collideWithWorld(velocity: Vector3): void {
+            var globalPosition: Vector3;
+
+            if (this.parent) {
+                globalPosition = Vector3.TransformCoordinates(this.position, this.parent.getWorldMatrix());
+            } else {
+                globalPosition = this.position;
+            }
+
+            globalPosition.subtractFromFloatsToRef(0, this.ellipsoid.y, 0, this._oldPosition);
+            this._collider.radius = this.ellipsoid;
+
+            //no need for clone, as long as gravity is not on.
+            var actualVelocity = velocity;
+			
+            //add gravity to the velocity to prevent the dual-collision checking
+            if (this.applyGravity) {
+                //this prevents mending with cameraDirection, a global variable of the free camera class.
+                actualVelocity = velocity.add(this.getScene().gravity);
+            }
+
+            this.getScene().collisionCoordinator.getNewPosition(this._oldPosition, actualVelocity, this._collider, 3, null, this._onCollisionPositionChange, this.uniqueId);
+
+        }
+
+        private _onCollisionPositionChange = (collisionId: number, newPosition: Vector3, collidedMesh: AbstractMesh = null) => {
+            //TODO move this to the collision coordinator!
+            if (this.getScene().workerCollisions)
+                newPosition.multiplyInPlace(this._collider.radius);
+
+            var updatePosition = (newPos) => {
+                this._newPosition.copyFrom(newPos);
+
+                this._newPosition.subtractToRef(this._oldPosition, this._diffPosition);
+
+                var oldPosition = this.position.clone();
+                if (this._diffPosition.length() > Engine.CollisionsEpsilon) {
+                    this.position.addInPlace(this._diffPosition);
+                    if (this.onCollide && collidedMesh) {
+                        this.onCollide(collidedMesh);
+                    }
+                }
+            }
+
+            updatePosition(newPosition);
+        }
+
+        public _checkInputs(): void {
+            if (!this._localDirection) {
+                this._localDirection = Vector3.Zero();
+                this._transformedDirection = Vector3.Zero();
+            }
+
+            // Keyboard
+            for (var index = 0; index < this._keys.length; index++) {
+                var keyCode = this._keys[index];
+                var speed = this._computeLocalCameraSpeed();
+
+                if (this.keysLeft.indexOf(keyCode) !== -1) {
+                    this._localDirection.copyFromFloats(-speed, 0, 0);
+                } else if (this.keysUp.indexOf(keyCode) !== -1) {
+                    this._localDirection.copyFromFloats(0, 0, speed);
+                } else if (this.keysRight.indexOf(keyCode) !== -1) {
+                    this._localDirection.copyFromFloats(speed, 0, 0);
+                } else if (this.keysDown.indexOf(keyCode) !== -1) {
+                    this._localDirection.copyFromFloats(0, 0, -speed);
+                }
+
+                this.getViewMatrix().invertToRef(this._cameraTransformMatrix);
+                Vector3.TransformNormalToRef(this._localDirection, this._cameraTransformMatrix, this._transformedDirection);
+                this.cameraDirection.addInPlace(this._transformedDirection);
+            }
+
+            super._checkInputs();
+        }
+
+        public _decideIfNeedsToMove(): boolean {
+            return this._needMoveForGravity || Math.abs(this.cameraDirection.x) > 0 || Math.abs(this.cameraDirection.y) > 0 || Math.abs(this.cameraDirection.z) > 0;
+        }
+
+        public _updatePosition(): void {
+            if (this.checkCollisions && this.getScene().collisionsEnabled) {
+                this._collideWithWorld(this.cameraDirection);
+            } else {
+                this.position.addInPlace(this.cameraDirection);
+            }
+        }
+
+        public serialize(): any {
+            var serializationObject = super.serialize();
+
+            serializationObject.checkCollisions = this.checkCollisions;
+            serializationObject.applyGravity = this.applyGravity;
+            serializationObject.ellipsoid = this.ellipsoid.asArray();
+
+            return serializationObject;
+        }
+    }
+} 

src/Cameras/babylon.touchCamera.js

@@ -82,7 +82,7 @@ var BABYLON;
             ]);
         };
         TouchCamera.prototype.detachControl = function (canvas) {
-            if (this._attachedCanvas != canvas) {
+            if (this._attachedCanvas !== canvas) {
                 return;
             }
             canvas.removeEventListener("pointerdown", this._onPointerDown);

src/Cameras/babylon.touchCamera.ts

@@ -1,139 +1,139 @@
-module BABYLON {
-    // We're mainly based on the logic defined into the FreeCamera code
-    export class TouchCamera extends FreeCamera {
-        private _offsetX: number = null;
-        private _offsetY: number = null;
-        private _pointerCount:number = 0;
-        private _pointerPressed = [];
-        private _attachedCanvas: HTMLCanvasElement;
-        private _onPointerDown: (e: PointerEvent) => any;
-        private _onPointerUp: (e: PointerEvent) => any;
-        private _onPointerMove: (e: PointerEvent) => any;
-
-        public angularSensibility: number = 200000.0;
-        public moveSensibility: number = 500.0;
-
-        constructor(name: string, position: Vector3, scene: Scene) {
-            super(name, position, scene);
-        }
-
-        public attachControl(canvas: HTMLCanvasElement, noPreventDefault: boolean): void {
-            var previousPosition;
-
-            if (this._attachedCanvas) {
-                return;
-            }
-            this._attachedCanvas = canvas;
-
-            if (this._onPointerDown === undefined) {
-
-                this._onPointerDown = (evt) => {
-
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-
-                    this._pointerPressed.push(evt.pointerId);
-
-                    if (this._pointerPressed.length !== 1) {
-                        return;
-                    }
-
-                    previousPosition = {
-                        x: evt.clientX,
-                        y: evt.clientY
-                    };
-                };
-
-                this._onPointerUp = (evt) => {
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-
-                    var index: number = this._pointerPressed.indexOf(evt.pointerId);
-
-                    if (index === -1) {
-                        return;
-                    }
-                    this._pointerPressed.splice(index, 1);
-
-                    if (index != 0) {
-                        return;
-                    }
-                    previousPosition = null;
-                    this._offsetX = null;
-                    this._offsetY = null;
-                };
-
-                this._onPointerMove = (evt) => {
-                    if (!noPreventDefault) {
-                        evt.preventDefault();
-                    }
-
-                    if (!previousPosition) {
-                        return;
-                    }
-
-                    var index: number = this._pointerPressed.indexOf(evt.pointerId);
-
-                    if (index != 0) {
-                        return;
-                    }
-
-                    this._offsetX = evt.clientX - previousPosition.x;
-                    this._offsetY = -(evt.clientY - previousPosition.y);
-                };
-
-                this._onLostFocus = () => {
-                    this._offsetX = null;
-                    this._offsetY = null;
-                };
-            }
-
-            canvas.addEventListener("pointerdown", this._onPointerDown);
-            canvas.addEventListener("pointerup", this._onPointerUp);
-            canvas.addEventListener("pointerout", this._onPointerUp);
-            canvas.addEventListener("pointermove", this._onPointerMove);
-
-            Tools.RegisterTopRootEvents([
-                { name: "blur", handler: this._onLostFocus }
-            ]);
-        }
-
-        public detachControl(canvas: HTMLCanvasElement): void {
-            if (this._attachedCanvas != canvas) {
-                return;
-            }
-
-            canvas.removeEventListener("pointerdown", this._onPointerDown);
-            canvas.removeEventListener("pointerup", this._onPointerUp);
-            canvas.removeEventListener("pointerout", this._onPointerUp);
-            canvas.removeEventListener("pointermove", this._onPointerMove);
-
-            Tools.UnregisterTopRootEvents([
-                { name: "blur", handler: this._onLostFocus }
-            ]);
-
-            this._attachedCanvas = null;
-        }
-
-        public _checkInputs(): void {
-            if (this._offsetX) {
-
-                this.cameraRotation.y += this._offsetX / this.angularSensibility;
-
-                if (this._pointerPressed.length > 1) {
-                    this.cameraRotation.x += -this._offsetY / this.angularSensibility;
-                } else {
-                    var speed = this._computeLocalCameraSpeed();
-                    var direction = new Vector3(0, 0, speed * this._offsetY / this.moveSensibility);
-
-                    Matrix.RotationYawPitchRollToRef(this.rotation.y, this.rotation.x, 0, this._cameraRotationMatrix);
-                    this.cameraDirection.addInPlace(Vector3.TransformCoordinates(direction, this._cameraRotationMatrix));
-                }
-            }
-
-            super._checkInputs();
-        }
-    }
+module BABYLON {
+    // We're mainly based on the logic defined into the FreeCamera code
+    export class TouchCamera extends FreeCamera {
+        private _offsetX: number = null;
+        private _offsetY: number = null;
+        private _pointerCount:number = 0;
+        private _pointerPressed = [];
+        private _attachedCanvas: HTMLCanvasElement;
+        private _onPointerDown: (e: PointerEvent) => any;
+        private _onPointerUp: (e: PointerEvent) => any;
+        private _onPointerMove: (e: PointerEvent) => any;
+
+        public angularSensibility: number = 200000.0;
+        public moveSensibility: number = 500.0;
+
+        constructor(name: string, position: Vector3, scene: Scene) {
+            super(name, position, scene);
+        }
+
+        public attachControl(canvas: HTMLCanvasElement, noPreventDefault: boolean): void {
+            var previousPosition;
+
+            if (this._attachedCanvas) {
+                return;
+            }
+            this._attachedCanvas = canvas;
+
+            if (this._onPointerDown === undefined) {
+
+                this._onPointerDown = (evt) => {
+
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+
+                    this._pointerPressed.push(evt.pointerId);
+
+                    if (this._pointerPressed.length !== 1) {
+                        return;
+                    }
+
+                    previousPosition = {
+                        x: evt.clientX,
+                        y: evt.clientY
+                    };
+                };
+
+                this._onPointerUp = (evt) => {
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+
+                    var index: number = this._pointerPressed.indexOf(evt.pointerId);
+
+                    if (index === -1) {
+                        return;
+                    }
+                    this._pointerPressed.splice(index, 1);
+
+                    if (index != 0) {
+                        return;
+                    }
+                    previousPosition = null;
+                    this._offsetX = null;
+                    this._offsetY = null;
+                };
+
+                this._onPointerMove = (evt) => {
+                    if (!noPreventDefault) {
+                        evt.preventDefault();
+                    }
+
+                    if (!previousPosition) {
+                        return;
+                    }
+
+                    var index: number = this._pointerPressed.indexOf(evt.pointerId);
+
+                    if (index != 0) {
+                        return;
+                    }
+
+                    this._offsetX = evt.clientX - previousPosition.x;
+                    this._offsetY = -(evt.clientY - previousPosition.y);
+                };
+
+                this._onLostFocus = () => {
+                    this._offsetX = null;
+                    this._offsetY = null;
+                };
+            }
+
+            canvas.addEventListener("pointerdown", this._onPointerDown);
+            canvas.addEventListener("pointerup", this._onPointerUp);
+            canvas.addEventListener("pointerout", this._onPointerUp);
+            canvas.addEventListener("pointermove", this._onPointerMove);
+
+            Tools.RegisterTopRootEvents([
+                { name: "blur", handler: this._onLostFocus }
+            ]);
+        }
+
+        public detachControl(canvas: HTMLCanvasElement): void {
+            if (this._attachedCanvas !== canvas) {
+                return;
+            }
+
+            canvas.removeEventListener("pointerdown", this._onPointerDown);
+            canvas.removeEventListener("pointerup", this._onPointerUp);
+            canvas.removeEventListener("pointerout", this._onPointerUp);
+            canvas.removeEventListener("pointermove", this._onPointerMove);
+
+            Tools.UnregisterTopRootEvents([
+                { name: "blur", handler: this._onLostFocus }
+            ]);
+
+            this._attachedCanvas = null;
+        }
+
+        public _checkInputs(): void {
+            if (this._offsetX) {
+
+                this.cameraRotation.y += this._offsetX / this.angularSensibility;
+
+                if (this._pointerPressed.length > 1) {
+                    this.cameraRotation.x += -this._offsetY / this.angularSensibility;
+                } else {
+                    var speed = this._computeLocalCameraSpeed();
+                    var direction = new Vector3(0, 0, speed * this._offsetY / this.moveSensibility);
+
+                    Matrix.RotationYawPitchRollToRef(this.rotation.y, this.rotation.x, 0, this._cameraRotationMatrix);
+                    this.cameraDirection.addInPlace(Vector3.TransformCoordinates(direction, this._cameraRotationMatrix));
+                }
+            }
+
+            super._checkInputs();
+        }
+    }
 }

src/Materials/babylon.material.js

@@ -262,6 +262,7 @@ var BABYLON;
             }
             var materialType = BABYLON.Tools.Instantiate(parsedMaterial.customType);
             return materialType.Parse(parsedMaterial, scene, rootUrl);
+            ;
         };
         Material._TriangleFillMode = 0;
         Material._WireFrameFillMode = 1;

src/Materials/babylon.material.ts

@@ -306,7 +306,7 @@
             }
 
             var materialType = Tools.Instantiate(parsedMaterial.customType);
-            return materialType.Parse(parsedMaterial, scene, rootUrl);
+            return materialType.Parse(parsedMaterial, scene, rootUrl);;
         }
     }
 } 

src/Tools/babylon.tools.js

@@ -150,9 +150,9 @@ var BABYLON;
         Tools.GetPointerPrefix = function () {
             var eventPrefix = "pointer";
             // Check if hand.js is referenced or if the browser natively supports pointer events
-            if (!navigator.pointerEnabled) {
-                eventPrefix = "mouse";
-            }
+            //if (!navigator.pointerEnabled) {
+            //    eventPrefix = "mouse";
+            //}
             return eventPrefix;
         };
         Tools.QueueNewFrame = function (func) {

src/Tools/babylon.tools.ts

@@ -199,9 +199,9 @@
             var eventPrefix = "pointer";
 
             // Check if hand.js is referenced or if the browser natively supports pointer events
-            if (!navigator.pointerEnabled) {
-                eventPrefix = "mouse";
-            }
+            //if (!navigator.pointerEnabled) {
+            //    eventPrefix = "mouse";
+            //}
 
             return eventPrefix;
         }