Exploring the Long List of Options

1. DEV-1430 IBM Connections Integration
Exploring the Long List of Options

2. Disclaimer
2 2/24/17
• Some of the techniques exposed in the session might not be documented by
IBM and thus do engage IBM in anyway
• Some of these techniques might not work after an upgrade of either IBM
Connections cloud or IBM Connections on premises
• USE OF THIS INFORMATION IS ENTIRELY AT YOUR OWN RISK.
TRILOGGROUP AND DARWINO INC BEAR NO RESPONSIBILITY FOR
THE CONSEQUENCES OF RELIANCE ON, OR ANY INACCURACY IN,
ANY INFORMATION CONTAINED IN OR SUBMITTED TO THIS SITE.
THESE MATERIALS ARE PROVIDED "AS IS" WITHOUT WARRANTY OF
ANY KIND, EITHER EXPRESS OR IMPLIED.

3. About the Speakers
3 2/24/17
• Jesse Gallagher
CTO of I Know Some Guys
Board Member of OpenNTF
• Philippe Riand
CTO of Trilog Group & Darwino Inc.
Former application development chief architect for
IBM Collaboration Services
Chief architect, and inventor, of IBM Domino
XPages

4. Who Are We?
4 2/24/17
• TrilogGroup offers a Social Project Management solution called ProjExec
IBM partner for 20+ years
Fully integrated within the IBM platform
Connections cloud and on-premises
Often referenced by IBM as an integration example
• Darwino is an application development platform targeting mobile, cloud, and IoT
Darwino is well-integrated with IBM platforms, including IBM Connections, IBM
Domino, IBM Bluemix and IBM Watson
darwino.org, a branch of OpenNTF, is the open source organization
providing the Connections integration code shown in this session
We are in the showcase, booth 630

5. Objectives of the Session
5 2/24/17
• Demonstrate the techniques used by a real application to integrate with IBM
Connections, cloud & on-premises
• Show the differences between cloud and on-premises platforms and how to
adapt to them
• Introduce the open-source Darwino libraries abstracting the differences,
along with the sample code

6. Open Source project
6 2/24/17
• All the code shown here is *real* and available as an open source project on
Darwino.Org
• The source code is on Github:
https://github.com/darwino-org/Darwino-Connections
• It is currently made of 2 projects:
A reusable library
A demo application showing the capabilities
• It is using the darwino-commons library for convenience, which is available
as a community edition
The library is actually a subset of the full Darwino library

7. Authentication
Avoid multiple logins and share the same user identity
7 2/24/17

8. ProjExec
8 2/24/17

9. Authenticating on the Cloud
9 2/24/17
• ProjExec uses the IBM Connections Cloud authentication mechanism
SAML is not an option because the identity provider has to be Connections
Single sign-on is not an option because the servers are running from
different domains (no LTPA token)
Should not use basic authentication as it forces your server to store the
user/password
• The solution is to use OAuth: Authentication through Authorization
ProjExec triggers the OAuth dance to get an access token for the current
user
Any call to Connections Cloud services use the same token
A call to the people service to get the identity of the current user
/manage/oauth/getUserIdentity

10. Pros and Cons of using OAuth
10 2/24/17
• Works similarly on the cloud and on-premises
Well, almost – there are inconsistencies in the code that force the
application to use 2 code streams (use IBM SBT or Darwino core libs!)
connections/opensocial/oauth/rest/people/@me/@self
• The user has to grant access to the application the very first time
Once done, there is no way for the user to change that!
On-premises has a UI to manage OAuth access, but not on the cloud
• The dance is always run, but it is often seamless
If already authenticated to Connections, the login page does not appear
The user does have grant access for every single session

11. Authenticating On-Premises – Single Sign-On
11 2/24/17
• Uses IBM Single Sign-on technology – LTPA
Works on top of IBM servers, ideally the same WAS server
Runs in the same domain
• The authentication is seamless but you need to configure your app to use
the Connections login page
/profiles/login
WAS uses a cookie to redirect to the initial page (WASReqURL)
• There is also a Mobile login page when connecting from mobile devices
/mobile/admin/Login
Create your own login page that redirects to one or the other (by checking
the cookie above)

12. Custom Code Demo
12 2/24/17

13. Calling Services
13 2/24/17
• The OAuth Token, or the LTPA2 token can be used to call REST services on
the behalf of the user
• Be careful: some services requires the auth mode to be part of the URL
/connections/opensocial/{basic|oauth}/rest/people/{userI
d}/{groupId}

14. Integrating into the NavBar
Make your application visible in Connections
14 2/24/17

15. ProjExec
15 2/24/17

16. Integrating with the Cloud NavBar
16 2/24/17
• The integration should be done by an
organization administrator through the
Administration page
Has to be done on a per organization basis
This integration is basic as there is no way
to hide/show the option
• A partner can work with IBM to get its
application available as an “integrated 3
rd
party”
The process is currently heavyweight
This might change in the near future thanks to
an application catalog

17. Integrating with the On-Premises NavBar
17 2/24/17
• Done by customizing the IBM Connections JSPs
This has to be repeated after a new Connections installation
• Documented by IBM in the Customization Guide
https://www.ibm.com/support/knowledgecenter/SSYGQH_5.5.0/admin/custo
mize/t_admin_common_customize_main.html
Add your application to template/menu/apps.jsp
In the directory CONNECTIONS_CUSTOMIZATION_PATH
There is a ‘debug mode’ so you can do the changes without having to
restart the applications
• As it is done with JSPs, it is easy to hide/show an application for a user
http://blog.riand.com/2014/07/filtering-connections-applications.html

