Web 2.01, a Rich Internet Application Example

Summary:

Learn about what I call "Web 2.01," a fusion of "Web 2.0" style application content with a "Rich Internet Application" client, which is not subject to many of the limitations of a web browser.

What does a Web 2.01 application look like? Well, here's a screenshot:

Web 2.01 application

Notice that it's a Rich Internet Application. It includes a favorite feeds list, Friend of a Friend functionality, and a way to select favorite authors.

Once you set up your favorites, you can get an XML feed of the favorites via web services.

Visioning:

Back in September of 2005, Tim O'Reilly offered his vision of what distinguishes "Web 2.0" from what went before (which we're left retroactively to call "Web 1.0"). He described a list of correspondences (with a distinctly "what's hot/what's not" flavor to it), some examples being:

I want to show you my vison for the fusion of Web 2.0 with Rich Internet Applications (RiA), which I'm going to call "Web 2.01".

Web 1.0 was dominated by PHP-based applications like vBulletin and Drupal. These frameworks were aimed at the lowest common denominator: a cross platform browser-based user interface(UI) that accessed a single, central server through a dial-up MODEM. Many sites had only the flattest forms of user feedback.

Web 2.0 lives on a services-based ecosystem with a richer UI, enabled by the higher prevalance of users with broadband connections. Appplications are driven by richer, more interwoven data, and include features such as friend of a friend (FOAF) and tagging.

The value proposition isn't dominated by delivering the party line of the central site management, but is more about user input and participation; in short: social networking. The web service approach, having less direct control of the final presentation, also results in the injection of less parasitic content (such as spam and pop-up, pop-over and pop-under advertising).

In short, in Web 2.0 we will see websites and applications (that communicate via service calls) merging into right Internet applications, blurring the distinctions between desktop apps and internet apps, almost re-defining the word webapp to mean any application that talks to the Internet.

When we talk of "rich content", most people think of technologies like:

• Adobe Flash/Flex
• MS ClickOnce
• DHTML/Ajax
• Sun/Google Java Network Launcher (JNLP)

DHTML/Ajax runs only in a browser, and the weaknesses are well-known: the difficulty of obfuscating or otherwise protecting the implementation details of the interface, security issues, injection of parasitic content, maintainability, and scalability. Many experienced developers are dogged by the persistant feeling that AJAX may be just a fad.

For an example AJAX app, look at the Yahoo Mail beta (that only runs on a single platform). Longhorn Clickonce is a 6 months away, and an example done with Flash is Goovy.com.

Java Desktop (JDNC), on the other hand, is cross platform, allows you html edits, and embedding of a browser. For more on the future read http://blogs.zdnet.com/BTL/index.php?p=1987 re: Google and Java.

Adding FOAF and Tagging to Web 1.0 websites is not enough to make them Web 2.0. You also need services, and adding RiA takes you to my "Web 2.01" . I disagree with Tim O'Reilly that Web 2.0 will be an incremental upgrade; I think it's revolutionary rather than evolutionary.

Table:

But enough preaching; let's write a Web 2.01 app. It will use services, FOAF, tagging, and have a rich user interface that is as easy to use as a website.

