EvoVR Virtual Tour Creator - integration in iframe
Embedding EvoVR Virtual Tour Creator in an iframe
Generate API keys for your domain and place the corresponding keys instead of "VIEW_API_KEY"
and "EDIT_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 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,EDIT_API_KEY,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 in portals with multi-user access
The EvoVR Web API can be integrated into multi-user applications. To separate individual users you need to submit the user id in place of "EDIT_API_KEY"
.
It is recommended to use a hash function such as hash("sha256", "EDIT_API_KEY");
.
The minimum characters to be sent for "EDIT_API_KEY"
, 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.