Wednesday August 30, 2006
Mark A. Basler's Weblog
Two articles about JavaServer Faces (JSF) and AJAX where recently published on java.sun.com...
Recently, two useful articles on JSF and AJAX have been released on
java.sun.com to appeal to a developer who is experimenting with AJAX
enabled JSF components. They are as follows:
- Accessing
Resources From JavaServer Faces Custom Components
- Using Default Renderers in JavaServer Faces Technology to Add AJAX Functionality to Existing Components
The articles depict advanced techniques in a way that should be understood by a developer that has limited experience developing JSF components.
More advanced write-ups on JSF, AJAX and the Java Persistence API can be found in the Java BluePrints Solutions Catalog. There are also useful AJAX enabled JSF component libraries available for use in your own applications.
Hope this helps - Mark
Posted by basler Aug 30 2006, 09:39:52 AM PDT Permalink
The Java BluePrints Team has just corrected and unintentional omission in the Java BluePrints Solutions Catalog Java EE 5
The Java BluePrints Team has just corrected and unintentional omission
in the Java
BluePrints Solutions Catalog Java EE 5 version. In the
previous versions of the Java EE 5 Solutions Catalog, only the Java EE
5 components had their source code included. The J2EE 1.4
components binary library was included, but the source was accidently
omitted.
We have just created a second distribution that includes the
J2EE 1.4 component's source and a simple ant build system, so the
components can be built and the resultant jar can be used in your
application or the jar can replace the J2EE 1.4 library that the Java
EE 5 Solutions Catalog uses.
The second distribution entitled "bpcatalog-14-ea-0.6-installer.jar"
includes the following components' source:
- Auto Complete Text Field [How to Use, Screenshot, Movie, Run Example]
- Geo-coder Component [How to Use, Screenshot, Movie, Run Example]
- Google Map Viewer Component [How to Use, Screenshot, Movie, Run Example]
- Progress Bar [How to Use, Screenshot, Movie, Run Example]
- Rating [How to Use, Screenshot, Movie, Run Example]
- PayPal Buy Now [How to Use, Screenshot, Movie, Run Example]
- Popup Calendar[How to Use, Screenshot, Run Example]
Future versions of the Solutions Catalog will include these bits.
Sorry for any inconvenience - Thanks - Mark
Posted by basler Aug 18 2006, 02:09:58 PM PDT Permalink
The Java BluePrints Petstore 2.0 Reference Application that uses Web 2.0 technologies like AJAX, RSS and client-side/server-side mashups is now available for download...
The Java
BluePrints Petstore
2.0 Application is a reference application designed to illustrate
how the Java EE 5 platform
can be used with Web 2.0 technologies. It shows real-world
examples of AJAX, RSS and client-side/server-side mashups that can be
used with Java EE 5 technologies like JavaServer Faces (JSF) and Java
Persistence APIs. The
application comes with full source-code that utilizes the Google Maps
service for location specific
searches of pets, the PayPal service for purchases, an RSS feed as
a data source, and much more.
Many of the AJAX enabled JSF components, like the Popup Balloon,
FileUpload with Progress Bar, Auto-Complete, Rating, PayPal mashup,
Google Map mashup, Yahoo GEO Code Mashup, and RSS Bar came from the Java BluePrints
Solutions Catalog
that can also be downloaded and used in your web applications.
The components and write-ups that the Solutions Catalog contains are
described in more detail in a previous
entry from my blog.
All that needs to be done to get started is to download and install Sun's Open Source
Application Server, Glassfish and then download, configure, and
deploy the Petstore
2.0 reference application. This is a great opportunity to
jump start you and your web application
with Web 2.0 functionality with a minimal learning curve.
Below are some screen shots of the main pages in the application with
brief descriptions of the pages functionality.
Hope this helps - Thanks - Mark
Main Catalog Page

This screen shot is of the main catalog page that contains a large amount of functionality and is the center of the Petstore 2.0 reference application. Some of the main functionality it includes is as follows:
- An image slider bar populated through an AJAX call as the user scrolls
- An accordion menu bar populated from the database though the Java Persistence APIs.
- A cool master-detail transparent display that enables the user to
show/hide the products detailed information.
- The Solutions Catalog's AJAX
Rating component. This component uses a GUI 5 star display
and updates the database with the user selected rating through an AJAX
call. The user value is then averaged with the other user ratings
that
already exist.
- The Solutions Catalog's PayPal
client-side mashup component. This allows the user to
purchase the catalog item through the third party facility.
- The Solutions Catalog's RSS Bar
server-side mashup component which is linked to the Java BluePrints
RSS feed and presented in the header on every page.
PayPal Page

This is a screen shot of the PayPal Developer sandbox page that is populated with the catalog item data from the Petstore's database. This page is presented when the "PayPal" button is clicked on from the Petstore's Catalog Page.
Apache's Lucene Search Engine Page

This page is the front-end search page that utilizes the Apache's Lucene Search Engine on the server. This page searches the indexes and displays a list of results that matches all the entered words in the search string. The AJAX Popup Balloon component that shows more detailed information is triggered when the user mouses-over the name for more than a second. This page is also a lead- in to the Google Maps client-side mash-up page. The user can select the items that they want shown on the map and by entering an optional center-point address with a search area (in miles), can further restrict the map to show only the items in the specific area around the center point.
More information about our experiences using the Apache's Lucene Search Engine can be found in a previous entry from my blog.
Google Map Search Page

This page is the front-end map page that utilizes the database through the Java Persistence APIs to retrieve catalog items by category. This page leads into the Google Maps client-side mashup page and displays the catalog items on the map for the selected category. By entering an optional center-point address with a search area (in miles), the user can further restrict the category to show only the items in the specific area around the center point.
Google Map Mashup Page

This screen shot is of the Google Maps client-side mashup page and shows the selected items, either from the Lucene Search page or the Map Search page. Some of the main functionality it includes is as follows:
- A list of hyper-linked catalog items that activates the
correlated points on the Google Map.
- The Solutions Catalog's Google
Maps client-side mashup component. That plots the catalog item's
addresses as points on a map.
- The Solutions Catalog's AJAX Popup Balloon component that shows more detailed information which is triggered when the user mouses-over the name for more than a second.
- The Solutions Catalog's RSS Bar server-side mashup component which is linked to the Java BluePrints RSS feed and presented in the header on every page.
Seller Catalog Item Upload Page

This screen shot is of the second pane of the Seller Catalog Item Upload Page and shows the item's image being uploaded to the server while displaying the status of the upload to the user. Some of the main functionality it includes is as follows:
- The Captchas security mechanism is utilized in the form of an
image to ensure that the uploaded item is coming from a live user and
not a automated mechanism.
- The Solutions Catalog's AJAX Fileupload and Progress Bar component. This component upload's the entire HTML form through AJAX utilizing Dojo's dojo.io.bind form node functionality. The uploaded stream is parsed and stored on the server using Apache's Commons FileUpload and IO libraries. The optional Progress Bar that shows status of the upload to the user is refreshed using a second AJAX call to retrieve information from the server.
- The Solutions Catalog's Auto-Complete
component provides a list of cities and states that are populated
from the database through the Java Persistence APIs. This list is
retrieved through an AJAX call and is narrowed as the user types
- The Solutions Catalog's Yahoo
GEO Coder server-side mashup component is used to retrieve the
latitude and longitude of the entered address which is used when the
item is displayed on the Google Map.
- Also, the Apache's Lucene
Search
Engine indexes are updated once the fileupload is completed
successfully.
Posted by basler Aug 04 2006, 01:51:56 PM PDT Permalink

