Building a utilities portal with Magnolia 5 and SAP

Transcription

1 Building a utilities portal with Magnolia 5 and SAP Magnolia Conference 2014 Matteo Pelucco, Senior Software Engineer Basel, 26th June 2014

2 Digital Technology with Emotion 2

3 Tinext integrated offer 3

4 Facts and figures 1995 Our first web project 650+ Hosted websites 45+ Employees 2 mio 800+ web pages clients x7 Managed mailboxes x Datacenters We are in Switzerland and Italy Guaranteed assistance 160+ Physical servers Realized projects 4

5 About Tinext Tinext combines the latest digital marketing expertise together with the deep technical understanding of a seasoned enterprise systems integrator. The end results are solid enterprise web solutions that transform our clients businesses. Since 2001, our teams have conceived, delivered, deployed and maintained more than 500 successful projects, with clients including Al Arabiya News Channel, Royal Caribbean International, Whirlpool Europe, City of Lausanne, Generali Group and Swiss national broadcasters RSI. With a comprehensive range of digital services delivered through our three core practices, Tinext can deliver complete projects or flexible services working in combination with other providers. 5

6 Clients 6

7 Matteo Pelucco, Senior Software 7

8 Aziende Industriali di Lugano (AIL) Company Public Utility company Produces electricity & water. Imports gas. Retails electricity, gas & water in Ticino. Project CMS Replacement: Magnolia 100k potential users 23 business processes to build Sensitive data 8

9 Open Suite Approach 9

10 25 Business Processes to model Each of them interacts with SAP in a different way (few common patterns) Standard form builder was not enough! Communicate m eter readings a t a d l a ic n h c e t w Vie Add a n ew con tract ts View billing documen Change u ser data..and many more..

11 Just an example: what stakeholders think

12 Just an example: how things really are

13 USE YOUR HP! 13

14 Form builder reloaded Standard Form Builder has been extended, several new features has been introduced: SAP-aware validators Multistep navigation bar Step Validators Scriptable default values for input (eval) Final summary step Dynamic mail processors Everything responsive!

15 A business process site tree

16 A business process interface bp#17: change payment method

17 Step validators

18 New form field types

19 Responsive multistep navigation

20 Responsive contextual help (STK) y Standard STK Components (stktextimage) Standard STK Components (stklinklist, stkinternallink) Unobtrusive approach: $(".ctx-menu-content").load ( ); $(this).attr("href") + " #mainarea.titletextbutton"

21 SAP INTEGRATION 21

22 Legacy SAP integration Do you remember? We are moving an existing (live!) project, already on SAP. Legacy SOAP-based SAP integration layer Refactoring not in project scope! No documentation Only WSDL

23 junit as reverse engineering tool Tests to reverse engineer SOAP layer Java WS client: built with jax- ws, filled with junit test cases. Magnolia 5 IoC allowed our team to mock all the remote functionalities, without blocking front-end developers. SAP URLs in magnolia.properties file No risk of accessing the wrong SAP environment.

24 junit as reverse engineering tool Each junit test decomposed in FormProcessor and/or FormStepValidator Quick debugging: just change few properties and launch the test

25 junit as reverse engineering tool AbstractTest.java Common methods / utilities LoginTest.java Prepares a «logged» method ChangeUsernameTest.java SendMeterReadingsTest.java Flow simulation, real SAP calls, asserts, utilities tuning,

26 DMS INTEGRATION: ALFRESCO 26

27 Legacy Alfresco DMS Customer communications were stored in Alfresco (v. 2.x!) SAP ask Alfresco to generate PDF, and to serve them to customers Need to hide real Alfresco URLs..

28 Alfresco API Used standard Alfresco API to download documents A dedicated Magnolia «DocumentDownloadServlet» transparently proxies the document download request for a logged user, applying a security layer on top of it.

29 Alfresco API

30 User Document Archive y Search is performed against SAP Download links to Alfresco PDFs via Magnolia servlet

31 Authentication and authorization Users are in SAP No ACLs: everything is data-driven Rules not applicable on a hierarchical resource tree

32 Page renderer Page protection (for each page) Security layer exposed to freemarker condihonal presentahon layer statements user interface personalizahon Agile: easy to test and debug [#if ] normal flow [#else] excephon [/#if]

33 User Login

34 Freemarker Custom Util

35 Freemarker Security Statements

36 Conclusions Magnolia «open suite approach» easily allows to «plug» your integration activity So many «injection points» Reliable: integration patterns Form Builder is very powerful and customizable Mock activity is foundamental in projects like this. Magnolia IoC helps the project lifecycle and team work User data security always on top of feature set

37 Future Improvements Simplify Form building activity Now it is for superusers Too many Magnolia green bars, even for short forms SAP represents a single point of failure Expose SAP data to a «look-aside» repository, periodically refreshed. This will allow also horizontal scaling.. Heavy usage of Http Session No cache Provide a way to communicate between a form step and another No single-page app Form builder should be exposed also to JS frameworks (Backbone, Angular..) for a better user experience and performance.

38 NECTAR: A NEW TINEXT MODULE SVN Sync (app) Allows automatic synchronization of a SVN repository to Magnolia webapp (filesystem) Bootstrap tasks Clone Magnolia standard security, create pages, utilities Java Utils HTTP helpers, Calendar, Captcha, Text, Collections, Magnolia,.. Freemarker Utils Calendar, Text, Magnolia, STK shortcuts, That s CE! Page Builder API Allow to create pages simulating user interactions Captcha Integration with Tinext Captcha System 38

39 Nectar: SVN Sync App y Choose a project (yes, you can configure multiple projects!) SVN Sync will load your SVN repository..

40 Nectar: SVN Sync App Start file copy y Check project config (path, remote source..)

41 Nectar: SVN Sync App Progress bar Visual feedback y

42 Nectar: SVN Sync App y Demo time! 42

43 Thank you for your attention. Tinext SA Viale Serfontana Morbio Inferiore Switzerland Tinext Italia Srl Via Borghi Gallarate Italy info@tinext.com