Upcoming Liferay 5.3 is planned to include Vaadin as first-class supported web application framework. Until then the installation of Vaadin applications on Liferay will require some special adjustments.

All instructions refer to Liferay version 5.2.3 and Vaadin 6.1.1.

You can also see a recorded demo on YouTube

Install Vaadin to Liferay Portal

Even though you can run Vaadin -based portlets in Liferay Portal without installing Vaadin, installing Vaadin to portal "level" allows one to run multiple Vaadin portlets concurrently.

In order to install Vaadin to Liferay Portal 5.2.3, follow these steps:

1. Copy VAADIN widgetset/theme directory:

VAADIN directory in Vaadin zip distribution (in WebContent directory) must be copied to LIFERAY_HOME/tomcat-6.0.18/webapps/ROOT/html/

Why? Portal is page-based environment. The client-side widgetset (the GWT part of Vaadin) must be shared among the Vaadin portlets. Otherwise you may have multiple widgetsets on same web page. Which won't work.

2. Create the shared Vaadin configuration

Create LIFERAY_HOME/tomcat-6.0.18/webapps/ROOT/WEB-INF/classes/portal-ext.properties file with the following contents:

 vaadin.resources.path=/html
 vaadin.theme=reindeer
 vaadin.widgetset=com.vaadin.portal.gwt.PortalDefaultWidgetSet

Why? This tells all the running Vaadin based portlets where the widgetset is found.

3. Copy vaadin.jar to the ROOT web application

You must copy the vaadin-6.1.x.jar to LIFERAY_HOME/tomcat-6.0.18/webapps/ROOT/WEB-INF/lib/vaadin.jar removing the version information from the filename.

Why? The same Vaadin classes should also be shared across all portlets using Vaadin. This is the simplest way of doing that. If your portlet.war also contains vaadin jar-file, make sure it is exactly the same as this.

Done

Liferay is now equipped with Vaadin libraries and is ready for new Vaadin-powered portlets. Start the server:

 LIFERAY_HOME/tomcat-6.0.18/bin/startup.sh 

Testing with the mail portlet

Liferay 5.3 will include a full-featured mail application that is made using the Vaadin library. You can test the mail portlet also in 5.2.x series.

Download Mail Portlet for Liferay 5.2.x.

Liferay 5.3 will offer many new features that this Mail Portlet depends on. But do not fear: we back-ported the and packaged them for you. Just download this package:

mail-portlet-5.3.0.1.war

Please consider this portlet to be a technology demo - not a feature suitable for use in production portals yet.

Deploy Mail-Portlet

Hot deployment is by default turned on in Liferay so the deployment is easy as:

cp mail-portlet-5.3.0.1.war LIFERAY_HOME/deploy/

Configuration

The portlet should be fully functional after deployment. To actually use it somewhere log into the server from web (as "Bruno" is good) and add new application from top-right corner menu. You'll find the portlet named as "Mail - Vaadin". Just click add.

If you want to remove extra borders around the portlet, click "..." button and select "Look and Feel". Unselect "Show borders", save and reload the page. The resulting portlet should look like this:

Browse the Mail Portlet UI

Mail Portlet consists of two parts. A summary view and a popup application window. Summary view show status of you mail account. The application itself opens by clicking the summary.

Done

You have the Vaadin based Mail Portlet up and running. Try sending some mail to yourself for example.

In order to start developing portlets like these, you download Vaadin and browse through the first chapters of the Book to get started.