Help with Iframe in Snap!

I'm trying to make a Snap! project that creates an iframe to another Snap! project in the Snap! window.

unfortunately it gives a bunch of weird javascript errors in the console.

can anyone help?

project link

Well first, you can't put an iframe in a canvas (that's the id="world" element), so instead of appendChild, do after (it adds the iframe after the world element).

Second, why do you want to do this?

Thanks! that works!

as for why I want this, I'm thinking about trying to use it in an OS simulator as a way to run applications.

what's wrong with scenes? or just running the apps in one scene even?

the apps are seperate Snap! projects, so they can't run in the same scene, and you can't import them as seperate scenes without using the Snap! api, which isn't allowed, or opening the project in iframe or popup window, and if I'm going to open it in an iframe anyway, I want to try to do it this way.


IDK I just think this method is cool, since all the methods require JS anyway.

Actually you can. Just save the project to your account, then file > Add scene... then select the project.

yes, that works too, but I meant programmatically.

You don't have to mess with the api either. If you're using javascript, you can just add a scene (now, grabbing a snap project might be accessing the api, but if you're just grabbing a project, I don't think it would detect you as "hacking", or at least if you do it the same way snap does internally).

pretty sure you're not allowed to grab projects like that

Then I'd also assume creating iframes in a project is also not allowed.


but in the case of iframes Im not really accessing the Snap! cloud, Im letting Snap! do that itself.

Im not 100% sure on that though

can you share the js code you're using (that works) please?

the project link is in the main post

The code anyway just for fun
let iframe = document.createElement("iframe")
iframe.setAttribute("allow", "geolocation; microphone;camera")
iframe.setAttribute("style","position:relative; top:100px; left:200px; z-index:50;")
let thingone = document.getElementById("world")

im gonna try and make it draggable, but this is pretty freaking cool