Skip Navigation

Registering Event Listeners in Web Apps with JavaScript

The procedures below show how to implement complex event listening, in which a browser with a web app is opened when an event occurs.

Registering an Event Listener for an Editor

Add an EventListener entry in redapp.xml. The syntax is shown below.

<EventListener event_filter="EMU_COMMAND"
handler_class="com.sabre.edge.cf.webapp.events.listener.WebEditorEventListener"
desc="" state="PRE" action_code="1">
<ExternalHandler
target="com.sabre.redapp.example.browser.editor.SimpleBrowserEditor:alert" />
</EventListener>

In this example:

A Red App registers an event listener for the EMU_COMMAND published event for commands that begin with 1 and a state of PRE. The Red App is notified about this event before markup changes for the command prefix 1.

The Editor ID in the target attribute is opened or given focus. When loading of the page is done, the JavaScript function that is specified after the colon (:) character in the target attribute is called with a JSON representation of the event. The alert(Event) method is called.

For details about the EventListener`entry and attributes in `redapp.xml, see Registering Event Listeners in Web Apps Using JavaScript Functions.

Registering an Event Listener for a View

Add a dependency to the plug-in com.sabre.edge.cf.webapp.events to manifest file. Add an EventListener entry in redapp.xml. The syntax is shown below.

<EventListener event_filter="EMU_COMMAND"
handler_class="com.sabre.edge.cf.webapp.events.listener.ForceOpenWebViewEventListener"
desc="" state="PRE" action_code="1" >
<ExternalHandler
target="com.sabre.redapp.example.browser.BasicCommunication:alert" />
</EventListener>

In this example:

A Red App registers an event listener for the EMU_COMMAND published event for Sabre emulator commands that begin with 1 with a state of PRE. The Red App is notified about this event before markup changes for the command prefix 1.

The View ID in the target attribute is opened or given focus. When loading of the page is done, the JavaScript function that is specified after the colon (:) character in the target attribute is called with a JSON representation of the event. The alert(Event) method is called.

For details about the EventListener`entry and attributes in `redapp.xml, see Registering Event Listeners in Web Apps Using JavaScript Functions.

  1. Ensure that the view contains the web page that you want. The menu item that opens the view cannot have a url parameter. Set the URL for the browser view by using an extension point in plugin.xml as shown below.

<menuContribution
            allPopups="false"
            locationURI="menu:tools">
         <command
               commandId="com.sabre.redapp.example.browser.OpenBrowserView"
               icon="images/icon.png"
               label="Open Browser OSGI Communication View"
               style="push">
            <parameter
                  name="viewId"
                  value="com.sabre.redapp.example.browser.BasicCommunication" />
         </command>
</menuContribution>
   <extension
         point="com.sabre.edge.platform.core.ui.viewApp">
         <viewApp viewId="com.sabre.redapp.example.browser.BasicCommunication" browserURL="${plugin_resources}/osgi_communication/basic.html" />
   </extension>

The URL is the value of browserURL in the extension point. It is given to the browser while the view is opened from a menu or triggered by an event. For more information about using plugin_resources, see Unpacking and Copying Resources from a Plug-in.