title: Toggle Button "ENTER VR" not working in three js
body: <p>i am using google  Chrome (59.0.3071.125)  in my mobile </p>
  
  <p>i was Enabled :  WebVR , Gamepad  in my chrome using chrome://flags/ to support  WEBVR when i tried first time it worked 
  BUT after 2 days now its givig this exception:</p>
  
  <p>Uncaught (in promise) DOMException: Presentation request was denied.</p>
  
  <p>I have no clue why. 
  i tried to search around but i found nothing</p>
  
  <p>below is the code of <a href="https://threejs.org/examples/?q=vr#webvr_cubes" rel="nofollow noreferrer">https://threejs.org/examples/?q=vr#webvr_cubes</a> i have tried</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
      &lt;head&gt;
          &lt;title&gt;three.js webvr - cubes&lt;/title&gt;
          &lt;meta charset="utf-8"&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"&gt;
          &lt;!-- Origin Trial Token, feature = WebVR, origin = https://threejs.org, expires = 2017-06-13 --&gt;
          &lt;meta http-equiv="origin-trial" data-feature="WebVR" data-expires="2017-06-13" content="ApAQvHfiHMQB7SmRhfvCUX61adJaTA6pAu0Ry439jjeipa5lGm1RcTQynFoHGGcaSJkWfMOv7qK6pwSUb95ClQgAAABKeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJWUiIsImV4cGlyeSI6MTQ5NzMxMjAwMH0="&gt;
          &lt;style&gt;
              body {
                  font-family: Monospace;
                  background-color: #101010;
                  color: #fff;
                  margin: 0px;
                  overflow: hidden;
              }
              a {
                  color: #f00;
              }
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
  
          &lt;script src="../build/three.js"&gt;&lt;/script&gt;
  
          &lt;script src="js/controls/VRControls.js"&gt;&lt;/script&gt;
          &lt;script src="js/effects/VREffect.js"&gt;&lt;/script&gt;
          &lt;script src="js/vr/WebVR.js"&gt;&lt;/script&gt;
  
          &lt;script&gt;
  
              if ( WEBVR.isAvailable() === false ) {
  
                  document.body.appendChild( WEBVR.getMessage() );
  
              }
  
              //
  
              var clock = new THREE.Clock();
  
              var container;
              var camera, scene, raycaster, renderer;
              var effect, controls;
  
              var room;
              var isMouseDown = false;
  
              var INTERSECTED;
              var crosshair;
  
              init();
              animate();
  
              function init() {
  
                  container = document.createElement( 'div' );
                  document.body.appendChild( container );
  
                  var info = document.createElement( 'div' );
                  info.style.position = 'absolute';
                  info.style.top = '10px';
                  info.style.width = '100%';
                  info.style.textAlign = 'center';
                  info.innerHTML = '&lt;a href="http://threejs.org" target="_blank"&gt;three.js&lt;/a&gt; webgl - interactive cubes';
                  container.appendChild( info );
  
                  scene = new THREE.Scene();
  
                  camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 10 );
                  scene.add( camera );
  
                  crosshair = new THREE.Mesh(
                      new THREE.RingGeometry( 0.02, 0.04, 32 ),
                      new THREE.MeshBasicMaterial( {
                          color: 0xffffff,
                          opacity: 0.5,
                          transparent: true
                      } )
                  );
                  crosshair.position.z = - 2;
                  camera.add( crosshair );
  
                  room = new THREE.Mesh(
                      new THREE.BoxGeometry( 6, 6, 6, 8, 8, 8 ),
                      new THREE.MeshBasicMaterial( { color: 0x404040, wireframe: true } )
                  );
                  scene.add( room );
  
                  scene.add( new THREE.HemisphereLight( 0x606060, 0x404040 ) );
  
                  var light = new THREE.DirectionalLight( 0xffffff );
                  light.position.set( 1, 1, 1 ).normalize();
                  scene.add( light );
  
                  var geometry = new THREE.BoxGeometry( 0.15, 0.15, 0.15 );
  
                  for ( var i = 0; i &lt; 200; i ++ ) {
  
                      var object = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: Math.random() * 0xffffff } ) );
  
                      object.position.x = Math.random() * 4 - 2;
                      object.position.y = Math.random() * 4 - 2;
                      object.position.z = Math.random() * 4 - 2;
  
                      object.rotation.x = Math.random() * 2 * Math.PI;
                      object.rotation.y = Math.random() * 2 * Math.PI;
                      object.rotation.z = Math.random() * 2 * Math.PI;
  
                      object.scale.x = Math.random() + 0.5;
                      object.scale.y = Math.random() + 0.5;
                      object.scale.z = Math.random() + 0.5;
  
                      object.userData.velocity = new THREE.Vector3();
                      object.userData.velocity.x = Math.random() * 0.01 - 0.005;
                      object.userData.velocity.y = Math.random() * 0.01 - 0.005;
                      object.userData.velocity.z = Math.random() * 0.01 - 0.005;
  
                      room.add( object );
  
                  }
  
                  raycaster = new THREE.Raycaster();
  
                  renderer = new THREE.WebGLRenderer( { antialias: true } );
                  renderer.setClearColor( 0x505050 );
                  renderer.setPixelRatio( window.devicePixelRatio );
                  renderer.setSize( window.innerWidth, window.innerHeight );
                  renderer.sortObjects = false;
                  container.appendChild( renderer.domElement );
  
                  controls = new THREE.VRControls( camera );
                  effect = new THREE.VREffect( renderer );
  
                  WEBVR.getVRDisplay( function ( display ) {
  
                      document.body.appendChild( WEBVR.getButton( display, renderer.domElement ) );
  
                  } );
  
                  renderer.domElement.addEventListener( 'mousedown', onMouseDown, false );
                  renderer.domElement.addEventListener( 'mouseup', onMouseUp, false );
                  renderer.domElement.addEventListener( 'touchstart', onMouseDown, false );
                  renderer.domElement.addEventListener( 'touchend', onMouseUp, false );
  
                  //
  
                  window.addEventListener( 'resize', onWindowResize, false );
  
              }
  
              function onMouseDown() {
  
                  isMouseDown = true;
  
              }
  
              function onMouseUp() {
  
                  isMouseDown = false;
  
              }
  
              function onWindowResize() {
  
                  camera.aspect = window.innerWidth / window.innerHeight;
                  camera.updateProjectionMatrix();
  
                  effect.setSize( window.innerWidth, window.innerHeight );
  
              }
  
              //
  
              function animate() {
  
                  effect.requestAnimationFrame( animate );
                  render();
  
              }
  
              function render() {
  
                  var delta = clock.getDelta() * 60;
  
                  if ( isMouseDown === true ) {
  
                      var cube = room.children[ 0 ];
                      room.remove( cube );
  
                      cube.position.set( 0, 0, - 0.75 );
                      cube.position.applyQuaternion( camera.quaternion );
                      cube.userData.velocity.x = ( Math.random() - 0.5 ) * 0.02 * delta;
                      cube.userData.velocity.y = ( Math.random() - 0.5 ) * 0.02 * delta;
                      cube.userData.velocity.z = ( Math.random() * 0.01 - 0.05 ) * delta;
                      cube.userData.velocity.applyQuaternion( camera.quaternion );
                      room.add( cube );
  
                  }
  
                  // find intersections
  
                  raycaster.setFromCamera( { x: 0, y: 0 }, camera );
  
                  var intersects = raycaster.intersectObjects( room.children );
  
                  if ( intersects.length &gt; 0 ) {
  
                      if ( INTERSECTED != intersects[ 0 ].object ) {
  
                          if ( INTERSECTED ) INTERSECTED.material.emissive.setHex( INTERSECTED.currentHex );
  
                          INTERSECTED = intersects[ 0 ].object;
                          INTERSECTED.currentHex = INTERSECTED.material.emissive.getHex();
                          INTERSECTED.material.emissive.setHex( 0xff0000 );
  
                      }
  
                  } else {
  
                      if ( INTERSECTED ) INTERSECTED.material.emissive.setHex( INTERSECTED.currentHex );
  
                      INTERSECTED = undefined;
  
                  }
  
                  // Keep cubes inside room
  
                  for ( var i = 0; i &lt; room.children.length; i ++ ) {
  
                      var cube = room.children[ i ];
  
                      cube.userData.velocity.multiplyScalar( 1 - ( 0.001 * delta ) );
  
                      cube.position.add( cube.userData.velocity );
  
                      if ( cube.position.x &lt; - 3 || cube.position.x &gt; 3 ) {
  
                          cube.position.x = THREE.Math.clamp( cube.position.x, - 3, 3 );
                          cube.userData.velocity.x = - cube.userData.velocity.x;
  
                      }
  
                      if ( cube.position.y &lt; - 3 || cube.position.y &gt; 3 ) {
  
                          cube.position.y = THREE.Math.clamp( cube.position.y, - 3, 3 );
                          cube.userData.velocity.y = - cube.userData.velocity.y;
  
                      }
  
                      if ( cube.position.z &lt; - 3 || cube.position.z &gt; 3 ) {
  
                          cube.position.z = THREE.Math.clamp( cube.position.z, - 3, 3 );
                          cube.userData.velocity.z = - cube.userData.velocity.z;
  
                      }
  
                      cube.rotation.x += cube.userData.velocity.x * 2 * delta;
                      cube.rotation.y += cube.userData.velocity.y * 2 * delta;
                      cube.rotation.z += cube.userData.velocity.z * 2 * delta;
  
                  }
  
                  controls.update();
                  effect.render( scene, camera );
  
              }
  
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>