Fortunately, there is a new standard for that. Having a streaming channel between the server and the client can be done using the WebSocket API.

Unfortunately, there is one major issue with realtime: scalability. Realtime means more connections, more data exchanges. Most web servers today are using threads to handle requests. Threads based networking doesn’t scale, as you will face performance and locking issues. Java web servers like Jetty, Tomcat, Glassfish etc. are using threads.

In fact, most web frameworks today will make you create web sites that are going to be deployed on thread based web servers. There is a fundamental problem here if you want to provide realtime stuff. You have to look for others technologies, and the big challenger today is NodeJS.

I wanted since many weeks to try NodeJS, especially in order to bring realtime through WebSockets to my applications. NodeJS’ goal is to provide scalables network programs. Basically it’s JavaScript plus an I/O layer. You write in Javascript, and your code is executed using V8, the Google’s open source JavaScript engine, the one used by Google Chrome. NodeJS tends to be the solution to scalability problems.

That’s fine, but does it means that you have to stop using your favorite web framework in order to do only NodeJS? Nop. You can employ NodeJS to just handle the realtime aspects of your applications, like broadcasting notifications. What you need then is just a bridge between NodeJS and your favorite web framework.

As I’m starting my own business, I do some Ruby now, and I started to play with NodeJS and Ruby on Rails. I made the bridge between the two platforms with Redis, using the publish/subscribe feature. Redis is a lightweight and very fast advanced key-value datastore. Benchmarks show performances about “110000 SETs/second, 81000 GETs/second in an entry level Linux box“. In fact, Redis has been designed for performance. Since Redis 2.0, there is now a publish/subscribe feature, especially designed to trap changes. Redis is supported by tons of languages, as NodeJS, Ruby and Java.

So let’s summarize what could be the global architecture. Your base application will publish events using Redis. NodeJS will subscribe to this Redis channel and as soon as an event is caught, NodeJS will relay it to subscribed end users through WebSocket API.

I wanted to experiment the same technique with Java instead of Ruby. I used the Tapestry 5 Hotel Booking application to achieve that. And here is how.

Overview

The goal is to provide a monitor page that will display in realtime every booking made by users.

Code provided is an experiment, please don’t use it as it in production. It should be used only for testing purpose.

The environment

Get Redis and NodeJS for your platform. They are both designed to run on POSIX platforms, which basically means *not Windows*, but they are some binaries for Windows avaible for both here and here, and they should integrate your cygwin quite well (just make them available in your PATH).

Checkout the Tapestry 5 Hotel Booking application.

Edit pom.xml to add the Jedis artifact which is a Java Redis client. There are some others distributions, but there are not all available as Maven artifacts. Some of them are respecting the JDBC standard, but JDBC was designed for relational databases, and Redis is not a relational one.

		<dependency>
			<groupId>redis.clients</groupId>
			<artifactId>jedis</artifactId>
			<version>1.3.0</version>
			<type>jar</type>
			<scope>compile</scope>
		</dependency>

Make Redis available in your application

We want to have a service in our application that will makes it possible to publish messages on channels. Let’s define the service respecting the Tapestry way of things.

RedisPublisher

package com.tap5.hotelbooking.services;

public interface RedisPublisher
{
    void publish(String channel, String message);
}

RedisPublisherImpl

package com.tap5.hotelbooking.services;

import org.apache.tapestry5.ioc.ScopeConstants;
import org.apache.tapestry5.ioc.annotations.Scope;

import redis.clients.jedis.Jedis;

@Scope(value = ScopeConstants.PERTHREAD)
public class RedisPublisherImpl implements RedisPublisher
{
    private Jedis jedis;

    public RedisPublisherImpl()
    {
        this.jedis = new Jedis("localhost");
    }

    public void publish(String channel, String message)
    {
        jedis.publish(channel, message);
    }

}

Note that @Scope(value = ScopeConstants.PERTHREAD) is used here. It means that we are going to make one connection to Redis per request. That’s a good balance between a persistent connection and a connection for every Redis action.

Let’s add the service declaration in the application module.

HotelBookingModule.java

    public static void bind(ServiceBinder binder)
    {
        binder.bind(Authenticator.class, BasicAuthenticator.class);
        binder.bind(RedisPublisher.class, RedisPublisherImpl.class);
    }

Each time a booking is made, we want it to be published to Redis. Let’s edit the Book page.

