EvoVR Virtual Tour Player - integration of the virtual tour in the iframe

Embedding EvoVR Virtual Tour Player in an iframe

Generate API keys for your domain and paste the appropriate key instead of "VIEW_API_KEY" in the URL.
Put in place of "POST_ID" a unique identification number for your platform with which to identify the virtual tour.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>EvoVR Virtual Tour Player:Test</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
<iframe style="width: 100%; height: 500px; border: none; max-width: 100%;"
 allow="vr, gyroscope, accelerometer, fullscreen" scrolling="no" 
 allowfullscreen="true" frameborder="0" allowfullscreen="true" allowvr="yes" 
 src="https://webobook.com/public/i:POST_ID,VIEW_API_KEY,en" allowvr="yes"></iframe>
</body>
</html>

Embedding the EvoVR Virtual Tour Player in a frame that loads in a modal window

Generate API keys for your domain and paste the appropriate key instead of "VIEW_API_KEY" in the URL.
Put in place of "POST_ID" the unique identification number you put for EvoVR Virtual Tour Creator.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>EvoVR Virtual Tour Player:Test</title>
</head>

<body>
<button id="opener" style="cursor:pointer">Open Tour Creator</button>
<script>

            var opener = document.getElementById('opener');
			var viewerDiv;
            opener.onclick = function(){             
                viewerDiv = document.createElement("div");  
				viewerDiv.setAttribute("style", "position: fixed;left:0;top:0;width:100%;height:100%;z-index:9999;overflow:hidden;");
                var ifrm = document.createElement("iframe");
                ifrm.setAttribute("src", "https://webobook.com/public/i:POST_ID,VIEW_API_KEY,en,modal");
                ifrm.setAttribute("style", "width:100%;height:100%;border:0;"); 
				ifrm.setAttribute("allow", "vr, gyroscope, accelerometer, fullscreen");	
				ifrm.setAttribute("allowfullscreen", "true");	
				ifrm.setAttribute("allowvr", "yes");	
				ifrm.setAttribute("scrolling", "no");	
				ifrm.setAttribute("width", "100%");	
				ifrm.setAttribute("height", "100%");
				document.body.setAttribute("style", "overflow: hidden");					
                viewerDiv.appendChild(ifrm);  
                document.body.appendChild(viewerDiv); 
            }
			
			if ( window.addEventListener ) {
				window.addEventListener('message', handleClose, false);
			} else if ( window.attachEvent ) { // ie8
				window.attachEvent('onmessage', handleClose);
			}
	
			function handleClose(e){   
				if(  e.data=="evr_viewer_closed" && viewerDiv ){
					viewerDiv.remove();
					document.body.removeAttribute("style", "overflow: hidden");
				}
			} 

</script>
</body>
</html>