A question about iFrames and Scope
15 July 2017 02:21
Hi, hope you're all well.
I'll try to cut the waffle and stay specific.
My app uses two iFrames (see here): link
The Yellow area, represents the top level 'index.html'
'1' represents an iFrame that shows conditional menus (depending on what scene object is clicked)
'2' represents an iFrame that shows 'my_project.html' (contains the main canvas div and all JS dependencies)
I can get my scene to 'talk' to iFrame 1, using something like:
As you can see, I'm using a JS Callback node to execute the code. In time, I'll swap this to OBJECT_IS_SELECTED with onClick, but for now I want to keep things slightly more simple.
The thing is, I'm struggling to have my menu (contained WITHIN 'iFrame' one, to execute code in my scene)
An important thing to note: I've looked very closely at cartoon_interior and it would be great if I only had one app, and the menu never changed. But due to the fact I'm trying to build something that's scaleable, with multiple conditional menus, it's not quite right for what I want. - I'd like to execute the code from the menu, not from within the my_project.js This is where I get stuck with 'scope'.
So, put simply, as an example scenario…
How would I get my menu (which has it's own dependent JS, for slide animations etc) and is currently unassociated with my_project.js to execute something like this in my scene:
Challenging for someone with a small brain like me :-(
I'll try to cut the waffle and stay specific.
My app uses two iFrames (see here): link
The Yellow area, represents the top level 'index.html'
'1' represents an iFrame that shows conditional menus (depending on what scene object is clicked)
'2' represents an iFrame that shows 'my_project.html' (contains the main canvas div and all JS dependencies)
I can get my scene to 'talk' to iFrame 1, using something like:
function swap_cb(in_params, out_params) {
var loc = "Menu2.html";
parent.document.getElementById('myFrame').setAttribute('src', loc);
}
As you can see, I'm using a JS Callback node to execute the code. In time, I'll swap this to OBJECT_IS_SELECTED with onClick, but for now I want to keep things slightly more simple.
The thing is, I'm struggling to have my menu (contained WITHIN 'iFrame' one, to execute code in my scene)
An important thing to note: I've looked very closely at cartoon_interior and it would be great if I only had one app, and the menu never changed. But due to the fact I'm trying to build something that's scaleable, with multiple conditional menus, it's not quite right for what I want. - I'd like to execute the code from the menu, not from within the my_project.js This is where I get stuck with 'scope'.
So, put simply, as an example scenario…
How would I get my menu (which has it's own dependent JS, for slide animations etc) and is currently unassociated with my_project.js to execute something like this in my scene:
function import_texture() {
if (_selected_obj) {
var id = m_scenes.get_object_data_id(_selected_obj);
m_tex.change_image(_selected_obj, "My_Texture", "./test.png");
}
Challenging for someone with a small brain like me :-(
16 July 2017 06:06
For this I think learning about cross-window communication will help you. An iframe is a whole separate window.
Take a look at this.
Take a look at this.