Magnolia CMS 5.0 - UI Architecture

Magnolia 5.0 - Concept UI Architecture1 Magnolia is a registered trademark used by permissionVersion 1.0

MVP vs. MVC http://blog.vuscode.com/malovicn/archive/2007/12/18/model-view-presenter-mvp-vs-model-view-controller-mvc.aspx2 Magnolia is a registered trademark used by permissionVersion 1.0

GWT 2.1 - MVP• based on the experience at google• good fundament for browser application • history • asynchronously • decoupling browser dependent code3 Magnolia is a registered trademark used by permissionVersion 1.0

GWT 2.1 - the participants• Places• Display Regions• Activities (Presenter)• Views• EventBus4 Magnolia is a registered trademark used by permissionVersion 1.0

Places• Place • represents a state • each place is a subclass • provides the values to re-produce the place• PlaceController • PlaceController.gotTo(place) • fires PlaceChangeEvent/PlaceChangeRequestEvent• PlaceHistoryHandler • triggered by history navigation• PlaceHistoryMapper • browser history support5 Magnolia is a registered trademark used by permissionVersion 1.0

Display Regions• where the produced view is attached to• navigation menu, search bar, main region, ..• implements AcceptsOneWidget interface6 Magnolia is a registered trademark used by permissionVersion 1.0

Activities (Presenter)• Activity • the presenter of the MVP pattern • start(region, eventbus) • mayStop() • onCacel()• ActivityMapper • maps places to activities• ActivityManager • reacts on PlaceChangeEvents • starts the activity7 Magnolia is a registered trademark used by permissionVersion 1.0

View• interface • contract with the presenter• a subclass will contain the UI specific code • GWT, Vaadin, ...• different device -> different views (mobile, iPad)• LTR/RTL• ViewFactory8 Magnolia is a registered trademark used by permissionVersion 1.0

PlaceController PlaceHistory Place goTo(place) Handler getWhere():Place Home ﬁres PlaceChangeEvent dispatches EventBus ActivityManager ActivityMapper onPlaceChange(event) getActivity(place):Activity Activity start(region, eventBus) mayStop() starts onCancel() onStop()9 Magnolia is a registered trademark used by permissionVersion 1.0

EventBus• EventBus • application level events • ItemSelectedEvent, ItemDeletedEvent, ...• UI events • are handled by the presenter • OnClickEvent, ...10 Magnolia is a registered trademark used by permissionVersion 1.0

http://www.nieleyde.org/SkywayBlog/post.htm?postid=37782056-c4e1-4dfb-9caa-40ab9552ca3b11 Magnolia is a registered trademark used by permissionVersion 1.0

Commands• atom operation • delete item • save changes • activate content• undo/redo• triggered by the presenter or application controller• also exposed by the web services12 Magnolia is a registered trademark used by permissionVersion 1.0

Why should we use this• separation of concerns• less Vaadin dependent code• history support• different types of views• aligned with GWT client side coding13 Magnolia is a registered trademark used by permissionVersion 1.0

What will we do• use the blackboard Vaadin add-on (event bus) • wiki page• write the sever side classes (Place, Activity, ...) • analog to GWT code14 Magnolia is a registered trademark used by permissionVersion 1.0

Resources• MVP • Model View Presenter (MVP) VS Model View Controller (.Net) • GUI Architectures (Martin Fowler)• GWT Architecture • GWT 2.1 Activities - tbroyers posterous • GWT 2.1 Places - tbroyers posterous • GWT 2.1 Places – Part II - tbroyers posterous • GWT MVP Development with Activities and Places (GWT Documentation) • SolamenteNiel - GWT: Model-View-Presenter Architecture Diagram• Commands • Command pattern (Wikipedia) • Undo (Wikipedia) • Memento pattern (Wikipedia)15 Magnolia is a registered trademark used by permissionVersion 1.0

http://www.magnolia-cms.com	59
http://localhost	12
http://author.magnolia-cms.com	5
http://wiki.magnolia-cms.com	5
http://www.google.es	1

Magnolia CMS 5.0 - UI Architecture

by Philipp Bärfuss on Feb 09, 2011

Accessibility

Categories

Upload Details

Usage Rights

5 Embeds 82

Statistics

Magnolia CMS 5.0 - UI Architecture Presentation Transcript