building a utilities portal with magnolia 5 & sap
DESCRIPTION
Matteo Pelucco from Tinext explains the systems integration of SAP for AIL, a Swiss utility company, showing the benefits of Magnolia's Open Suite approach. Learn how Magnolia can be the central framework for your integration projects and why some Magnolia integration patterns should be your best development friends.TRANSCRIPT
Building a utilities portal with Magnolia 5 and SAPMagnolia Conference 2014
Matteo Pelucco, Senior Software Engineer
Basel, 26th June 2014
2
Digital Technology with Emotion
3
Tinext integrated offer
4
199545+
650+
2 mio 800+
22
3000+ 24x7x365
Our first web project
Employees
Hosted websites
web pages clientsWe are in Switzerland and Italy
Datacenters
Managed mailboxes
Guaranteedassistance
Physical servers
Realized projects
160+
1500+
Facts and figures
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.
6
Clients
7
Matteo Pelucco, Senior Software Engineer
@matteopelucco
8
Aziende Industriali di Lugano (AIL)
CompanyPublic Utility companyProduces electricity & water. Imports gas.Retails electricity, gas & water in Ticino.
ProjectCMS Replacement: Magnolia100k potential users23 business processes to buildSensitive data
9
Open Suite Approach
www.royalcaribbean.it
25 Business Processes to model
Add a new contract
View billing documents
Communicate meter readings
View technical data
..and many more..
Each of them interacts with SAP in a different way (few common patterns)
Standard form builder was not enough!
Change user data
Just an example: what stakeholders think
Just an example: how things really are
13
USE YOUR HP!
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!
A business process site tree
A business process interface bp#17: change payment method
Step validators
New form field types
Responsive multistep navigation
Responsive contextual help (STK)
y
y
Standard STK Components (stkLinkList, stkInternalLink)
Standard STK Components (stkTextImage)
Unobtrusive approach:
$(".ctx-menu-content").load (
$(this).attr("href") + " #mainArea .titleTextButton"
);
21
SAP INTEGRATION
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 documentationOnly WSDL
jUnit as reverse engineering tool
Tests to reverse engineer SOAP layerJava 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.
jUnit as reverse engineering tool
Each jUnit test decomposed in FormProcessor and/or FormStepValidator
Quick debugging: just change few properties and launch the test
jUnit as reverse engineering tool
AbstractTest.java
LoginTest.java
ChangeUsernameTest.java
SendMeterReadingsTest.java
…
Flow simulation, real SAP calls, asserts,utilities tuning, …
Common methods / utilities
Prepares a «logged» context,@before method
26
DMS INTEGRATION: ALFRESCO
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..
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.
Alfresco API
User Document Archive
Search is performed
against SAP
Download links to
Alfresco PDFs
via Magnolia
servlet
yy
Authentication and authorization
Users are in SAP
No ACLs: everything is data-driven
Rules not applicable on a hierarchical resource tree
Page renderer
Page protection (for each page)
Security layer exposed to freemarkerconditional presentation layer statements user interface personalization
Agile: easy to test and debug[#if …] normal flow [#else] exception [/#if]
User Login
Freemarker Custom Util
Freemarker Security Statements
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
Future Improvements
Simplify Form building activity Now it is for superusersToo many Magnolia green bars, even for short forms
SAP represents a single point of failureExpose SAP data to a «look-aside» repository, periodically refreshed. This will allow also horizontal scaling..
Heavy usage of Http SessionNo cacheProvide a way to communicate between a form step and another
No single-page appForm builder should be exposed also to JS frameworks (Backbone, Angular..) for a better user experience and performance.
38
SVN Sync (app)Allows automatic synchronization of a SVN repository to Magnolia webapp (filesystem)
Bootstrap tasksClone Magnolia standard security, create pages, utilities
Java UtilsHTTP helpers, Calendar, Captcha, Text, Collections, Magnolia, ..
Freemarker UtilsCalendar, Text, Magnolia, STK shortcuts, …
Page Builder APIAllow to create pages simulating user interactions
CaptchaIntegration with Tinext Captcha System
NECTAR: A NEW TINEXT MODULE
That’s CE!
Choose a project
(yes, you can configure multiple
projects!)
SVN Sync will load your SVN
repository..
y
Nectar: SVN Sync App
Start file
copy
Check project config (path, remote source..)y
y
Nectar: SVN Sync App
Progress bar
Visual feedback
y
y
Nectar: SVN Sync App
Thank you for your attention.
Tinext SA
Viale Serfontana 7
6834 Morbio
Inferiore
Switzerland
+41 91 612 22 66
www.tinext.com
Tinext Italia Srl
Via Borghi 8
21013 Gallarate
Italy
+39 0331 667
747