Fix on TS version of WebVRCamera and VRDeviceOrientationCamera

Babylon/Cameras/babylon.arcRotateCamera.js

@@ -40,6 +40,10 @@ var BABYLON;
             this._previousPosition = BABYLON.Vector3.Zero();
             this._collisionVelocity = BABYLON.Vector3.Zero();
             this._newPosition = BABYLON.Vector3.Zero();
+            // Pinch
+            // value for pinch step scaling
+            // set to 20 by default
+            this.pinchPrecision = 20;
 
             this.getViewMatrix();
         }
@@ -81,6 +85,13 @@ var BABYLON;
             var previousPosition;
             var pointerId;
 
+            // to know if pinch started
+            var pinchStarted = false;
+
+            // two pinch point on X
+            // that will use for find if user action is pinch open or pinch close
+            var pinchPointX1, pinchPointX2;
+
             if (this._attachedElement) {
                 return;
             }
@@ -123,6 +134,11 @@ var BABYLON;
                         return;
                     }
 
+                    // return pinch is started
+                    if (pinchStarted) {
+                        return;
+                    }
+
                     var offsetX = evt.clientX - previousPosition.x;
                     var offsetY = evt.clientY - previousPosition.y;
 
@@ -144,6 +160,11 @@ var BABYLON;
                         return;
                     }
 
+                    // return pinch is started
+                    if (pinchStarted) {
+                        return;
+                    }
+
                     var offsetX = evt.movementX || evt.mozMovementX || evt.webkitMovementX || evt.msMovementX || 0;
                     var offsetY = evt.movementY || evt.mozMovementY || evt.webkitMovementY || evt.msMovementY || 0;
 
@@ -242,6 +263,70 @@ var BABYLON;
                     previousPosition = null;
                     pointerId = null;
                 };
+
+                this._touchStart = function (event) {
+                    if (event.touches.length == 2) {
+                        //-- start pinch if two fingers on the screen
+                        pinchStarted = true;
+                        _this._pinchStart(event);
+                    }
+                };
+                this._touchMove = function (event) {
+                    if (pinchStarted) {
+                        //-- make scaling
+                        _this._pinchMove(event);
+                    }
+                };
+                this._touchEnd = function (event) {
+                    if (pinchStarted) {
+                        //-- end of pinch
+                        _this._pinchEnd(event);
+                    }
+                };
+
+                this._pinchStart = function (event) {
+                    // save origin touch point
+                    pinchPointX1 = event.touches[0].clientX;
+                    pinchPointX2 = event.touches[1].clientX;
+
+                    // block the camera
+                    // if not it rotate around target during pinch
+                    pinchStarted = true;
+                };
+                this._pinchMove = function (event) {
+                    // variable for new camera's radius
+                    var delta = 0;
+
+                    // variables to know if pinch open or pinch close
+                    var direction = 1;
+                    var distanceXOrigine, distanceXNow;
+
+                    if (event.touches.length != 2)
+                        return;
+
+                    // calculate absolute distances of the two fingers
+                    distanceXOrigine = Math.abs(pinchPointX1 - pinchPointX2);
+                    distanceXNow = Math.abs(event.touches[0].clientX - event.touches[1].clientX);
+
+                    // if distanceXNow < distanceXOrigine -> pinch close so direction = -1
+                    if (distanceXNow < distanceXOrigine) {
+                        direction = -1;
+                    }
+
+                    // calculate new radius
+                    delta = (_this.pinchPrecision / (_this.wheelPrecision * 40)) * direction;
+
+                    // set new radius
+                    _this.inertialRadiusOffset += delta;
+
+                    // save origin touch point
+                    pinchPointX1 = event.touches[0].clientX;
+                    pinchPointX2 = event.touches[1].clientX;
+                };
+                this._pinchEnd = function (event) {
+                    // cancel pinch and deblock camera rotation
+                    pinchStarted = false;
+                };
             }
 
             element.addEventListener(eventPrefix + "down", this._onPointerDown, false);
@@ -254,6 +339,11 @@ var BABYLON;
             element.addEventListener('mousewheel', this._wheel, false);
             element.addEventListener('DOMMouseScroll', this._wheel, false);
 
