Welcome!

Java IoT Authors: Pat Romanski, Elizabeth White, Liz McMillan, Yeshim Deniz, Mehdi Daoudi

Related Topics: Machine Learning , Java IoT

Machine Learning : Article

AjaxWorld Special: Creating AJAX and Rich Internet Components with JSF

AJAX has gained momentum primarily due to the "XMLHttpRequest" browser object which supports asynchronous communication

The ID attribute on the binding element (in Listing 3 "welcome" and "bye") identifies the binding. Using CSS, a developer can assign a binding to an element by setting the -moz-binding URI property to reference the binding inside the XBL document.

Note: The way custom behavior can be attached to an HTML element has been submitted as a proposal to the W3C organization - "A Modular Way of Defining Behavior for XML and HTML" (www.w3.org/TR/NOTE-AS) by Netscape Communications Corp.

bob\:welcome
{
-moz-binding: url('bob-xbl.xml#welcome');
}

In the above sample, the CSS selector for the bob:welcome element has the -moz-binding set to point to an XBL file named bob-xbl.xml and refers to a specific binding with ID welcome in the XBL file. This is similar to how anchors are used in HTML files.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
<head>
<link rel="stylesheet" type="text/css" href="bob.css" >
<title>Mozilla XBL Example</title>
</head>
<body>
<div><bob:welcome name="Bob" ></bob:welcome></div>
</body>
</html>
In the above HTML sample the bob.css stylesheet has been attached to the HTML document, and there is one element <bob:welcome name="Bob"></bob:welcome> inserted in the page. One cool feature to using XBL's encapsulation of behavior is that it creates a document tree within the scope of the custom component that is separate from the main HTML page. This means that the XBL component markup is not "exploded" into the main document, losing encapsulation (see Figure 1).

The direct benefits of encapsulation are full control over both the behavior and the look-and-feel, but without exposing any internal implementation details (see Figure 2).

Adding Functionality to an XBL Binding
XBL can be used to add new fields, properties, and methods to XUL elements. A field is a simple container that can store a value that can be retrieved and set. A property is slightly more complex and is used to validate values stored in fields or values retrieved from XBL-defined element attributes. Since the property cannot hold a value, there is no way to set a value directly on a property without using the onset or onget handlers. By using these handlers, a developer can perform precalculation or validation of the value being retrieved or modified (see Figure 3).

Methods are object functions such as window.open(); and allow developers to add custom functions to custom elements. In the XBL file, fields, properties, and methods are defined inside an implementation element that is a child of the binding element (see Listing 4). Developers can use the getElementById function to first locate a custom element before accessing custom properties and methods.

In Listing 5, an HTML button has been added that triggers the onclick event handler. The onclick event handler will execute the assigned script - alert(document.getElementById('welcome').bob) - and display the value of the field called bob.

Handling Events in XBL
In XBL, developers can add event handlers directly to the individual XUL elements inside the content element, e.g., <xul:button label="Press me!" oncommand="alert('welcome')" />. Sometimes it's useful to add an event handler for all the child elements of the content element. In XBL, this can be done by adding a handler element. Each handler defines the action that will be taken for a particular event triggered by any of its content elements.

In XBL sample shown in Listing 6, a button has been added to the welcome binding and one handler has been added to capture all click events in the scope of the welcome binding.

Why Would JSF Be of Any Help?
Of the two technologies used in this article, only XUL is designed to support reusable components in Web applications. XUL allows for the encapsulation of HTML, CSS, and JavaScript into a single component that can be reused by the application developer. AJAX, on the other hand, solves the asynchronous communication to the server that can be used to provide end users with a very responsive UI.

These technologies solve most of the consumer requirements, but are still lacking in support for the application developer. We need a standard way to define Rich Internet Applications that are deployable over the Web without vendor lock-in.

The WHAT (Web Hypertext Application Technology) group is working on a standard tag library for HTML extensions that can work on any browser. Meanwhile, developers are falling back to the lowest common denominator - HTML - and using scripts to build dynamic Web applications, e.g., AJAX. However, this approach of developing Web applications has one severe drawback - there is no good reuse model or easy integration with existing server-side logic.

JavaServer Faces defines a standard component model to server-side Web application development. By integrating JavaServer Faces with XUL and AJAX, we can provide a highly interactive Rich Internet Component suite that also delivers a standard reuse model for Web application developers.

Why a Component Model?
Using components instead of markup is an effective model that allows application developers to build Web applications with prefabricated blocks of functionality without concern for implementation details. Over time, the component author can maintain the internal implementation without adversely impacting the application developer.

Cross-Platform Support
Cross-platform support is critically important for today's technologies, never mind what tomorrow might bring. Consumers are already requesting increased support for platforms such as handheld devices, telnet clients, and instant messaging.

In most cases, applications need to be designed to use features of a specific platform, which in turn is time consuming and costly. As each new platform is added, the time and cost can increase significantly.

For the two technologies previously mentioned in this article, one claims that it has cross platform support - Mozilla's XUL. This is partially true; you can deploy a XUL application to any operating system that the Mozilla platform (GRE) supports.

You could also argue that AJAX provides cross-platform support, but it is the provider of the AJAX solution that needs to ensure that every browser-specific quirk is supported.

So, although you have plenty of environments to deploy to, there is no true solution that has full cross-platform support.

With Imagination as the Only Limit
JSF standardizes the server side for the application developer now, while we wait for the presentation layer at the browser to standardize for component developers.

JSF separates the user interface from the application, making it possible for the component author to change the presentation layer without tampering with the application. This is not solving the cross-platform issue or the extensibility of HTML, but it will help application developers build Rich Internet Applications in an unswervingly standard way.

