For the communication between different windows, postmessage is surely a better solution than anything. I was trying the same thing from the iframe but id didn’t seem to work. So, i changed things by first i sent a message from playcanvas like this so that my window may know that playcanvas build is loaded:
window.top.postMessage("Playcanvas_Ready", "*");
And received it on the other window i.e iframe with the following function:
window.addEventListener('message', function(event) {
// debugger;
//alert(`Received ${event.data} from ${event.origin}`);
// line 2
document.getElementById('playcanvasInput').contentWindow.postMessage('hello','https://playcanv.as');
if(source ==null)
{
source=event.source;
origin= event.origin;
}
//event.source.postMessage('Message received', event.origin);
});
At line 2, i sent back the message to the playcanvas and here is how I receive it in playcanvas and it worked well. Remember the following code was outside of any function i.e initilize/update etc
function displayMessage (evt) {
var message;
console.log(evt);
if (evt.origin !== "https://robertnyman.com")
{
message = "You are not worthy";
}
else {
message = "I got " + evt.data + " from " + evt.origin;
}
//document.getElementById("received-message").innerHTML = message;
}
if (window.addEventListener) {
// For standards-compliant web browsers
window.addEventListener("message", displayMessage, false);
}
else {
window.attachEvent("onmessage", displayMessage);
}