+            // pinch
+            element.addEventListener('touchstart', this._touchStart, false);
+            element.addEventListener('touchmove', this._touchMove, false);
+            element.addEventListener('touchend', this._touchEnd, false);
+
             BABYLON.Tools.RegisterTopRootEvents([
                 { name: "keydown", handler: this._onKeyDown },
                 { name: "keyup", handler: this._onKeyUp },
@@ -276,6 +366,11 @@ var BABYLON;
             element.removeEventListener('mousewheel', this._wheel);
             element.removeEventListener('DOMMouseScroll', this._wheel);
 
+            // pinch
+            element.removeEventListener('touchstart', this._touchStart);
+            element.removeEventListener('touchmove', this._touchMove);
+            element.removeEventListener('touchend', this._touchEnd);
+
             BABYLON.Tools.UnregisterTopRootEvents([
                 { name: "keydown", handler: this._onKeyDown },
                 { name: "keyup", handler: this._onKeyUp },

Babylon/Cameras/babylon.arcRotateCamera.ts

@@ -47,19 +47,19 @@
         private _previousAlpha: number;
         private _previousBeta: number;
         private _previousRadius: number;
-		
-	// Pinch
-	// value for pinch step scaling
-	// set to 20 by default
-	public pinchPrecision = 20;
-	// Event for pinch
-	private _touchStart: (e: PointerEvent) => void;
-	private _touchMove: (e: PointerEvent) => void;
-	private _touchEnd: (e: PointerEvent) => void;
-	// Method for pinch
-	private _pinchStart: (e: PointerEvent) => void;
-	private _pinchMove: (e: PointerEvent) => void;
-	private _pinchEnd: (e: PointerEvent) => void;
+
+        // Pinch
+        // value for pinch step scaling
+        // set to 20 by default
+        public pinchPrecision = 20;
+        // Event for pinch
+        private _touchStart: (e: any) => void;
+        private _touchMove: (e: any) => void;
+        private _touchEnd: (e: any) => void;
+        // Method for pinch
+        private _pinchStart: (e: any) => void;
+        private _pinchMove: (e: any) => void;
+        private _pinchEnd: (e: any) => void;
 
         constructor(name: string, public alpha: number, public beta: number, public radius: number, public target: any, scene: Scene) {
             super(name, BABYLON.Vector3.Zero(), scene);
@@ -106,12 +106,12 @@
         public attachControl(element: HTMLElement, noPreventDefault?: boolean): void {
             var previousPosition;
             var pointerId;
-	    // to know if pinch started
-	    var pinchStarted = false;
-	    // two pinch point on X
-	    // that will use for find if user action is pinch open or pinch close
-	    var pinchPointX1, pinchPointX2;
-			
+            // to know if pinch started
+            var pinchStarted = false;
+            // two pinch point on X
+            // that will use for find if user action is pinch open or pinch close
+            var pinchPointX1, pinchPointX2;
+
             if (this._attachedElement) {
                 return;
             }
@@ -155,9 +155,9 @@
                     if (pointerId !== evt.pointerId) {
                         return;
                     }
-					
-		    // return pinch is started
-		    if (pinchStarted){
+
+                    // return pinch is started
+                    if (pinchStarted) {
                         return;
                     }
 
@@ -181,9 +181,9 @@
                     if (!engine.isPointerLock) {
                         return;
                     }
-					
-		    // return pinch is started
-		    if (pinchStarted){
+
+                    // return pinch is started
+                    if (pinchStarted) {
                         return;
                     }
 
@@ -292,28 +292,28 @@
                     previousPosition = null;
                     pointerId = null;
                 };
-				
-		this._touchStart = event => {
+
+                this._touchStart = event => {
                     if (event.touches.length == 2) {
                         //-- start pinch if two fingers on the screen
                         pinchStarted = true;
                         this._pinchStart(event);
-                    } 
+                    }
                 };
-		this._touchMove = event => {
+                this._touchMove = event => {
                     if (pinchStarted) {
                         //-- make scaling
                         this._pinchMove(event);
                     }
                 };
-		this._touchEnd = event => {
+                this._touchEnd = event => {
                     if (pinchStarted) {
                         //-- end of pinch
                         this._pinchEnd(event);
-                    } 
+                    }
                 };
-				
-		this._pinchStart = event => {
+
+                this._pinchStart = event => {
                     // save origin touch point
                     pinchPointX1 = event.touches[0].clientX;
                     pinchPointX2 = event.touches[1].clientX;
@@ -321,19 +321,19 @@
                     // if not it rotate around target during pinch
                     pinchStarted = true;
                 };
-		this._pinchMove = event => {
+                this._pinchMove = event => {
                     // variable for new camera's radius
                     var delta = 0;
                     // variables to know if pinch open or pinch close
                     var direction = 1;
                     var distanceXOrigine, distanceXNow;
-                    
+
                     if (event.touches.length != 2)
                         return;
                     // calculate absolute distances of the two fingers
                     distanceXOrigine = Math.abs(pinchPointX1 - pinchPointX2);
                     distanceXNow = Math.abs(event.touches[0].clientX - event.touches[1].clientX);
-                    
+
                     // if distanceXNow < distanceXOrigine -> pinch close so direction = -1
                     if (distanceXNow < distanceXOrigine) {
                         direction = -1;
@@ -346,7 +346,7 @@
                     pinchPointX1 = event.touches[0].clientX;
                     pinchPointX2 = event.touches[1].clientX;
                 };
-				this._pinchEnd = event => {
+                this._pinchEnd = event => {
                     // cancel pinch and deblock camera rotation
                     pinchStarted = false;
                 };
@@ -361,7 +361,7 @@
             element.addEventListener("MSGestureChange", this._onGesture, false);
             element.addEventListener('mousewheel', this._wheel, false);
             element.addEventListener('DOMMouseScroll', this._wheel, false);
-	    // pinch
+            // pinch
             element.addEventListener('touchstart', this._touchStart, false);
             element.addEventListener('touchmove', this._touchMove, false);
             element.addEventListener('touchend', this._touchEnd, false);
@@ -387,7 +387,7 @@
             element.removeEventListener("MSGestureChange", this._onGesture);
             element.removeEventListener('mousewheel', this._wheel);
             element.removeEventListener('DOMMouseScroll', this._wheel);
-	    // pinch
+            // pinch
             element.removeEventListener('touchstart', this._touchStart);
             element.removeEventListener('touchmove', this._touchMove);
             element.removeEventListener('touchend', this._touchEnd);

Babylon/Cameras/babylon.oculusCamera.ts

@@ -103,7 +103,7 @@
         }
 
         // Oculus events
-        private _onOrientationEvent(evt: DeviceOrientationEvent): void {
+        public _onOrientationEvent(evt: DeviceOrientationEvent): void {
             var yaw = evt.alpha / 180 * Math.PI;
             var pitch = evt.beta / 180 * Math.PI;
             var roll = evt.gamma / 180 * Math.PI;

Babylon/Cameras/babylon.vrDeviceOrientationCamera.js

@@ -34,3 +34,4 @@ var BABYLON;
     })(BABYLON.OculusCamera);
     BABYLON.VRDeviceOrientationCamera = VRDeviceOrientationCamera;
 })(BABYLON || (BABYLON = {}));
+//# sourceMappingURL=babylon.vrDeviceOrientationCamera.js.map

Babylon/Cameras/babylon.vrDeviceOrientationCamera.ts

@@ -8,7 +8,7 @@ module BABYLON {
 			super(name, position, scene);
 		}
 
-		private _onOrientationEvent(evt: DeviceOrientationEvent): void {
+        public _onOrientationEvent(evt: DeviceOrientationEvent): void {
             this._alpha = +evt.alpha|0;
             this._beta = +evt.beta|0;
             this._gamma = +evt.gamma|0;

Babylon/Cameras/babylon.webVRCamera.js

@@ -36,7 +36,7 @@ var BABYLON;
             i = 0;
 
             while (i > 0 && this._sensorDevice === null) {
-                if (devices[i] instanceof PositionSensorVRDevice && (!this._hmdDevice || devices[i].hardwareUnitId === hmdDevice.hardwareUnitId)) {
+                if (devices[i] instanceof PositionSensorVRDevice && (!this._hmdDevice || devices[i].hardwareUnitId === this._hmdDevice.hardwareUnitId)) {
                     this._sensorDevice = devices[i];
                 }
                 i++;
@@ -77,3 +77,4 @@ var BABYLON;
     })(BABYLON.OculusCamera);
     BABYLON.WebVRCamera = WebVRCamera;
 })(BABYLON || (BABYLON = {}));
+//# sourceMappingURL=babylon.webVRCamera.js.map

Babylon/Cameras/babylon.webVRCamera.ts

@@ -1,74 +1,77 @@
+declare var HMDVRDevice;
+declare var PositionSensorVRDevice;
+
 module BABYLON {
-	export class WebVRCamera extends BABYLON.OculusCamera {
-		public _hmdDevice = null;
-		public _sensorDevice = null;
-		public _cacheState = null;
-		public _cacheQuaternion = new BABYLON.Quaternion();
-		public _cacheRotation = BABYLON.Vector3.Zero();
-		public _vrEnabled = false;
-	
-		constructor(name: string, position: Vector3, scene: Scene) {
-			super(name, position, scene);
-			this._getWebVRDevices = this._getWebVRDevices.bind(this);
-		}
+    export class WebVRCamera extends BABYLON.OculusCamera {
+        public _hmdDevice = null;
+        public _sensorDevice = null;
+        public _cacheState = null;
+        public _cacheQuaternion = new BABYLON.Quaternion();
+        public _cacheRotation = BABYLON.Vector3.Zero();
+        public _vrEnabled = false;
+
+        constructor(name: string, position: Vector3, scene: Scene) {
+            super(name, position, scene);
+            this._getWebVRDevices = this._getWebVRDevices.bind(this);
+        }
 
-		private _getWebVRDevices(devices: Array):void {
-			var size = devices.length;
-			var i = 0;
+        private _getWebVRDevices(devices: Array<any>): void {
+            var size = devices.length;
+            var i = 0;
 
-			// Reset devices.
-			this._sensorDevice = null;
-			this._hmdDevice = null;
+            // Reset devices.
+            this._sensorDevice = null;
+            this._hmdDevice = null;
 
-			// Search for a HmdDevice.
-			while (i > 0 && this._hmdDevice === null) {
-				if (devices[i] instanceof HMDVRDevice) {
-					this._hmdDevice = devices[i];       
-				}
-				i++;
-			}
+            // Search for a HmdDevice.
+            while (i > 0 && this._hmdDevice === null) {
+                if (devices[i] instanceof HMDVRDevice) {
+                    this._hmdDevice = devices[i];
+                }
+                i++;
+            }
 
-			i = 0;
+            i = 0;
 
-			// Search for a
-			while (i > 0 && this._sensorDevice === null) {
-				if (devices[i] instanceof PositionSensorVRDevice && (!this._hmdDevice || devices[i].hardwareUnitId === hmdDevice.hardwareUnitId)) {
-					this._sensorDevice = devices[i];
-				}
-				i++;
-			}
+            // Search for a PositionSensorVRDevice
+            while (i > 0 && this._sensorDevice === null) {
+                if (devices[i] instanceof PositionSensorVRDevice && (!this._hmdDevice || devices[i].hardwareUnitId === this._hmdDevice.hardwareUnitId)) {
+                    this._sensorDevice = devices[i];
+                }
+                i++;
+            }
 
-			this._vrEnabled = this._sensorDevice && this._hmdDevice ? true : false;
-		}
+            this._vrEnabled = this._sensorDevice && this._hmdDevice ? true : false;
+        }
 
-		public _update(): void {
-			if (this._vrEnabled) {
-				this._cacheState = this._sensorDevice.getState();
-				this._cacheQuaternion.copyFromFloats(this._cacheState.orientation.x, this._cacheState.orientation.y, this._cacheState.orientation.z, this._cacheState.orientation.w);
-				this._cacheQuaternion.toEulerAnglesToRef(this._cacheRotation);
+        public _update(): void {
+            if (this._vrEnabled) {
+                this._cacheState = this._sensorDevice.getState();
+                this._cacheQuaternion.copyFromFloats(this._cacheState.orientation.x, this._cacheState.orientation.y, this._cacheState.orientation.z, this._cacheState.orientation.w);
+                this._cacheQuaternion.toEulerAnglesToRef(this._cacheRotation);
 
-				this.rotation.x = -this._cacheRotation.z;
-				this.rotation.y = -this._cacheRotation.y;
-				this.rotation.z = this._cacheRotation.x;
-			}
+                this.rotation.x = -this._cacheRotation.z;
+                this.rotation.y = -this._cacheRotation.y;
+                this.rotation.z = this._cacheRotation.x;
+            }
 
-			super._update();
-		}
+            super._update();
+        }
 
-		public attachControl(element: HTMLElement, noPreventDefault?: boolean): void {
-			super.attachControl(element, noPreventDefault);
+        public attachControl(element: HTMLElement, noPreventDefault?: boolean): void {
+            super.attachControl(element, noPreventDefault);
 
-			if (navigator.getVRDevices) {
-				navigator.getVRDevices().then(this._getWebVRDevices);
-			} 
-			else if (navigator.mozGetVRDevices) {
-				navigator.mozGetVRDevices(this._getWebVRDevices);
-			}
-		}
+            if (navigator.getVRDevices) {
+                navigator.getVRDevices().then(this._getWebVRDevices);
+            }
+            else if (navigator.mozGetVRDevices) {
+                navigator.mozGetVRDevices(this._getWebVRDevices);
+            }
+        }
 
-		public detachControl(element: HTMLElement): void {
-			super.detachControl(element);
-			this._vrEnabled = false;
-		}
-	}
+        public detachControl(element: HTMLElement): void {
+            super.detachControl(element);
+            this._vrEnabled = false;
+        }
+    }
 }

Babylon/Physics/Plugins/babylon.oimoJSPlugin.js

@@ -1,4 +1,4 @@
-var BABYLON;
+var BABYLON;
 (function (BABYLON) {
     var OimoJSPlugin = (function () {
         function OimoJSPlugin() {

Babylon/babylon.mixins.ts

@@ -83,4 +83,9 @@ interface MouseEvent {
 interface MSStyleCSSProperties {
     webkitTransform: string;
     webkitTransition: string;
+}
+
+interface Navigator {
+    getVRDevices: () => any;
+    mozGetVRDevices: (any) => any;
 }

Tools/BuildOurOwnBabylonJS/BuildOurOwnBabylonJS/babylonJS.xml

@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8" ?>
 <files xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="babylonJS.xsd">
+  <script src="Babylon/Cameras/babylon.vrDeviceOrientationCamera.js"></script>
+  <script src="Babylon/Cameras/babylon.webVRCamera.js"></script>
   <script src="Babylon/Tools/babylon.assetsManager.js"></script>
   <script src="Babylon/Rendering/babylon.outlineRenderer.js"></script>
   <script src="Babylon/Mesh/babylon.linesMesh.js"></script>

Tools/Gulp/gulpfile.js

@@ -152,7 +152,9 @@ gulp.task('scripts', ['shaders'] ,function() {
       '../../Babylon/Cameras/babylon.gamepadCamera.js',
       '../../Babylon/Mesh/babylon.linesMesh.js',
       '../../Babylon/Rendering/babylon.outlineRenderer.js',
-      '../../Babylon/Tools/babylon.assetsManager.js'
+      '../../Babylon/Tools/babylon.assetsManager.js',
+      '../../Babylon/Cameras/babylon.vrDeviceOrientationCamera.js',
+      '../../Babylon/Cameras/babylon.webVRCamera.js'
     ])
     .pipe(concat('babylon.js'))
     .pipe(gulp.dest('build/'))

babylon.1.14-beta-debug.js

@@ -7077,6 +7077,10 @@ var BABYLON;
             this._previousPosition = BABYLON.Vector3.Zero();
             this._collisionVelocity = BABYLON.Vector3.Zero();
             this._newPosition = BABYLON.Vector3.Zero();
+           
+           
+           
+            this.pinchPrecision = 20;
 
             this.getViewMatrix();
         }
@@ -7118,6 +7122,13 @@ var BABYLON;
             var previousPosition;
             var pointerId;
 
+           
+            var pinchStarted = false;
+
+           
+           
+            var pinchPointX1, pinchPointX2;
+
             if (this._attachedElement) {
                 return;
             }
@@ -7160,6 +7171,11 @@ var BABYLON;
                         return;
                     }
 
+                   
+                    if (pinchStarted) {
+                        return;
+                    }
+
                     var offsetX = evt.clientX - previousPosition.x;
                     var offsetY = evt.clientY - previousPosition.y;
 
@@ -7181,6 +7197,11 @@ var BABYLON;
                         return;
                     }
 
+                   
+                    if (pinchStarted) {
+                        return;
+                    }
+
                     var offsetX = evt.movementX || evt.mozMovementX || evt.webkitMovementX || evt.msMovementX || 0;
                     var offsetY = evt.movementY || evt.mozMovementY || evt.webkitMovementY || evt.msMovementY || 0;
 
@@ -7279,6 +7300,70 @@ var BABYLON;
                     previousPosition = null;
                     pointerId = null;
                 };
+
+                this._touchStart = function (event) {
+                    if (event.touches.length == 2) {
+                       
+                        pinchStarted = true;
+                        _this._pinchStart(event);
+                    }
+                };
+                this._touchMove = function (event) {
+                    if (pinchStarted) {
+                       
+                        _this._pinchMove(event);
+                    }
+                };
+                this._touchEnd = function (event) {
+                    if (pinchStarted) {
+                       
+                        _this._pinchEnd(event);
+                    }
+                };
+
+                this._pinchStart = function (event) {
+                   
+                    pinchPointX1 = event.touches[0].clientX;
+                    pinchPointX2 = event.touches[1].clientX;
+
+                   
+                   
+                    pinchStarted = true;
+                };
+                this._pinchMove = function (event) {
+                   
+                    var delta = 0;
+
+                   
+                    var direction = 1;
+                    var distanceXOrigine, distanceXNow;
+
+                    if (event.touches.length != 2)
+                        return;
+
+                   
+                    distanceXOrigine = Math.abs(pinchPointX1 - pinchPointX2);
+                    distanceXNow = Math.abs(event.touches[0].clientX - event.touches[1].clientX);
+
+                   
+                    if (distanceXNow < distanceXOrigine) {
+                        direction = -1;
+                    }
+
+                   
+                    delta = (_this.pinchPrecision / (_this.wheelPrecision * 40)) * direction;
+
+                   
+                    _this.inertialRadiusOffset += delta;
+
+                   
+                    pinchPointX1 = event.touches[0].clientX;
+                    pinchPointX2 = event.touches[1].clientX;
+                };
+                this._pinchEnd = function (event) {
+                   
+                    pinchStarted = false;
+                };
             }
 
             element.addEventListener(eventPrefix + "down", this._onPointerDown, false);
@@ -7291,6 +7376,11 @@ var BABYLON;
             element.addEventListener('mousewheel', this._wheel, false);
             element.addEventListener('DOMMouseScroll', this._wheel, false);
 
+           
+            element.addEventListener('touchstart', this._touchStart, false);
+            element.addEventListener('touchmove', this._touchMove, false);
+            element.addEventListener('touchend', this._touchEnd, false);
+
             BABYLON.Tools.RegisterTopRootEvents([
                 { name: "keydown", handler: this._onKeyDown },
                 { name: "keyup", handler: this._onKeyUp },
@@ -7313,6 +7403,11 @@ var BABYLON;
             element.removeEventListener('mousewheel', this._wheel);
             element.removeEventListener('DOMMouseScroll', this._wheel);
 
+           
+            element.removeEventListener('touchstart', this._touchStart);
+            element.removeEventListener('touchmove', this._touchMove);
+            element.removeEventListener('touchend', this._touchEnd);
+
             BABYLON.Tools.UnregisterTopRootEvents([
                 { name: "keydown", handler: this._onKeyDown },
                 { name: "keyup", handler: this._onKeyUp },
@@ -16639,7 +16734,11 @@ var BABYLON;
             for (var index = 0; index < this._registeredMeshes.length; index++) {
                 var registeredMesh = this._registeredMeshes[index];
                 if (registeredMesh.mesh === mesh || registeredMesh.mesh === mesh.parent) {
-                    registeredMesh.body.body.applyImpulse(contactPoint.scale(OIMO.INV_SCALE), force.scale(OIMO.INV_SCALE));
+                   
+                    var mass = registeredMesh.body.body.massInfo.mass;
+
+                   
+                    registeredMesh.body.body.applyImpulse(contactPoint.scale(OIMO.INV_SCALE), force.scale(OIMO.INV_SCALE * mass));
                     return;
                 }
             }
@@ -25518,3 +25617,118 @@ var BABYLON;
     })();
     BABYLON.AssetsManager = AssetsManager;
 })(BABYLON || (BABYLON = {}));
+var __extends = this.__extends || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    __.prototype = b.prototype;
+    d.prototype = new __();
+};
+var BABYLON;
+(function (BABYLON) {
+    var VRDeviceOrientationCamera = (function (_super) {
+        __extends(VRDeviceOrientationCamera, _super);
+        function VRDeviceOrientationCamera(name, position, scene) {
+            _super.call(this, name, position, scene);
+            this._alpha = 0;
+            this._beta = 0;
+            this._gamma = 0;
+        }
+        VRDeviceOrientationCamera.prototype._onOrientationEvent = function (evt) {
+            this._alpha = +evt.alpha | 0;
+            this._beta = +evt.beta | 0;
+            this._gamma = +evt.gamma | 0;
+
+            if (this._gamma < 0) {
+                this._gamma = 90 + this._gamma;
+            } else {
+               
+                this._gamma = 270 - this._gamma;
+            }
+
+            this.rotation.x = this._gamma / 180.0 * Math.PI;
+            this.rotation.y = -this._alpha / 180.0 * Math.PI;
+            this.rotation.z = this._beta / 180.0 * Math.PI;
+        };
+        return VRDeviceOrientationCamera;
+    })(BABYLON.OculusCamera);
+    BABYLON.VRDeviceOrientationCamera = VRDeviceOrientationCamera;
+})(BABYLON || (BABYLON = {}));
+var __extends = this.__extends || function (d, b) {
+    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p];
+    function __() { this.constructor = d; }
+    __.prototype = b.prototype;
+    d.prototype = new __();
+};
+var BABYLON;
+(function (BABYLON) {
+    var WebVRCamera = (function (_super) {
+        __extends(WebVRCamera, _super);
+        function WebVRCamera(name, position, scene) {
+            _super.call(this, name, position, scene);
+            this._hmdDevice = null;
+            this._sensorDevice = null;
+            this._cacheState = null;
+            this._cacheQuaternion = new BABYLON.Quaternion();
+            this._cacheRotation = BABYLON.Vector3.Zero();
+            this._vrEnabled = false;
+            this._getWebVRDevices = this._getWebVRDevices.bind(this);
+        }
+        WebVRCamera.prototype._getWebVRDevices = function (devices) {
+            var size = devices.length;
+            var i = 0;
+
+           
+            this._sensorDevice = null;
+            this._hmdDevice = null;
+
+            while (i > 0 && this._hmdDevice === null) {
+                if (devices[i] instanceof HMDVRDevice) {
+                    this._hmdDevice = devices[i];
+                }
+                i++;
+            }
+
+            i = 0;
+
+            while (i > 0 && this._sensorDevice === null) {
+                if (devices[i] instanceof PositionSensorVRDevice && (!this._hmdDevice || devices[i].hardwareUnitId === this._hmdDevice.hardwareUnitId)) {
+                    this._sensorDevice = devices[i];
+                }
+                i++;
+            }
+
+            this._vrEnabled = this._sensorDevice && this._hmdDevice ? true : false;
+        };
+
+        WebVRCamera.prototype._update = function () {
+            if (this._vrEnabled) {
+                this._cacheState = this._sensorDevice.getState();
+                this._cacheQuaternion.copyFromFloats(this._cacheState.orientation.x, this._cacheState.orientation.y, this._cacheState.orientation.z, this._cacheState.orientation.w);
+                this._cacheQuaternion.toEulerAnglesToRef(this._cacheRotation);
+
+                this.rotation.x = -this._cacheRotation.z;
+                this.rotation.y = -this._cacheRotation.y;
+                this.rotation.z = this._cacheRotation.x;
+            }
+
+            _super.prototype._update.call(this);
+        };
+
+        WebVRCamera.prototype.attachControl = function (element, noPreventDefault) {
+            _super.prototype.attachControl.call(this, element, noPreventDefault);
+
+            if (navigator.getVRDevices) {
+                navigator.getVRDevices().then(this._getWebVRDevices);
+            } else if (navigator.mozGetVRDevices) {
+                navigator.mozGetVRDevices(this._getWebVRDevices);
+            }
+        };
+
+        WebVRCamera.prototype.detachControl = function (element) {
+            _super.prototype.detachControl.call(this, element);
+            this._vrEnabled = false;
+        };
+        return WebVRCamera;
+    })(BABYLON.OculusCamera);
+    BABYLON.WebVRCamera = WebVRCamera;
+})(BABYLON || (BABYLON = {}));

babylon.d.ts

@@ -268,6 +268,10 @@ interface MSStyleCSSProperties {
     webkitTransform: string;
     webkitTransition: string;
 }
+interface Navigator {
+    getVRDevices: () => any;
+    mozGetVRDevices: (any: any) => any;
+}
 declare module BABYLON {
     class Node {
         public parent: Node;
@@ -314,7 +318,7 @@ declare module BABYLON {
         static MinDeltaTime: number;
         static MaxDeltaTime: number;
         public autoClear: boolean;
-        public clearColor: Color3;
+        public clearColor: any;
         public ambientColor: Color3;
         public beforeRender: () => void;
         public afterRender: () => void;
@@ -864,6 +868,13 @@ declare module BABYLON {
         private _previousAlpha;
         private _previousBeta;
         private _previousRadius;
+        public pinchPrecision: number;
+        private _touchStart;
+        private _touchMove;
+        private _touchEnd;
+        private _pinchStart;
+        private _pinchMove;
+        private _pinchEnd;
         constructor(name: string, alpha: number, beta: number, radius: number, target: any, scene: Scene);
         public _getTargetPosition(): Vector3;
         public _initCache(): void;
@@ -1014,7 +1025,7 @@ declare module BABYLON {
         constructor(name: string, position: Vector3, scene: Scene);
         public _update(): void;
         public _updateCamera(camera: FreeCamera): void;
-        private _onOrientationEvent(evt);
+        public _onOrientationEvent(evt: DeviceOrientationEvent): void;
         public attachControl(element: HTMLElement, noPreventDefault?: boolean): void;
         public detachControl(element: HTMLElement): void;
     }
@@ -1080,6 +1091,32 @@ declare module BABYLON {
     }
 }
 declare module BABYLON {
+    class VRDeviceOrientationCamera extends OculusCamera {
+        public _alpha: number;
+        public _beta: number;
+        public _gamma: number;
+        constructor(name: string, position: Vector3, scene: Scene);
+        public _onOrientationEvent(evt: DeviceOrientationEvent): void;
+    }
+}
+declare var HMDVRDevice: any;
+declare var PositionSensorVRDevice: any;
+declare module BABYLON {
+    class WebVRCamera extends OculusCamera {
+        public _hmdDevice: any;
+        public _sensorDevice: any;
+        public _cacheState: any;
+        public _cacheQuaternion: Quaternion;
+        public _cacheRotation: Vector3;
+        public _vrEnabled: boolean;
+        constructor(name: string, position: Vector3, scene: Scene);
+        private _getWebVRDevices(devices);
+        public _update(): void;
+        public attachControl(element: HTMLElement, noPreventDefault?: boolean): void;
+        public detachControl(element: HTMLElement): void;
+    }
+}
+declare module BABYLON {
     class Collider {
         public radius: Vector3;
         public retry: number;
@@ -1544,7 +1581,7 @@ declare module BABYLON {
         private _vectors3;
         private _matrices;
         private _cachedWorldViewMatrix;
-        constructor(name: string, scene: Scene, shaderPath: string, options: any);
+        constructor(name: string, scene: Scene, shaderPath: any, options: any);
         public needAlphaBlending(): boolean;
         public needAlphaTesting(): boolean;
         private _checkUniform(uniformName);