More Stories By Kaazing Blog

Kaazing is helping define the future of the event-driven enterprise by accelerating the Web for the Internet of Things.

More Stories By John Fallows

John brings to Kaazing his 17 years’ experience in technology development and software design, and is considered a pioneer in the field of rich and highly interactive user interfaces. As CTO he formulates Kaazing Corporation’s vision of enabling mobile users, marketplaces and machines to connect and communicate in real-time, more reliably and at unprecedented scale. He defines the architecture of the Kaazing product suite and oversees its development. Prior to co-founding Kaazing, John served as Architect for Brane Corporation, a startup company based in Redwood City, California. Before joining Brane, he was a Consulting Member of Technical Staff for Server Technologies at Oracle Corporation. During his last five years at Oracle, he focused on designing, developing, and evolving Oracle ADF Faces to fully integrate Ajax technologies. Originally from Northern Ireland, he received his MA in Computer Science from Cambridge University in the United Kingdom and has written several articles for leading IT magazines such as Java Developer’s Journal, AjaxWorld Magazine, and JavaMagazine (DE), and is a popular speaker at international conferences. He is co-author of the bestselling book Pro JSF and Ajax: Building Rich Internet Components (Apress).

Comments (5)

Share your thoughts on this story.

Add your comment
You must be signed in to add a comment. Sign-in | Register

In accordance with our Comment Policy, we encourage comments that are on topic, relevant and to-the-point. We will remove comments that include profanity, personal attacks, racial slurs, threats of violence, or other inappropriate material that violates our Terms and Conditions, and will block users who make repeated violations. We ask all readers to expect diversity of opinion and to treat one another with dignity and respect.


IoT & Smart Cities Stories
The platform combines the strengths of Singtel's extensive, intelligent network capabilities with Microsoft's cloud expertise to create a unique solution that sets new standards for IoT applications," said Mr Diomedes Kastanis, Head of IoT at Singtel. "Our solution provides speed, transparency and flexibility, paving the way for a more pervasive use of IoT to accelerate enterprises' digitalisation efforts. AI-powered intelligent connectivity over Microsoft Azure will be the fastest connected pat...
There are many examples of disruption in consumer space – Uber disrupting the cab industry, Airbnb disrupting the hospitality industry and so on; but have you wondered who is disrupting support and operations? AISERA helps make businesses and customers successful by offering consumer-like user experience for support and operations. We have built the world’s first AI-driven IT / HR / Cloud / Customer Support and Operations solution.
Codete accelerates their clients growth through technological expertise and experience. Codite team works with organizations to meet the challenges that digitalization presents. Their clients include digital start-ups as well as established enterprises in the IT industry. To stay competitive in a highly innovative IT industry, strong R&D departments and bold spin-off initiatives is a must. Codete Data Science and Software Architects teams help corporate clients to stay up to date with the mod...
At CloudEXPO Silicon Valley, June 24-26, 2019, Digital Transformation (DX) is a major focus with expanded DevOpsSUMMIT and FinTechEXPO programs within the DXWorldEXPO agenda. Successful transformation requires a laser focus on being data-driven and on using all the tools available that enable transformation if they plan to survive over the long term. A total of 88% of Fortune 500 companies from a generation ago are now out of business. Only 12% still survive. Similar percentages are found throug...
Druva is the global leader in Cloud Data Protection and Management, delivering the industry's first data management-as-a-service solution that aggregates data from endpoints, servers and cloud applications and leverages the public cloud to offer a single pane of glass to enable data protection, governance and intelligence-dramatically increasing the availability and visibility of business critical information, while reducing the risk, cost and complexity of managing and protecting it. Druva's...
BMC has unmatched experience in IT management, supporting 92 of the Forbes Global 100, and earning recognition as an ITSM Gartner Magic Quadrant Leader for five years running. Our solutions offer speed, agility, and efficiency to tackle business challenges in the areas of service management, automation, operations, and the mainframe.
The Jevons Paradox suggests that when technological advances increase efficiency of a resource, it results in an overall increase in consumption. Writing on the increased use of coal as a result of technological improvements, 19th-century economist William Stanley Jevons found that these improvements led to the development of new ways to utilize coal. In his session at 19th Cloud Expo, Mark Thiele, Chief Strategy Officer for Apcera, compared the Jevons Paradox to modern-day enterprise IT, examin...
With 10 simultaneous tracks, keynotes, general sessions and targeted breakout classes, @CloudEXPO and DXWorldEXPO are two of the most important technology events of the year. Since its launch over eight years ago, @CloudEXPO and DXWorldEXPO have presented a rock star faculty as well as showcased hundreds of sponsors and exhibitors! In this blog post, we provide 7 tips on how, as part of our world-class faculty, you can deliver one of the most popular sessions at our events. But before reading...
DSR is a supplier of project management, consultancy services and IT solutions that increase effectiveness of a company's operations in the production sector. The company combines in-depth knowledge of international companies with expert knowledge utilising IT tools that support manufacturing and distribution processes. DSR ensures optimization and integration of internal processes which is necessary for companies to grow rapidly. The rapid growth is possible thanks, to specialized services an...
At CloudEXPO Silicon Valley, June 24-26, 2019, Digital Transformation (DX) is a major focus with expanded DevOpsSUMMIT and FinTechEXPO programs within the DXWorldEXPO agenda. Successful transformation requires a laser focus on being data-driven and on using all the tools available that enable transformation if they plan to survive over the long term. A total of 88% of Fortune 500 companies from a generation ago are now out of business. Only 12% still survive. Similar percentages are found throug...