Файл: book-of-vaadin.pdf

Vaadin Timeline

Timeline.PropertyId.TIMESTAMP,

Timeline.PropertyId.VALUE);

timeline.setMarkerDataSource(markerDS,

Timeline.PropertyId.TIMESTAMP,

Timeline.PropertyId.CAPTION,

Timeline.PropertyId.VALUE);

timeline.setEventDataSource(eventDS,

Timeline.PropertyId.TIMESTAMP,

Timeline.PropertyId.CAPTION);

mainWindow.addComponent(timeline);

}

Now you should be able to start the application and browse the timeline. The result is shown in Figure 20.11, “Timeline Example Application”.

Figure 20.11. Timeline Example Application

20.3.4. Final Touches

Now that we have our timeline we would probably like to customize it a bit. There are many things you can do but lets start by giving our graph some style properties and a caption in the legend. This can be done as follows:

//Set the caption of the graph timeline.setGraphLegend(graphDataSource, "Our cool graph");

//Set the color of the graph timeline.setGraphOutlineColor(graphDataSource, Color.RED);

//Set the fill color of the graph timeline.setGraphFillColor(graphDataSource, new Color(255,0,0,128));

//Set the width of the graph timeline.setGraphOutlineThickness(2.0);

Lets do the same to the browser areas graph:

//Set the color of the browser graph timeline.setBrowserOutlineColor(graphDataSource, Color.BLACK);

//Set the fill color of the graph timeline.setBrowserFillColor(graphDataSource,

new Color(0,0,0,128));

And the result looks like this:

Vaadin Timeline

Figure 20.12. Styling Timeline

Okay, now that looks different. But there is still something missing. If you look in the upper left corner you will not see any zoom levels. No zoom levels are predefined so we will have to make our own. Since we are dealing with a month of data lets make a zoom level for a day, a week and a month. Zoom levels are given in milliseconds so we will have to calculate how many milliseconds each of the zoom levels are. So lets add them by adding the following lines:

// Add some zoom levels timeline.addZoomLevel("Day", 86400000L); timeline.addZoomLevel("Week", 7 * 86400000L); timeline.addZoomLevel("Month", 2629743830L);

Remember the events we added? You can now see them in the graph but their functionality is still a bit incomplete. We can add an event listener to the graph which will send an event each time the user clicks on one of the event buttons. To demonstrate this feature lets add an event listener which notifies the user what date the Sunday-button represents. Here is the code for that:

// Listen to click events from events timeline.addListener(new Timeline.EventClickListener() {

@Override

public void eventClick(EventButtonClickEvent event) { Item item = eventDataSource.getItem(event.getItemIds()

.iterator().next()); Date sunday = (Date) item.getItemProperty(

Timeline.PropertyId.TIMESTAMP).getValue(); SimpleDateFormat formatter =

new SimpleDateFormat("EEE, MMM d, ''yy");

MyTimelineDemo.this.getMainWindow()

.showNotification(formatter.format(sunday));

}

});

Now try clicking on the events and see what happens!

And here is the final demo application, yours will probably look a bit different since we are using random data.

Vaadin Timeline

Figure 20.13. Final Example

Now we hope you have a basic understanding of how the Vaadin Timeline works and how it can be customized. There are still a few features we left out of this tutorial like hiding unnecessary components from the timeline and adding multiple graphs to the timeline, but these are pretty self explanatory features and you probably can look them up in the JavaDoc.

We hope you enjoy the Vaadin Timeline and find it useful in your projects!

Chapter 21

Vaadin

JPAContainer

This chapter describes the use of the Vaadin JPAContainer add-on.

21.1. Overview

Vaadin JPAContainer add-on makes it possible to bind user interface components to a database easily using the Java Persistence API (JPA). It is an implementation of the Container interface described in Section 9.5, “Collecting Items in Containers”. It supports a typical three-layer application architecture with an intermediate domain model between the user interface and the data access layer.

Vaadin JPAContainer

Figure 21.1. Three-Layer Architecture Using JPAContainer And JPA

The role of Java Persistence API is to handle persisting the domain model in the database. The database is typically a relational database. Vaadin JPAContainer binds the user interface components to the domain model and handles database access with JPA transparently.

