Escaping the iframe

By default, the pickzen widget is displayed inside an Iframe. This allows to isolate the code and styles of the widget from the holder site avoiding conflicts. However the price of this is that we don't have access to the site context from the custom code defined in the quiz.

In order to execute code from the holder site, we need to use the API function executeJS:

/**
 * code: String with the function name to execute
 * callback: Optional callback function that will be executed 
 *   when the function has been executed.
 * async: If true the callbackfunction is not executed until 
 *   done(resp) is executed in the called function.
 * params: Array with the parameters to be passed to the function. 
Extension.executeJS(code, callback, async, params) 

For example, say we need to send an event from the holder site once a form slide is completed with the entered email. The code to define in the form slide would be something like this:

The holder site should define the function onSend with this format:

window.sendEvent = function(email, origin, done)

In the case of several parameters, for example, [email, name, phone], the function would be:

window.sendEvent = function(email, name, phone, origin, done)

The parameter origin indicates the calling iframe id while done is the function to be called when the function is asynchronous.

We can also define functions in the holder site from the Integration code panel in Integrations / Your Website / Developers: