Vaadin JPAContainer

21.8.3. Master-Detail Editor

The MasterDetailEditor is a field component that allows editing an item property that has one- to-many relationship.The item can be a row in a table or bound to a form. It displays the referenced collection as an editable Table and allows adding and removing items in it.

You can use the MasterDetailEditor manually, or perhaps more commonly use a JPAContainer FieldFactory to create it automatically. As shown in the example in Figure 21.6, “Using FieldFactory with One-to-Many Relationship”, the factory creates a MasterDetailEditor for all properties with a @OneToMany or an @ElementCollection annotation.

21.9. Using JPAContainer with Hibernate

Hibernate needs special handling in some cases.

21.9.1. Lazy loading

In order for lazy loading to work automatically, an entity must be attached to an entity manager. Unfortunately, Hibernate can not keep entity managers for long without problems.To work around the problem, you need to use a special lazy loading delegate for Hibernate.

JPAContainer entity providers handle lazy loading in delegates defined by the LazyLoadingDelegate interface. The default implementation for Hibernate is defined in HibernateLazyLoadingDelegate. You can instantiate one and use it in an entity provider with setLazyLoadingDelegate().

The default implementation works so that whenever a lazy property is accessed through the Vaadin Property interface, the value is retrieved with a separate (JPA Criteria API) query using the currently active entity manager. The value is then manually attached to the entity instance, which is detached from the entity manager. If this default implementation is not good enough, you may need to make your own implementation.

21.9.2. The EntityManager-Per-Request pattern

One issue with Hibernate is that it is designed for short-lived sessions. The lifetime of an entity manager is roughly that of a session. However, if an error occurs in a session or entity manager, the manager becomes unuseable. This causes big problems with long-lived sessions that would work fine with EclipseLink.

The recommended solution is to the EntityManager-per-Request pattern. It is highly recommended always when using Hibernate.

An entity manager can only be open during the request-response cycle of the Vaadin application servlet, so that one is created at the beginning of the request and closed at the end.

You can use the EntityManagerPerRequestHelper as follows:

1.Create a new instance in the constructor or init() method of your Vaadin application class.

2.Override onRequestStart() in the application class and call requestStart() in the helper instance.

Master-Detail Editor

473

Vaadin JPAContainer

3.Override onRequestEnd() in the application class and call requestEnd() in the helper.

4.Whenever a new JPAContainer instance is created in the application, register it in the helper by calling addContainer() with the container.

5.If you use the JPAContainer FieldFactory, as described in Section 21.8, “Automatic Form Generation”, you need to set the helper for the factory either by passing it in the constructor (new FieldFactory(myEMPRH)) or with setEntityManagerPerRequestHelper().The FieldFactory creates JPAContainers internally and these instances need to be updated with the entity manager instances when they change between requests.

21.9.3.Joins in Hibernate vs EclipseLink

EclipseLink supports implicit joins, while Hibernate requires explicit joins. In SQL terms, an explicit join is a "FROM a INNER JOIN b ON a.bid = b.id" expression, while an implicit join is done in a WHERE clause, such as: "FROM a,b WHERE a.bid = b.id".

In a JPAContainer filter with EclipseLink, an implicit join would have form:

new Equal("skills.skill", s)

In Hibernate you would need to use JoinFilter for the explicit join:

new JoinFilter("skills", new Equal("skill", s))

474	Joins in Hibernate vs EclipseLink

Chapter 22

Mobile Applications with TouchKit

22.1. Overview ..............................................................................................	475
22.2. Considerations Regarding Mobile Browsing ........................................	478
22.3. Installing Vaadin TouchKit ....................................................................	479
22.4. Elements of a TouchKit Application .....................................................	481
22.5. Mobile User Interface Components .....................................................	484
22.6. Advanced Mobile Features ..................................................................	492
22.7. Offline Mode ........................................................................................	494
22.8. Building an Optimized Widget Set .......................................................	497
22.9. Testing and Debugging on Mobile Devices ..........................................	498

This chapter describes how to write mobile applications using the Vaadin TouchKit.

22.1. Overview

Web browsing is becoming ever increasingly mobile and web applications need to satisfy users with both desktop computers and mobile devices, such as phones and tablets. While the mobile browsers can show the pages just like in regular browsers, the screen size, finger accuracy, and

Book of Vaadin

475

Mobile Applications with TouchKit

mobile browser features need to be considered to make the experience more pleasant. Vaadin TouchKit gives the power of Vaadin for creating mobile user interfaces that complement the regular web user interfaces of your applications. Just like the purpose of the Vaadin Framework is to make desktop-like web applications, the purpose of TouchKit is to allow creation of web applications that give the look and feel of native mobile applications.

Figure 22.1. The Vornitologist Demo for Vaadin TouchKit

Creating a mobile UI is much like a regular Vaadin UI. You can use all the regular Vaadin components and add-ons available from Vaadin Directory, but most importantly the special TouchKit components.

@Theme("mobiletheme")

public class SimplePhoneUI extends UI { @Override

protected void init(VaadinRequest request) {

//Set the window or tab title getPage().setTitle("Hello Phone!");

//Use the TouchKit TabBarView for content TabBarView mainView = new TabBarView(); setContent(mainView);

//Create a view - usually a regular class class MyView extends VerticalLayout {

Table table = new Table("Planets", planetData());

public MyView() {

addComponent(new Label("This is a view")); table.setWidth("100%"); table.setPageLength(table.size()); addComponent(table);

addComponent(new Button("Go")); setSpacing(true);

}

}

mainView.addTab(new MyView(), "Planets");

// Add some more sub-views mainView.addTab(new Label("Dummy"), "Map");

mainView.addTab(new Label("Dummy"), "Settings");

}

...

}

The resulting UI is shown in Figure 22.2, “Simple TouchKit UI”.

476

Overview

Mobile Applications with TouchKit

Figure 22.2. Simple TouchKit UI

TouchKit supports many special mobile browser features, such as geolocation, home screen launching, splash screen, and web app mode, especially in iOS.

In addition to developing regular server-side UIs, TouchKit allows a special offline mode, which is a client-side Vaadin UI that is stored in the browser cache and switched to automatically when the network connection is not available, either when starting the application or while using it. For more information, see Section 22.7, “Offline Mode”.

In this chapter, we first consider some special aspects of mobile browsing. Then, we look how to create a project that uses TouchKit.TouchKit offers a number of specialized mobile components,

Overview

477