Move to latest polyfill, but so far using the provided distortion cor…

…rection.

index.html

@@ -21,6 +21,6 @@ <h1 class="title">Error</h1>
       <img src="images/ic_info_outline_black_24dp.svg"/>
     </a>
 
-    <script src="build/vrview-analytics.min.js"></script>
+    <script src="build/vrview.js"></script>
 	</body>
 </html>

package.json

@@ -5,7 +5,10 @@
   "main": "index.js",
   "//": "TODO: Re-add dependencies once vanilla versions can be used again.",
   "dependencies": {
-    "es6-promise": "^3.0.2"
+    "es6-promise": "^3.0.2",
+    "three": "^0.75.0",
+    "webvr-boilerplate": "^0.4.1",
+    "webvr-polyfill": "^0.9.4"
   },
   "devDependencies": {},
   "scripts": {

src/main.js

@@ -13,11 +13,6 @@
  * limitations under the License.
  */
 
-// Disable distortion provided by the boilerplate because we are doing
-// vertex-based distortion.
-WebVRConfig = window.WebVRConfig || {}
-WebVRConfig.PREVENT_DISTORTION = true;
-
 // Initialize the loading indicator as quickly as possible to give the user
 // immediate feedback.
 var LoadingIndicator = require('./loading-indicator');

src/photosphere-renderer.js

@@ -55,19 +55,28 @@ PhotosphereRenderer.prototype.init = function() {
   this.initScenes_();
 
   // The vertex distorter.
-  this.distorter = new VertexDistorter(this.manager.getDeviceInfo());
+  //this.distorter = new VertexDistorter(this.manager.getDeviceInfo());
+  this.distorter = new VertexDistorter();
 
-  this.manager.on('modechange', this.onModeChange_.bind(this));
-  this.manager.on('viewerchange', this.onViewerChange_.bind(this));
+  // TODO: Remove these, they are deprecated in 1.0.
+  //this.manager.on('modechange', this.onModeChange_.bind(this));
+  //this.manager.on('viewerchange', this.onViewerChange_.bind(this));
 
   // Watch the resize event.
   window.addEventListener('resize', this.onResize_.bind(this));
 
+  // Watch the custom vrdisplaydeviceparamschange event, which fires whenever
+  // the viewer parameters change.
+  window.addEventListener('vrdisplaydeviceparamschange',
+                          this.onVRDisplayParamsChange_.bind(this));
+
+  window.addEventListener('vrdisplaypresentchange',
+                          this.onVRDisplayPresentChange_.bind(this));
   var that = this;
-  navigator.getVRDevices().then(function(devices) {
-    devices.forEach(function(device) {
-      if (device instanceof HMDVRDevice) {
-        that.hmd = device;
+  navigator.getVRDisplays().then(function(displays) {
+    displays.forEach(function(display) {
+      if (display instanceof VRDisplay) {
+        that.hmd = display;
       }
     });
   });
@@ -253,6 +262,25 @@ PhotosphereRenderer.prototype.onViewerChange_ = function(newViewer) {
 
 PhotosphereRenderer.prototype.onResize_ = function() {
   this.updateRenderRect_();
+
+  this.effect.setSize(window.innerWidth, window.innerHeight);
+  this.camera.aspect = window.innerWidth / window.innerHeight;
+  this.camera.updateProjectionMatrix();
+};
+
+PhotosphereRenderer.prototype.onVRDisplayParamsChange_ = function(e) {
+  console.log('onVRDisplayParamsChange_');
+  this.distorter.setDeviceInfo(e.detail.deviceInfo);
+};
+
+PhotosphereRenderer.prototype.onVRDisplayPresentChange_ = function(e) {
+  console.log('onVRDisplayPresentChange_');
+  var isVRMode = e.detail.vrdisplay.isPresenting;
+  this.distorter.setEnabled(isVRMode);
+  this.updateMaterial_();
+
+  // Resize the thing for good measure.
+  this.onResize_();
 };
 
 module.exports = PhotosphereRenderer;

src/vertex-distorter.js

@@ -24,16 +24,18 @@ var NO_DISTORTION = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
  * so that a second shader pass is not needed. This is intended to greatly
  * optimize the rendering process.
  */
-function VertexDistorter(deviceInfo) {
+function VertexDistorter() {
   this.texture = null;
   this.isEnabled = false;
-
-  this.deviceInfo = deviceInfo;
 }
 
 VertexDistorter.prototype.setEnabled = function(isEnabled) {
   this.isEnabled = isEnabled;
-}
+};
+
+VertexDistorter.prototype.setDeviceInfo = function(deviceInfo) {
+  this.deviceInfo = deviceInfo;
+};
 
 /**
  * Sets the texture that is used to render this photosphere.