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.
Questions or Comments?