I wrote an early article some time back with examples for Network Launcher that you should review (https://www.theserverside.com/news/1365148/Rich-Internet-Applications , and you can also read http://www-128.ibm.com/developerworks/edu/j-dw-java-jdnc-i.html?ca=drs- ) if RiA is new for you. (Also note that NetBeans 5.0 IDE can now automatically generate a JNLP Network Launch's file for you.)

Step 1:

In order to display FOAF and favorite communities in our sample application, we need a FOAF/favorites feeds from someplace. (remember, social networking and RiA are a must for Web 2.01!).

You can get feeds by joining Roomity.com, and selecting "favorite communities" and "favorite authors" for your account. Roomity can aggregate the same clubs you are currently subscribed to, while concealing your email address from spammers. Roomity also lets you access Usenet newsgroups and your favorite blogs while sitting behind a firewall and can categorize content . In your favorite clubs, you may have favorite authors that you like to follow. You can search by content, people or places, as well as play streaming audio and video, all in a cross-platform environment. Whatever feeds and topics you select are the ones that we will display.

You should be able to see the favorites you selected via a hyperlink, for example you would use http://username.roomity.com to see your favorites. (You can also use http://clubname.roomity.com to see a specific club and http://author.roomity.com to see a specific author.)

Once you have confirmed your favorites with the http://username.roomity.com url, we are ready to move to Step 2, where we begin writing code.

Step 2:

Paste the following code in your favorite editor.

View:

public class Web2ExampleView {

 private JButton button = new JButton("Get Feed");
 private JEditorPane pane = new JEditorPane();
 private JTextField user = new JTextField(10);
 private JPasswordField passwd = new JPasswordField(10);
 
 public JPanel exec() {
  JPanel pan = new JPanel(new BorderLayout());
  pan.add(new JScrollPane(pane), BorderLayout.CENTER);
  pan.add(button, BorderLayout.SOUTH);
  pan.add(getTopPanel(), BorderLayout.NORTH);
  pane.setEditable(false);
  activate();
  return pan;
 }

 private JPanel getTopPanel() {
  JPanel pan = new JPanel(new FlowLayout());
  pan.add(new JLabel("User : "));
  pan.add(user);
  pan.add(new JLabel("Password : "));
  pan.add(passwd);
  return pan;
 }

 private void activate() {
  GetXMLAction action = new GetXMLAction();
  button.addActionListener(action);
  action.addSource("user", user);
  action.addSource("passwd", passwd);
  action.setTarget(pane);
 }
}

And Action:

public class GetXMLAction implements ActionListener {

private static final String U_R_L = "http://xml.roomity.com/?";

 private JEditorPane pane = null;

 private HashMap source = new HashMap();

 public void actionPerformed(ActionEvent e) {
  String url = constructURL();
  if(url != null) {
   pane.setPage(url);
  }
 }

private String constructURL() {
 String url = null;
 String user = ((JTextField)source.get("user")).getText();
 String passwd = ((JTextField)source.get("passwd")).getText();
  if(user != null && passwd != null) {
   url = U_R_L + "user=" + user + "&password=" + passwd;
  }
  return url;
 }

 public void setTarget(JEditorPane pane) {
  this.pane = pane;
 }

 public void addSource(String key, JTextField field) {
  source.put(key, field);
 }
}

This code (combined with Part I) will give you a simple, easy to launch Web 2.0/RiA webapp. demonstrating the rich UI meant for broadband with FOAF and "mashing".

The code only displays a XML document view of a user's recent posts, and his favorite feeds and authors in XML. It does not bind the XML (although XML binding is easy in Java 5.0).
The output of your personal Web 2.0 RiA should look a bit like this:

Output of Web 2.0 RiA

You can bind this to any UI control you'd like; a TreeTableModel, for example. The XML displays a user's tagged favorite feeds, favorite authors, as well as any posts the user placed.

If you don't know how to pull a screen, use:

public class RoomityXMLClient {
 public static void main(String[] ar) {
  JXFrame frame = new JXFrame("Roomity Sample Client");
  frame.getContentPane().add(new ClientView().exec(), BorderLayout.CENTER);
  
  frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  frame.setBounds(100, 100, 900, 700);
  frame.setVisible(true);
 }

Can you see your feeds in your application with the code provided?

If you have the code working, great! If not, you can see a video of the coded solution at http://files.roomity.com/tutorial

In the upcoming Java 5.06 patch, the Network Launcher "Scary User Screen" (displayed even for deployment of properly signed JARs) will be fixed. JDNC is a great platform for huge applications with professional developers, and JDNC's A. Folwer is working on making it more compliant with an MVC model, as a result of user feedback.

Conclusion

LimeWire, Azuareus and Roomity have a combined 30 million users using Java technology with internet services. Google is denying that it will offer Java based applications to store content in Google. It seems that Sun middle management realizes that in order for them to have a services market, they have to have desktop applications deployed to use those services.

The battle for control of services architecture is going to depend on the battle for mindshare among service consumers (applications requesting the service), And the technology (be it .NET, Flash, Java or DHTML/Ajax) that works best for Web 2.0 has yet to be decided. J2EE was one of weakest technology stacks on the server, thanks to ORM, EJB and JSF, even though it has power on the desktop because it's easy to deploy. Many veterans suspect that Ajax/DHTML is going to fade away.

This example illustrates the simple steps you need to take to rapidly create a "Web 2.01" (Web 2.0/RiA) application for yourself, and participate in social networking's evolution as a "play it forward" ecosystem.

Roomity.com at http://roomity.com that has TV-like video streams as well as music streams. Explaining Roomity is like trying to explain what a spreadsheet is to someone who does not know what a spreadsheet is ("it's like a calculator but …."). Roomity is a Web 2.01 RiA application. Roomity itself is built using NetBeans, Looking Glass, Groovy (anyplace where one would use J2EE frameworks, we used Java-based Groovy for all the back end stuff), JMF, etc.

More 2.01 links:

• Amazon: http://java.sun.com/developer/technicalArticles/WebServices/amazonws/
• EBay: http://www.xoetrope.com/zone/articles/article.php?zone=XUI&article=ebay&articleid=94
• J2EE http://www-128.ibm.com/developerworks/opensource/library/os-ag-swing/?ca=dgr-lnxw01Talk2GeronimoEJ

About the Author

Vic Cekvenich has been leading large scale development and deployments for two decades, and is a published author. Sandy (Rex), Erick (WhatHmm), Asha (AvRootShell) and Gana (JavaBuddy) helped with this article.