iFrame close itself?

Q&A about the latest versions
Post Reply
LProbert
Posts: 58
Joined: Thu May 21, 2020 11:53 am

Fri May 29, 2020 4:48 pm

I need to open an iFrame that acts like an AgeGate for allowing people into the experience. To do this, I need to popup an iFrame that will close itself if they have entered the correct details into a form. Can this be done?
LProbert
Posts: 58
Joined: Thu May 21, 2020 11:53 am

Wed Jun 03, 2020 11:41 am

I guess this is harder than it should be. The issue is that your skin is setting the visibility of the 'web_page' element, and I would need to set that variable from within the logic in my iFrame website.
I am guessing this is how we do it:

Code: Select all

onCloseClicked: function() {
        var pano = window.parent.document.pano; // how do i get this pano object from the dom?
        pano.setVariableValue('vis_website', false);
    },
LProbert
Posts: 58
Joined: Thu May 21, 2020 11:53 am

Wed Jun 03, 2020 12:06 pm

As expected, it doesn't recognise `pano` from my code. Anyone know how to reference this API object from iFrame source?

I also doubt whether setting the variable like so

Code: Select all

pano.setVariableValue('vis_website', false);
is enough to immediately hide the iframe. Would you need to also trigger an update event?
LProbert
Posts: 58
Joined: Thu May 21, 2020 11:53 am

Wed Jun 03, 2020 12:43 pm

It was as easy as this ...

Code: Select all

onCloseClicked: function() {
        parent.pano.setVariableValue('vis_website', false);
    },
Just be aware that the variable name is set in the skin I am using.
:D
User avatar
Tony
Posts: 1023
Joined: Mon Feb 15, 2010 6:54 am
Location: Adelaide, South Australia
Contact:

Thu Jun 04, 2020 12:48 am

Hi,

Any link where we can see this in action?

Tony
Tony Redhead | Panoramic Photographer | mobile: +61438501002 | website: http://tonyredhead.com - http://redsquare.com | roundme: http://round.me/@tonyredhead | instagram: https://www.instagram.com/tonyredhead/
SAwity
Posts: 28
Joined: Fri Sep 07, 2018 9:38 am

Fri Jun 05, 2020 6:29 pm

How did you implement this, please? I want to do something similar by creating a paywall.
LProbert
Posts: 58
Joined: Thu May 21, 2020 11:53 am

Fri Jun 05, 2020 6:59 pm

I'm unable to send a link to this project yet, but it is live in July, so soon.

To close an iframe from within the iframe content you need to have full access to the content, and I believe it also needs to be in the same domain.
The code I posted ...

Code: Select all

onCloseClicked: function() {
        parent.pano.setVariableValue('vis_website', false);
    },
    
... uses the javascript API to set the visibility of the iframe element. Depending on how you are showing and hiding your iframe in the skin, you may have a variable for turning the visibility on and off. This is the

Code: Select all

vis_website
variable in the code.

In my website i have a button and a javascript function called

Code: Select all

onCloseClicked
but be sure that the scope in which this function is called is correct for

Code: Select all

parent.pano
.

There may be a more global way to refer to the pano object. I'm not sure.
Post Reply