Book.java

...
@OnEvent(value = EventConstants.SUCCESS, component = "confirmForm")
    public Object confirm()
    {
        // Create
        dao.create(booking);

        userWorkspace.confirmCurrentBooking(booking);

        publisher.publish("booking:" + booking.getId() + ":hotel", booking.getHotel().getName());

        booking = null;

        // Return to search
        return Search.class;
    }
...

I suggest you to learn Redis if you want to understand the channel declaration "booking:" + booking.getId() + ":hotel"

The Monitor page

This page is fairly simple. You just need to include some scripts. I used jquery, a simple websocket client and a custom script to display messages.

Monitor.java

package com.tap5.hotelbooking.pages;

import org.apache.tapestry5.annotations.Import;

@Import(library =
{ "context:/js/jquery.1.4.3.min.js", "context:/js/ws.js",
        "context:/js/scripts.js" })
public class Monitor
{

}

Monitor.tml

<html t:type="layout" t:pageTitle="Hotel details"
      xmlns:t="http://tapestry.apache.org/schema/tapestry_5_1_0.xsd"
      xmlns:p="tapestry:parameter">
        <!-- Most of the page content, including <head>, <body>, etc. tags, comes from Layout.tml -->

	<h2>Monitor booking... in realtime!</h2>

	<div id="log"></div>

	<p:sidebar>
        <p>
        	Tapestry has an existing set of components that will help you to quickly
        	handle common stuff. Displaying Javabean properties, generate form from Javabean,
        	display tabular datas... All of these to get a clean and efficient template's code.
        </p>
	</p:sidebar>

</html>

src/main/webapp/js/ws.js

var conn;
var connect;

(function($) {

connect = function() {
  if (window["WebSocket"]) {
    conn = new WebSocket("ws://localhost:8000/test");
    conn.onmessage = function(evt) {
      $(window).trigger('WSmessage',evt.data);
    };
  }
};

})(jQuery);

src/main/webapp/js/script.js

var $j = jQuery.noConflict();

(function($) {

	jQuery.fn.log = function(msg) {
		if (window.console != undefined)
			console.log("%s: %o", msg, this);
		return this;
	};

	$(window).load(function() {
		$(window).bind("WSmessage", function(e, data) {
			$("#log").append(data + "<br />");
		});

		if (!conn) {
			connect();
		}
	});

})(jQuery);

Don’t forget to get JQuery 1.4.3 from the official website, and put it in src/main/webapp/js.

Server side JavaScript

Finally, here comes the time to play with NodeJS!

I’ve put everything under src/nodejs

First, let’s download some libraries. A Websocket server implementation, and a Redis client.
Move redis-client.js, ws.js and ws/ to src/nodejs/lib

Let’s now create the NodeJS server itself in src/nodejs. Code is based on one of the examples distributed with the WebSocket server implementation repository.

realtime-server.js

var sys = require("sys"),
 	fs = require("fs"),
 	path = require("path"),
 	http = require("http"),
 	ws = require('./lib/ws'),
	redis = require("./lib/redis-client");;

var pubsub = redis.createClient();

var connect;

pubsub.stream.addListener('connect', function() {
	pubsub.subscribeTo('booking:*:hotel', function(channel, data) {
		var bid = channel.toString().split(':')[1];
		sys.debug("Publishing new booking : " + bid);

		if (connect) {
			connect.write(data);
		}

	});
});

/*-----------------------------------------------
  logging:
-----------------------------------------------*/
var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];

function pad(n) {
  return n < 10 ? '0' + n.toString(10) : n.toString(10);
}

function timestamp() {
  var d = new Date();
  return [
    d.getDate(),
    months[d.getMonth()],
    [ pad(d.getHours())
    , pad(d.getMinutes())
    , pad(d.getSeconds())
    , (d.getTime() + "").substr( - 4, 4)
    ].join(':')
  ].join(' ');
};

function log(msg) {
  sys.puts(timestamp() + ' - ' + msg.toString());
};

function serveFile(req, res){};

/*-----------------------------------------------
  Spin up our server:
-----------------------------------------------*/
var httpServer = http.createServer(serveFile);

var server = ws.createServer({
  debug: true
}, httpServer);

server.addListener("listening", function(){
  log("Listening for connections.");
});