JPA is really just an API definition and has many alternative implementations. Vaadin JPAContainer supports especially EclipseLink, which is the reference implementation of JPA, and Hibernate. Any other compliant implementation should work just as well. The architecture of an application using JPAContainer is shown in Figure 21.2, “JPAContainer Architecture”.

Figure 21.2. JPAContainer Architecture

Vaadin JPAContainer also plays together with the Vaadin support for Java Bean Validation (JSR 303).

Java Persistence API

Java Persistence API (JPA) is an API for object-relational mapping (ORM) of Java objects to a relational database. In JPA and entity-relationship modeling in general, a Java class is considered an entity. Class (or entity) instances correspond with a row in a database table and member variables of a class with columns. Entities can also have relationships with other entities.

The object-relational mapping is illustrated in Figure 21.3, “Object-Relational Mapping” with two entities with a one-to-many relationship.

Vaadin JPAContainer

Figure 21.3. Object-Relational Mapping

The entity relationships are declared with metadata. With Vaadin JPAContainer, you provide the metadata with annotations in the entity classes. The JPA implementation uses reflection to read the annotations and defines a database model automatically from the class definitions. Definition of the domain model and the annotations are described in Section 21.3.1, “Persistence Metadata”.

The main interface in JPA is the EntityManager, which allows making different kinds of queries either with the Java Persistence Query Language (JPQL), native SQL, or the Criteria API in JPA 2.0.You can always use the interface directly as well, using Vaadin JPAContainer only for binding the data to the user interface.

Vaadin JPAContainer supports JPA 2.0 (JSR 317). It is available under the Apache License 2.0.

JPAContainer Concepts

The JPAContainer is an implementation of the Vaadin Container interface that you can bind to user interface components such as Table, Select, etc.

The data access to the persistent entities is handled with a entity provider, as defined in the EntityProvider interface. JPAContainer provides a number of different entity providers for different use cases and optimizations.The built-in providers are described in Section 21.5, “Entity Providers”.

Documentation and Support

In addition to this chapter in the book, the installation package includes the following documentation about JPAContainer:

•API Documentation

•JPAContainer Tutorial

•JPAContainer AddressBook Demo

•JPAContainer Demo

21.2.Installing

Vaadin JPAContainer can be installed either as an installation package, downloaded from the Vaadin Directory, or as a Maven dependency. You can also create a new JPAContainer-enabled Vaadin project using a Maven archetype.

Vaadin JPAContainer

21.2.1. Downloading the Package

Vaadin JPAContainer is available for download from the Vaadin Directory [http://vaadin.com/directory]. Please see Section 17.2, “Downloading Add-ons from Vaadin Directory” for basic instructions for downloading from Directory. The download page also gives the dependency declaration needed for retrieving the library with Maven.

JPAContainer is a purely server-side component, so it does not include a widget set that you would need to compile.

21.2.2. Installation Package Content

Once extracted to a local folder, the contents of the installation directory are as follows:

README

A readme file describing the package contents.

licensing.txt

General information about licensing of JPAContainer.

license-xxxx-y.y.txt

The full license text for the library.

vaadin-jpacontainer-xxxx-y.y-z.z.z.jar

The actual Vaadin JPAContainer library.The xxxx is the license name and y.y its version number. The final z.z.z is the version number of the Vaadin JPAContainer.

vaadin-jpacontainer-xxxx-y.y-z.z.z-javadoc.jar

JavaDoc documentation JAR for the library. You can use it for example in Eclipse by associating the JavaDoc JAR with the JPAContainer JAR in the build path settings of your project.

apidocs

A folder containing the JavaDoc API documentation in plain HTML.

jpacontainer-tutorial.pdf

The tutorial in PDF format.

jpacontainer-tutorial

The tutorial in HTML format. The online version of the tutorial is always available at v a a d i n . c o m / d o w n l o a d / j p a c o n t a i n e r - t u t o r i a l / [http://vaadin.com/download/jpacontainer-tutorial/].

jpacontainer-addressbook-demo

The JPAContainer AddressBook Demo project covered in this tutorial.You can compile and package the application as a WAR with "mvn package" or launch it in the Jetty web browser with "mvn jetty:run".You can also import the demo project in Eclipse as described in the tutorial.

jpacontainer-demo-z.z.z.war

The basic JPAContainer demo. It is somewhat more extensive than the AddressBook Demo.