Example of an embedded panel

<EmbeddedPanel
  actionHandler="\ json: gw.api.json.JsonObject -&gt; goToPage(json)"
  appOrigin="appOrigin"
  appUrl="appUrl"
  contextProvider="panelContext(2)"
  id="Embedded"
  requestType="POST"
  updateHandler="\ json: gw.api.json.JsonObject -&gt; verifyPage(json)">
  <EmbeddedWidgetRef
    name="parentValue"
    widget="Value"/>
</EmbeddedPanel>

The appUrl, requestType, and contextProvider attributes all determine how the iframe is initially created. The appUrl attribute specifies where the iframe gets its data, either through an HTTP GET or a POST, depending on the value of requestType. The contextProvider attribute is an optional Gosu fragment. If present, contextProvider must return a gw.api.json.JsonObject whose contents are used as parameters to the initial iframe request. If the initial request is a GET, then the parameters are appended to the appUrl. If the initial request is a POST, then the parameters are encoded as form parameters.

The optional appOrigin attribute is used whenever the iframe communicates with PolicyCenter. Because of the same-origin browser policy, JavaScript in the PolicyCenter window cannot call functions in the iframe or access the DOM of the iframe. In addition, the iframe cannot access the PolicyCenter JavaScript or DOM. All communication between the iframe and the PolicyCenter window must be done using the standard Window.postMessage API. When the iframe calls postMessage to communicate with PolicyCenter, the browser automatically tags that message with the origin of the iframe. The origin is the first part of the URL that is displayed in the iframe (for example, https://somesite.com:80). PolicyCenter then checks that the origin matches the appOrigin that it expects, and rejects the message if it does not match. If appOrigin is omitted, it defaults to be the start of appUrl.

The actionHandler and updateHandler attributes are Gosu fragments that may be invoked by the embedded application. These attributes are functions (or blocks, as in the previous example) that take a JSON object as their argument. When the actionHandler is called, the PolicyCenter page is rendered again. This allows an actionHandler to perform operations such as calling SomePage.go() to change the current page. When the updateHandler is called, it returns another JSON object, which PolicyCenter passes to the embedded widget without rendering the page again. This gives embedded widgets a fast way to obtain a piece of information from InsuranceSuite.

// Call actionHandler; result is a Promise that can be used to check for any error
GwCrossOriginExternal.fireActionOnServer(json);
 
// Call updateHandler; result is a Promise that will return the JSON object returned by the handler
GwCrossOriginExternal.makeNonBlockingServerRequest(json).then(function(result) {
  console.log("Got result from InsuranceSuite: ", result);
})

The EmbeddedWidgetRef element makes an editable input on the PCF page available to the embedded application. In the previous example, the input with the ID Value is available to the embedded application under the name parentValue.

// Get the value of the named widgets; result is a Promise that will return an object containing the values
GwCrossOriginExternal.getValues(["parentValue"]).then(function(values) {
  console.log("Value was: ", values.parentValue);
})
 
// Set the value of the named widgets; result is a Promise that can be used to check for any error
GwCrossOriginExternal.setValues({parentValue: "Hello"});

Note that GwCrossOriginExternal API makes heavy use of Promise, an object representing the eventual completion or failure of an asynchronous operation. It is necessary to use Promise because all communication between the iframe and PolicyCenter is done through the asynchronous Window.postMessage API. Modern browsers support Promise natively, and gw-embedded-ts.js provides a Promise implementation for Microsoft Internet Explorer 11.