RaananW Posted August 21, 2016 Share Posted August 21, 2016 Hi Guys, I have just updated today the WebVR camera to be conform with the changes in the WebVR API. It is now possible to use the position provided by the camera as well as the rotation, which will allow you to implement WenVR experiences to devices like HTC Vive. As the projection matrix for each eye is calculated using factors from the camera itself, no distortion compensation is required. Which is a good thing I will update the documentation pretty soon and include a few demos for you to test with. In the meantime you can test with this scene - https://raananweber.com/orientation/webvr/ I tested the new specs using the latest chromium and the HTC vive. Firefox nightly sadly doesn't recognize the vive as a vr display, so no luck with this browser. If you have any questions let me know! adam, jellix, fluffrabbit and 3 others 6 Quote Link to comment Share on other sites More sharing options...
NasimiAsl Posted August 21, 2016 Share Posted August 21, 2016 iphone 5s chrome 60 fps Quote Link to comment Share on other sites More sharing options...
pindiespace Posted August 23, 2016 Share Posted August 23, 2016 So, does this version use webvr-polyfill? I did a quick check and the example says "webvr is not enabled on your browser" so I presume it needs it. Quote Link to comment Share on other sites More sharing options...
RaananW Posted August 24, 2016 Author Share Posted August 24, 2016 Nope, not at all. It only works on browsers that support it (Latest chromium and Firefox nightly at the moment). It will also not work so well with the webvr polyfill, as the polyfill doesn't support the eye parameter feature, which is needed to calculate compensation and field of view. To test it, use oculus rift or vive with the lastest chromium version. Otherwise, use the VRDeviceOrientation camera to use your cellphone as a VR device. Quote Link to comment Share on other sites More sharing options...
pindiespace Posted August 24, 2016 Share Posted August 24, 2016 It might make sense to keep the old VRDeviceOrientation camera around 'pseudo' webvr camera. The advantage with the older version is that the orientation and stereo DO work everywhere, even on iOS safari. Quote Link to comment Share on other sites More sharing options...
pindiespace Posted August 24, 2016 Share Posted August 24, 2016 Hmmm, another question. The webvr 1.0 spec says (for now) that you can only have one Display Layer. Does this, in turn, mean that you can only have one renderer for a scene? I had a question about creating two distinct renderers, one for each eye, and additional renderers for in-scene video. Quote Link to comment Share on other sites More sharing options...
RaananW Posted August 25, 2016 Author Share Posted August 25, 2016 Great question. Yes, you are right - only one layer is supported. They want to eventually add multi-layer rendering (hence this horrible requestPresent function). But! the layer's source is actually your main canvas. So anything the engine renders on the canvas will be displayed in the VRDisplay. If you want a few engines running parallel - no, this is currently not possible (due to the specs, as you say). pindiespace 1 Quote Link to comment Share on other sites More sharing options...
pindiespace Posted August 30, 2016 Share Posted August 30, 2016 Are there any examples of how to implement picking in a webvr camera, as opposed to standard camera? Quote Link to comment Share on other sites More sharing options...
jellix Posted August 30, 2016 Share Posted August 30, 2016 Hi @RaananW I'm excited to read that you've built up a demo for the Vive, thank's a lot for that! Today we got a Vive in our company (next to our GearVR) so it's another level of VR now. I already got a smooth running webVR demo running within the vive from webvr.info/samples in the chromium with webVR enabled. Absolutely no flickering and a very clean anti aliasing. Tomorrow I will be able to try your demo. Nice to hear that the post process for the distortion is no longer needed there. ... very curious right now :-) RaananW 1 Quote Link to comment Share on other sites More sharing options...
jellix Posted August 31, 2016 Share Posted August 31, 2016 Hi @RaananW awsome! Thanks to your example, I'm able to get my scene run in the vive, and it works like a native game at constant 60 fps with an absolute smooth anti aliasing. It's done with a nightly build of babylon and with a nightly build of chrome but at the end of the day everthing runs fine. Now I have a further question regarding the controllers but I think it's better to create a new thread for that. So many thanks again for the great work! pindiespace and RaananW 2 Quote Link to comment Share on other sites More sharing options...
pindiespace Posted September 1, 2016 Share Posted September 1, 2016 Suggestion for the new WebVR camera - FORCE_STEREO or FORCE_VR option the new version adheres to the WebVR 1.0 spec, and therefore if you use it on desktop, you'll just get a single scene rather than a stereo view in the old camera. But...that stereo view is VERY useful when you are trying to explain WebVR to clients, or showcasing your work on the web. A lot of 'stakeholders' don't understand exactly what VR is, but they are the ones searching for companies who can do WebVR work for them. What they do is go on the web and look for VR. If they can toggle a stereo view, it helps them understand enormously. Use case: you're showing clients a website on a projector. Unless you can plug your mobile phone into the projector, and output the screen, you can't actually show them the stereo view that enables VR. Having a flag FORCE_STEREO would be a great thing for a web Ui explaining VR. One could put a scene on the web, have a VR button...but also have a button with something like "see the stereo view" which invokes FORCE_STEREO or FORCE_VR on a desktop, even if a headset is not connected. It would also help in development, since one can work faster coding without constantly donning and removing a headset. Of course, one could swap in a stereo camera, but that makes things more complex, and they're not the same. RaananW 1 Quote Link to comment Share on other sites More sharing options...
pindiespace Posted September 1, 2016 Share Posted September 1, 2016 Hi jellix: would love to see your scene! I just got a Vive, and am setting up this weekend. Quote Link to comment Share on other sites More sharing options...
jellix Posted September 3, 2016 Share Posted September 3, 2016 Hi @pindiespace and @RaananW my project (a pretty small one) is mainly based on this one: https://bryik.github.io/aframe-dominoes/ more of it: https://github.com/aframevr/awesome-aframe using in chromium with webVR enabled. The controllers are working great and with absolute no lagging at 60 fps and visual representation of the controllers like in the native VR-apps. Absolutely fantastic. Quote Link to comment Share on other sites More sharing options...
pindiespace Posted September 4, 2016 Share Posted September 4, 2016 So, the VRDeviceOrientationCamera is doing barrel distortion? What part of the Babylon engine is creating the distortion (and is is a vertex or fragment shader)? Quote Link to comment Share on other sites More sharing options...
RaananW Posted September 5, 2016 Author Share Posted September 5, 2016 Hi, yes it does. There is a post processing effect doing this. If you are looking to configure this, check the VRMetrices object (that you can provide a VR orientation camera during construction). If you wonder WHERE it is defined - https://github.com/BabylonJS/Babylon.js/blob/master/src/Cameras/babylon.camera.ts#L536 the post process class is here - https://github.com/BabylonJS/Babylon.js/blob/master/src/PostProcess/babylon.vrDistortionCorrectionPostProcess.ts Quote Link to comment Share on other sites More sharing options...
pindiespace Posted September 6, 2016 Share Posted September 6, 2016 Great, I'll look at the postprocessing class! Lazy question - is the vertex distortion, or done in a fragment shader? I've been working with your examples and got the VRFreeCamera to work reasonably well with webvr-polyfill. - have to have a <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" /> in the HTML to get the polyfill to work properly. - the polyfill has a patch for iPhone 5 which adds some bad padding to the bottom and right of the canvas. The patch incorrectly adds padding to the newest versions of iOS, so it just needs to be turned off. function isIPhone5 () { if ( navigator.userAgent.match( /iPhone/i ) ) { if( window.screen.height == ( 1136 / 2 ) ) { // specific to iphone 5 return true; } } return false; }; I compared running your examples on a smartphone with VRDeviceOrientationCamera versus WebVRFreeCamera + webvr-polyfill. - the VRDeviceOrientationCamera makes a very sharp image, but is too small for my iPhone 6s "phablet". Needs to be a bit larger relative to viewport. - WebVRFreeCamera + webvr-polyfill + above patches works. The distorted stereo images fill the screen, but are blurry compared to VRDeviceOrientationCamera. It seems strange, since webvr-polyfill uses vertex-based distortion, so shouldn't affect blurryness. testbed: http://plyojump.com/projects/webvr-babylon-orientation-webvr Should have a version toggling the webvr-polyfill + WebVRFreeCamera vs VRDeviceOrientationCamera soon. Quote Link to comment Share on other sites More sharing options...
pindiespace Posted September 6, 2016 Share Posted September 6, 2016 Here's the completed test program http://plyojump.com/projects/webvr-babylon-orientation-webvr The program has buttons showing how things work. WebVR native works. webvr-polyfill works, but only one time. It fires when you try to add distortion, rather than when you try to start WebVR presenting (meaning we switch to WebVRFreeCamera) Sequence: 1. On load, toggles VRDeviceOrientationCamera if there is no WebVR 1a. ArcRotateCamera key movement only works in fullscreen 2. If native WebVR API is present, it can be used by WebVRFreeCamera right away, button will show "webvr" 3. If "load polyfill" button is pushed, web-polyfill can be used, and the program will now use WebVRFreeCamera instead of VRDeviceOrientationCamera 4. Toggle "webvr" button runs undistorted or distorted views using WebVRFreeCamera 5. Image Distortion works ok if native WebVR 6. But webvr-polyfill will work exactly once(!). It jumps to fullscreen all by itself 7. If you are using the polyfill, and try to go to distortion a second time, you get an error. The error is in webvr-polyfill, not Babylon 8. Going to fullscreen always works webvr-polyfill.js:394 Uncaught (in promise) Error: Was not presenting to VRDisplay (Chrome) Firefox gives an error about not being to load a URI Quote Link to comment Share on other sites More sharing options...
pindiespace Posted September 9, 2016 Share Posted September 9, 2016 Brandon Jones just announced some changes to the WebVR spec - but the good news is that it addresses issues with supporting the Microsoft Edge browser! https://github.com/w3c/webvr/blob/gh-pages/migration.md Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.