// Handle WebSocket Requests
server.addListener("connection", function(conn){
  log("opened connection: "+conn.id);

  connect = conn;

  conn.broadcast("<"+conn.id+"> connected");

  conn.addListener("message", function(message){
    log("<"+conn.id+"> "+message);
    conn.broadcast(message);
  });
});

server.addListener("close", function(conn){
  log("closed connection: "+conn.id);
  conn.broadcast("<"+conn.id+"> disconnected");
});

server.listen(8000);

Run everything and test!

Run redis-server

Run the Java application with mvn jetty:run

Run the NodeJS server with node realtime-server.js in src/nodejs

Open two browser windows (with a browser that support WebSocket of course, like Google Chrome). First window should go to http://localhost:8080/tapestry5-hotel-booking/monitor. Second window should search for an hotel and make a booking.

As the booking is confirmed, you should see it appearing in the first window.

Get all the sources on Github

If you just want to grab the code and run it, I’ve put everything on Github.

Final thoughts

I believe there is something to do here. What about a new Tapestry 5 contribution, including a service that facilitate publishing to Redis, and a component or a mixin with a JS file providing easy subscription to websockets? What do you think?

• Project configuration
• Layout and page design
• CSS usage
• Model design
• Tapestry Hibernate contribution usage
• Tapestry JSR-303 contribution usage
• Working with form
• Working with Ajax components
• Working with Tabular datas
• Optimize your database access when displaying Grid
• Custom security design
• Custom conversation design
• Custom javascript component
• … and many more topics to provide a complete overview

Many thanks to Katia A.G. for her great involvement in the project and thanks the community for its feedback. Next to come, other implementations based on third-party contributions and more advanced Tapestry stuff.

I encourage every Tapestry user to checkout the source code, comment, contribute, participate… at github. Note that the application is available online on our official Tapestry website.

I am pleased to announce the last release of Wooki : 0.4 ! After almost one year of development, all the features we have initially imagined have been implemented, you can use Wooki to

• Collaborate with friends on a single book resource
• Turn Wiki technology into a more interactive tool with direct feedback
• Follow user’s activities via RSS
• Get a printable version of your books via PDF generation
• Edit your content in a clean XHTML code without knowing anything about XHTML
• Get access to your action history and revert to a previous revision

So what’s next ?

It’s time to use it and stabilize it ! As a first experiment, I want to give to Wooki a concrete project to feed, thus i am eager to create a full demonstration application for Tapestry 5. This application will be based on the Seam Hotel Booking application. Objective of the experiment is to

1. Implement the application via Github
2. Compile the Tapestry 5 user’s experience via Wooki

Who wants to join ?

This is an opportunity for us to validate the user experience on Wooki, but we need people to work with. So, if you want to join this exciting experiment, please send me your github and wooki’s ids so i can give you committer and author’s rights. Tapestry 5 Newbies as Advanced are very welcome ! We need at last 4 people.

Thanks for reading.

Tapestry PageTester can be extended like the TapestryFilter to provide your own ServiceModuleDef classes.  The tapestry-spring contribution already provides the one needed to load a Spring application context. Then, loading Spring for your unit tests will be as simple as extended the existing PageTester and provide the Tapestry Spring Module Definition class.

Also, because this module definition uses the servlet application context to get the configuration files location, we will have to mock it. Let’s use Spring MockServletContext for this.

• Update your maven dependencies to add spring web mock objects

  <dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-test</artifactId>
    <version>${spring-version}</version>
  </dependency>

• Extend Tapestry PageTester, adapt the code below to your needs if you want to provide mock versions of your spring beans or make it more configurable

public class WookiPageTester extends PageTester
{

 private MockServletContext servletContext;

 public WookiPageTester(String appPackage, String appName, String contextPath,
 Class... moduleClasses)
 {
   super(appPackage, appName, contextPath, moduleClasses);
   Registry registry = this.getRegistry();
   // Set Tapestry registry in mock servlet context
   servletContext.setAttribute(TapestryFilter.REGISTRY_CONTEXT_NAME, registry);
 }

 public WookiPageTester(String appPackage, String appName)
 {
   super(appPackage, appName);
 }

 @Override
 protected ModuleDef[] provideExtraModuleDefs()
 {
   // Set spring configuration files location
   servletContext = new MockServletContext();
   servletContext.addInitParameter("contextConfigLocation", "classpath*:mock-applicationContext.xml");
   return new ModuleDef[] { new SpringModuleDef(servletContext) };
 }

}

