WebVR.js 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. /**
  2. * @author mrdoob / http://mrdoob.com
  3. * Based on @tojiro's vr-samples-utils.js
  4. */
  5. var WEBVR = {
  6. isAvailable: function () {
  7. return navigator.getVRDisplays;
  8. },
  9. getMessage: function () {
  10. var message;
  11. if ( navigator.getVRDisplays ) {
  12. navigator.getVRDisplays().then( function ( displays ) {
  13. if ( displays.length === 0 ) message = 'WebVR supported, but no VRDisplays found.';
  14. } );
  15. } else if ( navigator.getVRDevices ) {
  16. message = 'Your browser supports WebVR but not the latest version. See <a href="http://webvr.info">webvr.info</a> for more info.';
  17. } else {
  18. message = 'Your browser does not support WebVR. See <a href="http://webvr.info">webvr.info</a> for assistance.';
  19. }
  20. if ( message !== undefined ) {
  21. var container = document.createElement( 'div' );
  22. container.style.position = 'absolute';
  23. container.style.left = '0';
  24. container.style.top = '0';
  25. container.style.right = '0';
  26. container.style.zIndex = '999';
  27. container.align = 'center';
  28. var error = document.createElement( 'div' );
  29. error.style.fontFamily = 'sans-serif';
  30. error.style.fontSize = '16px';
  31. error.style.fontStyle = 'normal';
  32. error.style.lineHeight = '26px';
  33. error.style.backgroundColor = '#fff';
  34. error.style.color = '#000';
  35. error.style.padding = '10px 20px';
  36. error.style.margin = '40px';
  37. error.style.display = 'inline-block';
  38. error.innerHTML = message;
  39. container.appendChild( error );
  40. return container;
  41. }
  42. },
  43. getButton: function ( effect ) {
  44. var button = document.createElement( 'button' );
  45. button.style.position = 'absolute';
  46. button.style.left = 'calc(50% - 30px)';
  47. button.style.bottom = '20px';
  48. button.style.border = '0';
  49. button.style.padding = '8px';
  50. button.style.cursor = 'pointer';
  51. button.style.backgroundColor = '#000';
  52. button.style.color = '#fff';
  53. button.style.fontFamily = 'sans-serif';
  54. button.style.fontSize = '13px';
  55. button.style.fontStyle = 'normal';
  56. button.style.zIndex = '999';
  57. button.textContent = 'ENTER VR';
  58. button.onclick = function() {
  59. effect.setFullScreen( true );
  60. };
  61. return button;
  62. }
  63. };