Download as KEY, PPTX
Uploaded byPhilipp Bärfuss
Magnolia CMS 5.0 - Architecture
The document describes the architecture of Magnolia 5.0. It uses a Model-View-Presenter pattern with Google Web Toolkit concepts. The main components are Places for navigation, Activities as presenters, Views for user interfaces, an EventBus for communication, and an ActivityManager to coordinate starting and stopping Activities in response to Place changes. Vaadin is used for widget development and provides theming and Java-based development.
More Related Content
Similar to Magnolia CMS 5.0 - Architecture
![[Challenge:Future] Chocoholic](https://cdn.slidesharecdn.com/ss_thumbnails/challengefuture-chocoholic3349-110912124503-phpapp01-thumbnail.jpg?width=640&height=640&fit=bounds)
Magnolia CMS 5.0 - Architecture
- 1. Magnolia 5.0 Architecture local louisville/Reflecting Pool at Pulitzer/Flickr
- 2. Web Browser AdminCentral Web pages, Vaadin (GWT) CMIS JCR Images, .. App App HTTP AJAX/JSON REST/Atom Web Services Rendering Engine Vaadin (CMIS) Templates Content UI Model Model JCR Node Security ... ... Mixins Types 2 Magnolia is a registered trademark used by permission Version 1.0
- 3. WebServices (CMIS) • willuse the CMIS API • Content Management Interoperability Services • standardized • fits JCR specification • REST • uses Atom format • open source implementation exists • Apache Chemistry (OpenCMIS) 3 Magnolia is a registered trademark used by permission Version 1.0
- 4. IoC/DI (Dependency Injection) •we gradually introduce IoC • for components • for the new UI • we use PicoContainer • constructor injection 4 Magnolia is a registered trademark used by permission Version 1.0
- 5. Vaadin 5 Magnolia is a registered trademark used by permission Version 1.0
- 6. Vaadin • Rich widgetframework • Out-of-the-box theming • Java developer friendly • Close to Swing • GWT based (Java -> Javascript) • Can integrate any GWT-components • Rare GWT-compiles (compared to plain GWT) • Testing with pure JUnit • Apache License • Well documented 6 Magnolia is a registered trademark used by permission Version 1.0
- 7. UI - Architecture 7 Magnolia is a registered trademark used by permission Version 1.0
- 8. Model View MVP Presenter UI - Architecture 7 Magnolia is a registered trademark used by permission Version 1.0
- 9. Model View MVP Presenter UI - Architecture Activities GWT Places Editors 7 Magnolia is a registered trademark used by permission Version 1.0
- 10. Model View MVP Presenter UI - Architecture Activities guice GWT IoC pico Places Editors 7 Magnolia is a registered trademark used by permission Version 1.0
- 11. GWT concepts asa blueprint promoter of MVP GWT promoted to use the MVP for a while. widget oriented GWT applications are widget oriented. Vaadin too. real web applications proper history support, separation of browser dependent code ready made the fundamental framework is provided since GWT 2.1 8 Magnolia is a registered trademark used by permission Version 1.0
- 12.
- 13.
- 14. Model - View- Presenter (MVP) updates the widgets provides the data to and handles UI events the view and interacts like click events with the application View Presenter the view has not binding to the model Model EventBus 10 Magnolia is a registered trademark used by permission Version 1.0
- 15. MVP - Example TreeView TreePresenter selectItem(path) notifies onItemSelected(path) expand(path) refresh() TreeActivity Vaadin specific updates implementation start() onStop() TreeViewImpl 11 Magnolia is a registered trademark used by permission Version 1.0
- 16. Main Participants • Place - Application Navigation • Activitiy - The Presenter • View - the UI widgets • ViewPort - UI region • EventBus - Application Events 12 Magnolia is a registered trademark used by permission Version 1.0
- 17. Places - Navigation •the state representing the UI location • what is showed (inbox, detail view) • used for the application navigation • PlaceController.goTo(place) • mapped to activities • ActivityMapper.getActivity(place) • bound to the browser history • by the PlaceHistoryHandler 13 Magnolia is a registered trademark used by permission Version 1.0
- 18. Places - Navigation BrowserHistory onFragmentChange(event) setFragment(token) PlaceHistoryHandler PlaceHistoryMapper onFragmentChange(event) getPlace(String token): Place onPlaceChange(event) getToken(Place place): String goTo(place) PlaceController goTo(place) getWhere(): Place onPlaceChange(event) fireEvent(placeChanged) EventBus 14 Magnolia is a registered trademark used by permission Version 1.0
- 19. Activity - ActivityManager •an activity has the presenter role in the MVP pattern • AcivityManager • bound to a region in the UI (ViewPort) • calls start(viewPort, eventBus) to start the activity • calls onStop() to stop an activity • injects the view into the the viewport • PlaceController • calls mayStop() to test if an activity can be leaved • shows confirmation dialog if needed 15 Magnolia is a registered trademark used by permission Version 1.0
- 20. Activity - ActivityManager ActivityManager getActivity(place) ActivityMapper onPlaceChange(event) getActivity(place): Activity <<create>> start(), onStop() Activity start(viewPort, eventBus) mayStop(): String onStop() onPlaceChange(event) fires application events EventBus 16 Magnolia is a registered trademark used by permission Version 1.0
- 21. View • interface • contract with the presenter • an implementation has the Vaadin specific code • different device -> different views (mobile, iPad) • LTR/RTL • UIBuilders 17 Magnolia is a registered trademark used by permission Version 1.0
- 22. Places - Activities- ViewPorts BrowserHistory Application ViewPort PlaceHistoryHandler start, stop ActivityManager Activity View goTo(place) PlaceController ViewPort ActivityManager Activity View onPlaceChange(event) fireEvent(placeChanged) EventBus 18 Magnolia is a registered trademark used by permission Version 1.0
- 23. EventBus • EventBus • application level events • ItemSelectedEvent, ItemDeletedEvent, ... • UI events • are handled by the view itself • OnClickEvent, ... 19 Magnolia is a registered trademark used by permission Version 1.0
- 24. Shell • encapsulates the browser • notify() • confirm(message) • URI fragment manipulations • getURIFragment() • setURIFragment() 20 Magnolia is a registered trademark used by permission Version 1.0
- 25. Sub MVP Container •an Activity can be a MVP container on its own • creates a SubShell to interact with sub-fragments of the URI fragment • creates its own place management (PlaceController, PlaceHandler) • has its own inner EventBus • subclasses can access the outer environment 21 Magnolia is a registered trademark used by permission Version 1.0
- 26. UI Model • POJOs (Definitions) UI Builder • dialogs, trees, actions • Vaadin independent UI Model • contributed in various ways Actions Trees Module Dialogs • configuration Code • annotations Node Types Configuration (c2b) Annotations • programmatically • UI Builder builds the Vaadin components 22 Magnolia is a registered trademark used by permission Version 1.0
- 27. UI Builder UI Model Actions Trees Module Dialogs Code Node Types Configuration (c2b) Annotations 23 Magnolia is a registered trademark used by permission Version 1.0
- 28. UI Definitions andBuilders ActionFactory Activity uses createAction(ActionDefinition<A>): A uses uses <<creates>> UIModel ActionDefinition<A> Action getActionDefinition(name): ActionDefintion perform() Potentially built with could we generate them? content2bean 24 Magnolia is a registered trademark used by permission Version 1.0
- 29. Editors - Drivers •Editor • exposed by the View (HasEditors) • to populate the View with data • to retrieve the values entered by the user • Driver • injects the values into the editors • updates the underlaying model (node, bean) • validates the data • Used in various editable views • DialogView, TreeView, ParagraphEditView, ... 25 Magnolia is a registered trademark used by permission Version 1.0
- 30. Used by thedriver to expose values and retrieve the new values Any view exposing editors. TreeView, Editor<T> HasEditors DialogView, ParagraphView, ... setValue(T) getEditors() getValue(): T getEditor(name): Editor builds DialogBuilder DialogView Driver<T> build(definition): DialogView Populates the editors. Updates and validates the edited object. Driver(HasEditors) edit(T) flush(T) uses hasErrors() getErrors() DialogActivity save() cancel() DialogDefintion saves The presenter, called by the view. Delegates updates, to the Driver but is validates responsible for saving. NodeDriver Node 26 Magnolia is a registered trademark used by permission Version 1.0
- 31. Actions vs. Commands UI Model Content Model invoke Action execute Command open navigate execute notify PlaceController Web Services 27 Magnolia is a registered trademark used by permission Version 1.0
- 32. Commands • atom operation • delete item • save changes • activate content • undo/redo • also exposed by the web services 28 Magnolia is a registered trademark used by permission Version 1.0
- 33. Content Model • centralizednode type definitions • constraints (used in the UI, web Web Services services, ..) Vaadin (CMIS) • entities (paragraphs belong to Content Model pages, ..) Constraints Commands • versioning Lifecycle Virtual Structures • use mixins • mix:metaData instead of sub node JCR Node Mixins Types • faster and simpler queries • lifecycle, workflow, status • virtual structures 29 Magnolia is a registered trademark used by permission Version 1.0
- 34. Web Services Vaadin (CMIS) Content Model Constraints Commands Virtual Lifecycle Structures JCR Node Mixins Types 30 Magnolia is a registered trademark used by permission Version 1.0
- 35. Content API/JCR API •move content security to the JCR layer New Legacy Code Code • new code uses the JCR API • profit from other JCR frameworks and libraries Content API • example Vaadin JCR Container Security • keep the Content API alive for legacy JCR API Security code • better performance, esp. for queries 31 Magnolia is a registered trademark used by permission Version 1.0
- 36. References ... • MVP • Model View Presenter (MVP) VS Model View Controller (.Net) • GUI Architectures (Martin Fowler) • GWT Activity and Places • GWT 2.1 Activities - tbroyer's posterous • GWT 2.1 Places - tbroyer's posterous • GWT 2.1 Places – Part II - tbroyer's posterous • GWT MVP Development with Activities and Places (GWT Documentation) • GWT Editors • GWT 2.1 Editors - tbroyer's posterous • Developer's Guide - Editors - (GWT Documentation) 32 Magnolia is a registered trademark used by permission Version 1.0
- 37. References • Commands • Command pattern (Wikipedia) • Undo (Wikipedia) • Memento pattern (Wikipedia) 33 Magnolia is a registered trademark used by permission Version 1.0