Thanks for reading !

Along with Wooki improvements, we have created three major spin-off contributions that put the basis for a strong architecture that will make Wooki evolutive and ready for production soon:

• tapestry5-spring-tx allows you to benefit from Spring Platform Transaction management inside Tapestry
• tapestry5-installer provides a way to easily deploy and install tapestry 5 application
• tapestry5-db-migration, inspired from rails migrations, allows you to get full control over your database schema through your Tapestry 5 application lifecycle

All this work justifies this wooki version. It has been the opportunity to validate and polishing these different contributions in a real context.

Also the global code of Wooki has been reviewed to ease future evolutions and current features maintenance

• Move to Tapestry 5.2 that make development with Tapestry more and more confortable
• Integration of spring-acl to handle authorization on wooki’s resources
• Creation of an abstraction layer to handle DB query parameters like range, created since
• Centralize activity lookup for RSS feeds and front display
• Centralize application link management and improve the application security layer

To conclude, one important news is that wooki has moved to spreadthesource organization on github

We hope you will find inspiration from all these as a user or a Tapestry developer ! Give it a try !

Thanks for reading.

Vox Wooki 2 will especially focus on TapesTwitter: an open source clone of Twitter powered by Tapestry.

TapesTwitter

Some weeks ago, Laurent Guerin and Katia Aresti have silently published an application named TapesTwitter on Github.

We decided to download it and see what this application can do. TapesTwitter is a modest clone of Twitter powered by Tapestry. The stated goal is to provide a demonstration application to show what Tapestry is capable of. And that’s precisely what we liked about this application. A newcomer will find all necessary elements to get started with Tapestry : components and mixins, overrides of specific Tapestry behaviors like AJAX validators, integration of spring-security, i18n etc.

Custom Ajax validators

Internationalisation

One of their exclusives components: letters count system

Congratulations Laurent and Katia for your job, I’m convinced that it will be useful for a lot of people. I strongly encourage tapestry users to take a look at it.

Contributions

Geoff Callender continues to update Tapestry Jumpstart. Not less than two releases of Jumpstart have been made since last Vox Wooki. Theses releases focus on validators and there is an interesting AJAX validator implementation. I always recommend people to bookmark Jumpstart when I give Tapestry trainings: this application is the best cookbook for Tapestry I know.

Kalle Korhonen from Tynamo also announced the availability of tapestry-security 0.2.0. This contribution is an integration of Apache Shiro security framework (previously known as JSecurity), which is, as far as I know, a pretty good tool!

Other news from the community

Igor Drobiazko announced that his german written book on Tapestry 5 will be translated in English. This is really great and I hope that the english edition will be revisited to cover the new Tapestry 5.2 API.

Finally, Tapestry official logo and website have both been redesigned.  I’m largely implicated on this but it’s also interesting to notice that these proposals have been discussed on tapestry developer mailing list. The community had the opportunity to be implicated by providing feedback, and I think it’s a good way of doing things.

As far as I know, his first goal is to contribute to the documentation effort started by Ulrich Stärck. By the way, Ulrich has been promoted as an Apache Tapestry 5 PMC member.

As a side news, wooki 0.3 is almost finished. This will be a huge release in terms of refactoring and new features. We made some terrific things.  Stay tuned, the announce will come in next few days.

We are pleased to suggest to the Tapestry 5 community a fun animation that should be used to start or conclude a Tapestry 5 presentation

Here are the first two drafts of the current work, comments and suggestions are welcome !

Contributions

Tynamo guys are very actives, they provided new releases for two of their contributions :

• tapestry-resteasy 0.2.0 offers a convenient way to use JBoss Resteasy inside a Tapestry application
• tapestry-model 0.0.2 for CRUD application development

… and a brand new module to send alerts via email ‘if something happens to your parent process’

• tapestry-watchdog-0.0.1

Two testing frameworks announced in new version :

• Spock Team has released a version 0.4 of Spock Java/Groovy testing framework with support for Tapestry Injection annotations
• Tapestry Testify is now available in version 1.0.2 and the related Tapestry XPath project is now available in v1.0.1

The complete and so useful Tapestry JumpStart is now available in version 4.9

