Vaadin 7Enterprise integration

Peter Lehto Vaadin Expert

MVP

pattern

Structuring

Vaadin

Application

Views with

Vaadin

Navigator

UIProvider

CDIViewProviderVaadin-CDI

@Inject, @EJB

How to

get started?

QA

Context and

Scope

Authentication

and

Authorization

MVP pattern

Do you like spaghetti?

MVP pattern

What is MVP?

MVP pattern

Originally Model-View-Controller

Originates from late 70’s

SmallTalk-80

Controller is mediator between end user and application

Model notifies about changes with Observer pattern

MVP pattern

Taligent Model-View-Presenter

Influenced by SmallTalk-80

Model, View, Presenter, Interactors, Commands, Selections

Presenter orchestrates the structure, not the input

MVP pattern

Dolphin Smalltalk Model-View-Presenter

Simplified Taligent MVP

Views handle input events initially

Model may fire events

Presenter handles the logic, not the user input control

MVP pattern

Model-View-Presenter

Presenter

View Model

Direct Association

Indirect Association

MVP pattern

“That’s not how you use MVP!”

MVP pattern

Model-View-Presenter

Presenter

Model

View Impl

View

MVP pattern

What is the role of the Presenter?

MVP pattern

Structuring

Vaadin

Application

Example

EditorView

- Button saveButton;!- Button cancelButton;!- FieldGroup personFieldGroup;

- saveButtonClicked()!- cancelButtonClicked()

ClickListener

+ buttonClicked()

Structuring

Vaadin

Application

EditorView

- Button saveButton;!- Button cancelButton;!- FieldGroup personFieldGroup;

ClickListener

Presenter

+ saveButtonClicked()!+ cancelButtonClicked()!

+ buttonClicked()

+ commitChanges()!+ discardChanges()

ExampleStructuring

Vaadin

Application

EditorView+ commitChanges()!+ discardChanges()

Example

EditorView

- Button saveButton;!- Button cancelButton;!- FieldGroup personFieldGroup;

ClickListener

Presenter

+ saveButtonClicked()!+ cancelButtonClicked()!

+ buttonClicked()

+ commitChanges()!+ discardChanges()

Structuring

Vaadin

Application

Benefits of MVP

Allows you to create unit and integration tests for your UI logic

Abstracts your code to be more reusable

Your UI logic is separated from the UI implementation

Structuring

Vaadin

Application

Views with

Vaadin

Navigator

Navigator

Support for bookmarkable views and browser navigation

Automatic URI fragment handling

Built-in switching between views

Views with

Vaadin

Navigator

public class DashboardView extends CustomComponent implements

com.vaadin.navigator.View

Views with

Vaadin

Navigator

public class MyNavigatorUI extends UI{!! @Override!! Protected void init(VaadinRequest request){!! ! Navigator navigator = new Navigator(this, this); !! ! navigator.addView(“dashboard”, new DashboardView());!! } !}!

Views with

Vaadin

Navigator

Activating a view programmatically

UI.getCurrent().getNavigator().navigateTo("customers");

Views with

Vaadin

Navigator

http://localhost:8080/vaadin/#!customers !

#! : Navigator identifier customers : View name

Navigating to a view via URLViews with

Vaadin

Navigator

...but where is the view rendered?

Views with

Vaadin

Navigator

Views with

Vaadin

Navigator

public Navigator(UI ui, ComponentContainer container)public Navigator(UI ui, SingleComponentContainer container)

public Navigator(UI ui, ViewDisplay viewDisplay)

Views with

Vaadin

Navigator

Vaadin-CDI

Context and Dependency Injection

(JSR-299)

Vaadin-CDI

Injection

!

Context and Scope

!

Events

!

Decoupling

CDIVaadin-CDI

Features

Vaadin UI based context scope

!

Vaadin Navigator Integration

!

Easy JAAS Integration

!

Role Based View Management

Vaadin-CDI

@CDIUI public class MyVaadinUI extends UI

Vaadin-CDI

http://localhost:8080/vaadin/

@CDIUI(“myui”) public class MyVaadinUI extends UI

Vaadin-CDI

http://localhost:8080/vaadin/myui

@CDIUI public class MyVaadinUI extends UI { @Inject private MyBean bean; … }

Vaadin-CDI

@CDIUI public class MyVaadinUI extends UI { !

@EJB private MyServiceEJB service; … }

Vaadin-CDI

@CDIUI public class MyVaadinUI extends UI { !

@Inject private javax.enterprise.event.Event<MyEvent> myEvent; … myEvent.fire(new MyEvent()); }

Vaadin-CDI

@CDIUI public class MyVaadinUI extends UI { … !

protected void onMyEvent(@Observes MyEvent myEvent) { } }

Vaadin-CDI

@CDIView(“customers”) public class CustomerView extends CustomComponent implements View

Vaadin-CDI

http://localhost:8080/vaadin/#!customers

UIProvider

CDIViewProvider

@CDIUI public class MyVaadinUI extends UI { !

@Inject private CDIViewProvider viewProvider; … navigator.addProvider(viewProvider); }

UIProvider

CDIViewProvider

UIProvider

CDIViewProvider

public class CDIViewProvider implements ViewProvider {! @Inject private BeanManager beanManager;! @Inject private AccessControl accessControl;! …! public String getViewName(String) { … } public View getView(String) { … }}

UIProvider

CDIViewProvider

public class CDIUIProvider extends DefaultUIProvider {! public UI createInstance(UICreateEvent event) { … } public Class<? extends UI> getUIClass (UIClassSelectionEvent event) { … }}

UIProvider

CDIViewProvider ContextDeployer

@WebListener

!

Is capable of bootstrapping Vaadin Servlet with CDIUIProvider

!

Will validate deployment

Context and

Scope

Context and

Scope VaadinServlet

HttpSession VaadinSession

UI

1

n

1 1

1

n

1

*

EJB

1*

View/Presenter

1

*

Context and

Scope UIScope

Necessary to acquire UI specific component injections

!

CDI context to map beans per UI instance

!

@UIScoped

Context and

Scope UIScope

@CDIUI and @CDIView are @Stereotypes with @UIScoped

!

CDI events are sent within the scope

!

MVP Presenters and UI specific resources are marked as @UIScoped

Authentication

and

Authorization

Authentication

and

Authorization

com.vaadin.cdi.access. AccessControl

@RolesAllowed

!

isUserSignedIn(), isUserInRole(String),

getPrincipalName()

!

Can be replaced with @Alternative

How to

get started?

<dependency <groupId>com.vaadin</groupId> <artifactId>vaadin-cdi</artifactId> <version>1.0.0.alpha2</version></dependency>!<dependency org="com.vaadin" name="vaadin-cdi” rev=“1.0.0.alpha2” conf="default->default" />

How to

get started?

Eclipse

Download plugin from Martketplace

How to

get started?

IntelliJ IDEA

Built-in support

How to

get started?

Netbeans

Download plugin Netbeans Plugin Portal

How to

get started?

mvn archetype:generate

-DarchetypeGroupId=

com.vaadin

-DarchetypeArtifactId=

vaadin-archetype-application

-DarchetypeVersion=

7.1.15

Maven

How to

get started?

Questions or Comments?

3

Vaadin: A Familiar Way to Build Web Apps with Java

DZone, Inc. | www.dzone.comFigure 4: The Class Diagram presents all user interface component classes and the most important interfaces, relationships, and methods.

peter@vaadin.com

Questions or Comments?