Evo VR Virtual Tour Creator - integration into multi-user websites

Exemplary integrations of Evo VR Virtual Tour in multi-user websites.
When your website has multi users, you need to submit a unique string for each individual user instead of EXTERNAL_ID. The easiest way is to submit the USER ID you use for the user. It is recommended to use a hash function such as hash("sha256", "EXTERNAL_ID");. The minimum characters to be sent for "EXTERNAL_ID", are 16.
The EvoVR Web API will prompt your individual users to create a WeboBook account and will connect each individual user to your client in the API.
In this way, each individual user will be able to independently manage their virtual tours.

Integration with iframe.

Important!

If you have integrated jQuery on your site, use the "Without jQuery" JS link.
If you do not have integrated jQuery on your site, use the "With jQuery" JS link.
In order for EvoVR to work, you need the jQuery library, but if you are already loading it on your site, you need to put the javascript link, which is without the jQuery library.
<script src="https://webobook.com/asset/as:VIEW_API_KEY"></script> - Without jQuery
<script src="https://webobook.com/asset/af:VIEW_API_KEY"></script> - With jQuery

Generate API keys for your domain and place the corresponding keys instead of "VIEW_API_KEY" in the JS links.

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

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

            var opener = document.getElementById('opener');
			var edtorDiv;
            opener.onclick = function(){             
                edtorDiv = document.createElement("div");  
				edtorDiv.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/api/asset/i:POST_ID,VIEW_API_KEY,EXTERNAL_ID,en");
                ifrm.setAttribute("style", "width:100%;height:100%;border:0;");
				ifrm.setAttribute("allow", "microphone");                
                edtorDiv.appendChild(ifrm);  
                document.body.appendChild(edtorDiv); 
				document.body.setAttribute("style", "overflow: hidden");
            }
			
			if ( window.addEventListener ) {
				window.addEventListener('message', handleClose, false);
			} else if ( window.attachEvent ) { // ie8
				window.attachEvent('onmessage', handleClose);
			}
	
			function handleClose(e){   
				if(  e.data=="evr_editor_closed" && edtorDiv ){
					edtorDiv.remove();
					document.body.removeAttribute("style", "overflow: hidden");
				}
			}

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

Integration with gadget.

Open

Important!

If you have integrated jQuery on your site, use the "Without jQuery" JS link.
If you do not have integrated jQuery on your site, use the "With jQuery" JS link.
In order for EvoVR to work, you need the jQuery library, but if you are already loading it on your site, you need to put the javascript link, which is without the jQuery library.
<script src="https://webobook.com/asset/as:VIEW_API_KEY"></script> - Without jQuery
<script src="https://webobook.com/asset/af:VIEW_API_KEY"></script> - With jQuery

Generate API keys for your domain and place the corresponding keys instead of "VIEW_API_KEY" in the JS links.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>EvoVR Virtual Tour Creator:Test</title>
<link rel="stylesheet" href="https://webobook.com/asset/ev:latest">
<link rel="stylesheet" href="https://webobook.com/asset/ep:latest">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="evovr-tour-editor" postid="101" buttonColor="gray" showGadget="true" showIcon="true" editText="Create a tour" createText="Edit tour" >Open</div>
<script src = "https://webobook.com/asset/af:VIEW_API_KEY"></script>
<script src = "https://webobook.com/api/asset/u:VIEW_API_KEY,EXTERNAL_ID,en"></script>
</body>
</html>

Standard integration.

Open Evo VR Virtual Tour Creator

Important!

If you have integrated jQuery on your site, use the "Without jQuery" JS link.
If you do not have integrated jQuery on your site, use the "With jQuery" JS link.
In order for EvoVR to work, you need the jQuery library, but if you are already loading it on your site, you need to put the javascript link, which is without the jQuery library.
<script src="https://webobook.com/asset/as:VIEW_API_KEY"></script> - Without jQuery
<script src="https://webobook.com/asset/af:VIEW_API_KEY"></script> - With jQuery

Generate API keys for your domain and place the corresponding keys instead of "VIEW_API_KEY" in the JS links.

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>EvoVR Virtual Tour Creator:Test</title>
<link rel="stylesheet" href="https://webobook.com/asset/ev:latest">
<link rel="stylesheet" href="https://webobook.com/asset/ep:latest">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="evovr-tour-editor" postid="101"  showGadget="false" >Open Evo VR Virtual Tour Creator</div>
<script src = "https://webobook.com/asset/af:VIEW_API_KEY"></script>
<script src = "https://webobook.com/api/asset/u:VIEW_API_KEY,EXTERNAL_ID,en"></script>
</body>
</html>