The OpenAjax Alliance is an organization of leading vendors, open source projects, and companies using AJAX that are dedicated to the successful adoption of open and interoperable AJAX-based Web technologies. This article introduces the alliance's first major technical product, OpenAjax Hub 1.0.
The OpenAjax Hub is a set of standard JavaScript that, when included with an AJAX-powered Web application, promotes the ability for multiple AJAX toolkits to work together on the same page.
The central feature of the OpenAjax Hub is its publish/subscribe event manager (the "pub/sub manager"), which enables loose assembly and integration of AJAX components. With the pub/sub manager, one AJAX component can publish (i.e., broadcast) an event to which other AJAX components can subscribe, thereby allowing these components to communicate with each other through the Hub, which acts as an intermediary message bus.
The umbrella use case for the OpenAjax Hub is the set of scenarios in which an AJAX developer needs to deploy a single application that uses multiple AJAX libraries simultaneously. Here are some specific scenarios:
• Your favorite AJAX library does not address all requirements: In some cases, an AJAX developer might choose to build the majority of his applications using one particular AJAX library, but discovers that the library lacks a particular feature that he needs, and therefore would like to integrate a component from a different AJAX library. In other cases, most of the applications might be (non- AJAX) DHTML, but the developer would like to incorporate two components of AJAX technology into the application, where the two components come from different AJAX libraries.
• Mashups: A developer (or end user) is likely to find that the different components participating in the mashup are based on different AJAX libraries.
• Portals: Just as with mashups, it is likely that different AJAX-powered portlets will be based on different AJAX libraries.
• Preference for a loosely coupled application architecture: The Hub's pub/sub engine provides an industry-standard approach for a simple, loosely coupled AJAX component integration facility within a Web page. Because the Hub's pub/sub engine is independent of particular toolkits, implementing to the Hub can sometimes provide modularization benefits that might allow for modular replacement of some technologies used within a given Web page.
The Hub's Publish/Subscribe Manager
The Hub's pub/sub manager allows one part of a mashup to broadcast an event to which other application components subscribe. Let's illustrate with an example.
Suppose we have a business intelligence application that uses the following AJAX runtime libraries:
- UTILS.js: Provides highly useful extensions to the browser's JavaScript environment, such as XMLHttpRequestAPIs
- CALENDAR.js: Provides a calendar widget
- CHARTS.js: Provides a charting widget
- DATAGRID.js: Provides an interactive data grid widget
Let's assume that the application has a single calendar widget that allows the user to pick a particular date or date range. Along with the calendar, there are various data visualization components in the form of chart widgets (such as a variety of bar charts for daily status, weekly status, monthly status, and yearly status) and data grid widgets (such as selectors for regional data versus national data, both with user-selected columns of interest). Whenever a new date or date range is selected in the calendar widget, the various user-specified visualization components - that is, the charts and/or data grid widgets - need to be updated.
One way to implement this application is to load the JavaScript for the OpenAjax Hub before loading the other AJAX libraries. For example:
<html>
<head>
...
<script type="text/javascript" src="OpenAjax.js"/>
<script type="text/javascript" src="UTILS.js"/>
<script type="text/javascript" src="CALENDAR.js"/>
<script type="text/javascript" src="CHARTS.js"/>
<script type="text/javascript" src="DATAGRID.js"/>
...
</head>
...
(Note: Some AJAX runtimes will include the OpenAjax Hub as part of their standard distribution, in which case, as long as the given AJAX runtime's JavaScript is loaded before other OpenAjax-compatible runtimes are loaded, it might not be necessary to include a separate <script> element for OpenAjax.js.)
To make the application work, the developer registers a callback function that is invoked whenever the user selects a new date in the calendar widget. This callback function then broadcasts the new date event using the OpenAjax Hub's publish() function:
<script type="text/javascript">
// Somewhere in earlier JavaScript code, you need
// to invoke the calendar widget's APIs to
// register MyCalendarCallback as the callback
// function for when a new date is selected
...
function MyCalendarCallback(...) {
// Publish the "myapp.newdata" event via
// the OpenAjax Hub.
OpenAjax.hub.publish("myapp.newdate", newdate);
}
...
</script>
Subscribe to AJAX & RIA Journal Email News Alerts
Subscribe via RSS