From our side, GOT5 a.k.a. “Gang Of Tapestry 5″ , a new group of Tapestry developers where we (Christophe and Robin) belong too. In fact this group is the hat we are going to wear when we will publish Open Source content from work made for our employer. Anyway we released under GOT5 hat something really awesome:

• tapestry5-jquery allows to get completely rid of prototype API and use jQuery instead, this project has started to be used by the community and we already have some feedback on it to improve and complete it

Also, as you may have noticed, wooki has been completely refactored during the last two months. One main objective of this was to extract most of the reusable pieces of wooki into third-party contributions under spreadthesource account. Here is the list of libraries that has been extracted from wooki’s experience.

This two contributions are used for a while now on wooki and have been confirmed to be really useful with the experience.

• tapestry5-rome
• tapestry5-googleanalytics

One of the most important but still in progress is a tool that will allow to easily maintain your application database schema accross version of your application. It will provide a full API built on top of Hibernate tools to create/update your database schema, insert/delete datas…

• tapestry5-db-migration

Finally we have a two-phase tapestry launcher and a contribution that allows tapestry-hibernate to work with Spring Hibernate Transaction Manager.

• tapestry5-installer
• tapestry5-spring-tx

We expect to provide stable releases for all of these with the next wooki’s version.

Thanks for reading.

We’ll see in this article a concrete use case of this type of strategy and see how easy it is to implement with Tapestry.

Use Case

We have a component that displays the activity logs on our Web site. This component is in charge of getting the list of activities to display. These latter will depend on the user context, that means not every user will see the same activities type and list.

ActivitySource

To avoid having boilerplate code in the component that will identify which finder method to call depending on the context. We define a simple interface that will be called by the component to obtain the list of strategy to display.

public interface ActivitySource {
 List<Activity> listActivities(Long... context);
}

Note the ‘context’ parameters that consists in a list of ids that can be used by the implementation class to build its db query. Now we have the interface let’s create two implementations i.e. PublicActivitySource and AdminActivitySource that will list the activities in function of the logged user is a guest or a user with admin rights.

ActivitySourceType

This is the key concept of this article, now we have defined the interface and created two implementations classes, we will list all of these in a single Enum type called ActivitySourceType. Let’s see how it looks like :

public enum ActivitySourceType {

 ADMIN_AS(AdminActivitySource.class),

 PUBLIC_AS(PublicActivitySource.class);

 private Class<? extends ActivitySource> sourceClass;

 private ActivitySourceType(Class<? extends ActivitySource> source) {
     this.sourceClass = source;
 }

 @SuppressWarnings("unchecked")
 public Class<ActivitySource> getSourceClass() {
     return (Class<ActivitySource>) sourceClass;
 }

}

We create on Enum type per activity source. Doing this we have a centralized lists of available sources, now let’s see how to bind all these implementation classes so we can use them in our application.

Register your services

Tapestry provides a convenient way to automatically bind service implementation via the ServiceBinder class. Each implementation must have a different id so we can distinguish them at runtime. Here is the code used to iterate through the list of existing implementations. This will be localized in your AppModule class.

public static void bind(ServiceBinder binder) {
    for(ActivitySourceType type : ActivitySourceType.values()){
        binder.bind(ActivitySource.class, type.getSourceClass()).withId(type.toString());
    }
}

Now this is done, all the existing services has been registered and you can easily and dynamically retrieve a ActivitySource service reference in your Tapestry pages.

Obtain the  service instance

Use the Tapestry registry to dynamically access to the corresponding service in function of the context. i.e. You can see below how to get it work in a component using a dynamic parameter value of ActivitySourceType type.

 @Parameter
 private ActivitySourceType type;

 @Inject
 private Context context;

 private ActivitySource source;

 ActivitySourceType defaultType() {
     return ActivitySourceType.PUBLIC_AS;
 }

 @SetupRender
 public void defineSource() {
     Registry reg = (Registry) context.getAttribute(TapestryFilter.REGISTRY_CONTEXT_NAME);
     this.source = reg.getService(type.toString(), ActivitySource.class);

     List<Activity> activities = source.listActivities();
     for (Activity a : activities) {
       System.out.println(a.getLog());
     }
 }

As you can see this is as simple as retrieving the service instance from the registry giving its interface and its id, and then call its ‘listActivities’ method. Doing this, we can say that we have implemented a type-safe Strategy pattern that will avoid to use ugly switch/case statements.