Launching External Websites Using Flex Links

You can launch external websites or web-apps by adding flex links to the customizable panels (example: Overview, Profile Details, Stay Details) of the Profile, Reservation, Block and Event presentation pages and the Reservation Check in page.

Flex links can be either a static or dynamic URL.

  • Static URL — A static URL launches a web page where the URL is always the same value.

  • Dynamic URL — A dynamic URL is variable based on values from fields referenced in the link. A dynamic URL can be used to launch an external website or web application and pass OPERA Cloud values in the URL as path or parameter components. For example, you could configure the following dynamic flex link to append the guest’s membership number in the URL:  https://myreward.com/?MemberID=#{bindings.MembershipIdNo.inputValue}

The following properties are available for flex links:

Table 1-11 Flex Link Properties

Property Description

Text

Enter the text to appear as the window header.

Destination

  1. Enter the destination URL (website address).

  2. Click </> to select one or more fields to append to the URL.

The Expression field would contain a string value such as: https://myreward.com/?MemberID=#{bindings.MembershipIdNo.inputValue}

Disabled

  • YES - Link is disabled.

  • NO - Link is enabled.

  • </> - Code EL expression to conditionally set if the flex link is disabled.

Displayed

  • YES - Link is displayed.

  • NO - Link is not displayed.

  • </> - Code EL expression to conditionally set if the flex link is displayed.

Launch URL Mode 

Defines how the Destination URL is launched:

  • New (Browser) window

  • New (Browser) tab

  • Pop-up window (Default 500px height and width, with the modal dimensions definable by the external website, see Supported Browser Events, SET_DIMENSION_EVENT).

Auto Launch Condition

 Enabled when Launch URL Mode = Pop-Up.
  1. Select No to never launch the flex link when the page is opened.
  2. Select Yes to always launch the flex link when the page is opened.
  3. Click </> to enter a condition (using expression language) for when to auto-launch the flex link when the page is opened. For more information, see Adding Custom Business Logic using Expression Language.

    Note:

    OPERA Cloud will identify all flex links with Auto-Launch=true and launch the final flex link displayed in the panel, irrespective of chain, hub/property location where the flex link is defined. Flex links will not auto-launch when the panel is collapsed (+show more) by default.

Automatic Page Refresh 

Select check box to enforce a refresh for OPERA Cloud page when the browser window, browser tab or pop-up window is closed. This is useful when the external website has updated OPERA Cloud via an integration.

Supported Browser Events

Event Description Parameters Example

KEEP_ALIVE_EVENT

Keeps the ADF Session active by invoking a server event. Note that this should be called optimally as this can cause the browser to be chatty. Typically, implement a throttle pattern when invoking this event. The external application should invoke this to prevent OPERA Cloud time out and closing the application

N/A

window.top.postMessage({    ocextappid: 1970498489,    eventId: "KEEP_ALIVE_EVENT" }, "http://127.0.0.1:7201" );

<<-- this is the OPERA Cloud URL which called the website.

SET_HEADER_EVENT

Set the header used in the modal pop-up. 
Name Description

title

String title to change the title of the popup 

window.top.postMessage({    ocextappid: 1970498489,

     eventId:  "SET_HEADER_EVENT" ,

   args: {      title: "Modified Title from OJET"    } }, "http://127.0.0.1:7201" );

<<-- this is the OPERA Cloud URL which called the website.

SET_DIMENSION_EVENT

Set the dimension of the pop-up (and iFrame) rendering the external application. The value needs to be a string of either "percentage" or "pixel" value.
Name Description

width

String width to set the dimension of the iframe

height

String height to set the dimension of the iframe

window.top.postMessage({    ocextappid: 1970498489,    eventId: "SET_DIMENSION_EVENT" ,    args: {      width: "100%" ,      height: "500px"    } }, "http://127.0.0.1:7201" ); 

<<-- this is the OPERA Cloud URL which called the website.

DO_RETURN_EVENT

Close the OPERA Cloud pop-up and trigger a "Refresh" based on the check box set in the Page Composer "Automatic Page Refresh"

N/A

window.top.postMessage({    ocextappid: 1970498489,    eventId: "DO_RETURN_EVENT" }, "http://127.0.0.1:7201" );

<<-- this is the OPERA Cloud URL which called the website.

Related Topics

Parent topic: About Page Composer