18. Custom Code Demo
18 2/24/17
Darwino
--%><tr><%--
--%><th scope="row" class="lotusNowrap"><%--
--%><img style="width:16px;height:16px;"
src="data:image/png;base64,iVBORw..."
alt="" role="presentation"><%--
--%><a href="/darwino-connections"><%--
--%><strong>Darwino Demo</strong><%--
--%></a><%--
--%></th><%--
--%><td class="lotusNowrap"><%--
--%><a href="https://localhost:8443/darwino-connections"><%--
--%>Darwino Demo Local<%--
--%></a><%--
--%></td><%--
--%></tr><%--

19. Get the Connections Look & Feel
Let the user feel that the application is part of IBM Connections
19 2/24/17

20. ProjExec
20 2/24/17

21. Integrate the NavBar: Connections Cloud
21 2/24/17
• This is the easiest and documented
https://www-
10.lotus.com/ldd/appdevwiki.nsf/xpDocViewer.xsp?lookupName=Toolkit+do
cs#action=openDocument&res_title=Adding_the_IBM_SmartCloud_for_Soc
ial_Business_banner_to_partner_applications_sbt&content=sdkcontent
• Just insert a JavaScript tag to your application
<script
src="https://<connections_server>/navbar/banner/<appName>/<divElementId>"></script>
• The banner recently evolved in June 2016 and then September 2016
Use an extra parameter to get the new version:
<script src="...navbar/banner/partner/<divElementId>?PNB=1"></script>

22. Make your Application Look Like Connections
22 2/24/17
• The look and feel consistency is achieved by using the same style sheet
Since V1, Connections used OneUI that has been documented until v3.0.3
http://infolib.lotus.com/resources/oneui/3.0/docPublic/index.htm
Now, it is called Hikari but the same style names seem to apply
But it is not documented anymore
What is next is unclear!
• On premises, the CSS are loaded with the header as explained before
• On the cloud, you have to load the CSS yourself from the Connections
server
Inspect the CSS loaded by a Connections app and load them explicitly

23. Custom Code Demo
23 2/24/17

24. Customizing the UI
Widgets, Gadgets, Community Applications
24 2/24/17

25. ProjExec
25 2/24/17

26. Comparing the Technologies
26 2/24/17
iWidgets
- Defined using an widget-config.xml files
- Renders inline HTML in the page
- Not secure for cloud deployment
- Added from the Connections admin UI or using script
OpenSocial Gadgets
- Defined using a gadget.xml file
- Renders within a controlled iFrame in the page
- Designed for pure client, single page apps
- Proprietary JavaScript API
- Platform-agnostic API, although poorly implemented in Connections
- Registered though script commands
Community Applications
- Defined using a JSON file
- Render a simple iFrame pointing to your URL
- No APIs available
- Communicate the context (community id, user, …) using a simple
postMessage(…) to the iFrame
- Registered from the Connections admin UI or using REST services
For Connections On-Premises
For the Embedded Experience
(includes the Notes client)
For Connections Cloud
(maybe Verse?)

27. Optimize your Development
27 2/24/17
• Three technologies for the same purpose: render your app in IBM’s UI!
But don’t write the same applications 3 times
• The rules
Write your “thing” to be embedded in a iFrame
Works in the cloud
Isolated context from the page/other components (CSS, JavaScript…)
Wrap the API calls into a common API, delegating to the underlying technology
Use the iFrame directly as an community application (or a gadget)
Create a generic iWidget definition inserting an iFrame

28. The Techniques
28 2/24/17
• On the cloud, a static HTML page is gathering the community information
Can redirect to another page
The parameters can then be sent to the server for processing
Ex: community ID
• On premises, the widget generates an <iframe> tag that loads the real page
Information can be gathered from the main page and sent to the iframe (not
implemented in the demo)
A resizing mechanism can also be implemented
• In both case, the body comes from the same code

29. Custom Code Demo
29 2/24/17

30. What Else?
Many other capabilities are available
30 2/24/17

31. Other Extensions to Consider
31 2/24/17
• Connections cloud
Add organization extensions, per service
BSS API, to access to use registration and guest users
Display the business card
• Connections on-premises
Customize the UI besides iWidgets – act on the JSPs
Display the business card
Participate in JavaScript aggregation
Since C5.0, pure client aggregation does not work
Create a Jazz OSGi plug-in and contribute your JS
SPIs

32. IBM Guest Speaker
How this will evolve in a near future
32 2/24/17

33. The Future of Connections Application Development
33 2/24/17
• Maureen Leland
Connections App Dev Chief Architect
Session to follow:
DEV-1048 : The Future Is PINK: IBM Connections Your
Way
Program : Development, Design and Tools
Topic : Enterprise collaboration
Session Type : Breakout Session
Date/Time : Wed, 22-Feb, 11:00 AM-11:45 AM
Location : Moscone West, Level 2 - Room 2007
Presenter(s) : Andre Hagemeier, IBM; Maureen Leland,
IBM

34. Thank you
34 2/24/17