DEV-1430 IBM Connections Integration

Exploring the Long List of Options

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.

About the Speakers

3 2/24/17

• Jesse GallagherCTO of I Know Some GuysBoard Member of OpenNTF

• Philippe RiandCTO of Trilog Group & Darwino Inc.Former application development chief architect for IBM Collaboration ServicesChief architect, and inventor, of IBM Domino XPages

Who Are We?

4 2/24/17

• TrilogGroup offers a Social Project Management solution called ProjExecIBM partner for 20+ yearsFully integrated within the IBM platform

Connections cloud and on-premisesOften referenced by IBM as an integration example

• Darwino is an application development platform targeting mobile, cloud, and IoTDarwino is well-integrated with IBM platforms, including IBM Connections, IBM Domino, IBM Bluemix and IBM Watsondarwino.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

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

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 libraryA demo application showing the capabilities

• It is using the darwino-commons library for convenience, which is available as a community editionThe library is actually a subset of the full Darwino library

Authentication

Avoid multiple logins and share the same user identity

7 2/24/17

ProjExec

8 2/24/17

Authenticating on the Cloud

9 2/24/17

• ProjExec uses the IBM Connections Cloud authentication mechanismSAML is not an option because the identity provider has to be ConnectionsSingle 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 AuthorizationProjExec triggers the OAuth dance to get an access token for the current userAny call to Connections Cloud services use the same tokenA call to the people service to get the identity of the current user

/manage/oauth/getUserIdentity

Pros and Cons of using OAuth

10 2/24/17

• Works similarly on the cloud and on-premisesWell, 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 timeOnce 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 seamlessIf already authenticated to Connections, the login page does not appearThe user does have grant access for every single session

Authenticating On-Premises – Single Sign-On

11 2/24/17

• Uses IBM Single Sign-on technology – LTPAWorks on top of IBM servers, ideally the same WAS serverRuns in the same domain

• The authentication is seamless but you need to configure your app to use the Connections login page

/profiles/loginWAS 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)

Custom Code Demo

12 2/24/17

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/{userId}/{groupId}

Integrating into the NavBar

Make your application visible in Connections

14 2/24/17

ProjExec

15 2/24/17

Integrating with the Cloud NavBar

16 2/24/17

• The integration should be done by anorganization administrator through theAdministration pageHas to be done on a per organization basisThis integration is basic as there is no wayto hide/show the option

• A partner can work with IBM to get itsapplication available as an “integrated 3rd party”The process is currently heavyweightThis might change in the near future thanks toan application catalog

Integrating with the On-Premises NavBar

17 2/24/17

• Done by customizing the IBM Connections JSPsThis has to be repeated after a new Connections installation

• Documented by IBM in the Customization Guidehttps://www.ibm.com/support/knowledgecenter/SSYGQH_5.5.0/admin/customize/t_admin_common_customize_main.html

Add your application to template/menu/apps.jspIn 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 userhttp://blog.riand.com/2014/07/filtering-connections-applications.html

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><%--

Get the Connections Look & FeelLet the user feel that the application is part of IBM Connections

19 2/24/17

ProjExec

20 2/24/17

Integrate the NavBar: Connections Cloud

21 2/24/17

• This is the easiest and documentedhttps://www-10.lotus.com/ldd/appdevwiki.nsf/xpDocViewer.xsp?lookupName=Toolkit+docs#action=openDocument&res_title=Adding_the_IBM_SmartCloud_for_Social_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 2016Use an extra parameter to get the new version:

<script src="...navbar/banner/partner/<divElementId>?PNB=1"></script>

Make your Application Look Like Connections

22 2/24/17

• The look and feel consistency is achieved by using the same style sheetSince V1, Connections used OneUI that has been documented until v3.0.3

http://infolib.lotus.com/resources/oneui/3.0/docPublic/index.htmNow, it is called Hikari but the same style names seem to apply

But it is not documented anymoreWhat 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 serverInspect the CSS loaded by a Connections app and load them explicitly

Custom Code Demo

23 2/24/17

Customizing the UI

Widgets, Gadgets, Community Applications

24 2/24/17

ProjExec

25 2/24/17

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?)

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 rulesWrite your “thing” to be embedded in a iFrame

Works in the cloudIsolated context from the page/other components (CSS, JavaScript…)

Wrap the API calls into a common API, delegating to the underlying technologyUse the iFrame directly as an community application (or a gadget)Create a generic iWidget definition inserting an iFrame

The Techniques

28 2/24/17

• On the cloud, a static HTML page is gathering the community informationCan redirect to another page

The parameters can then be sent to the server for processingEx: community ID

• On premises, the widget generates an <iframe> tag that loads the real pageInformation 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

Custom Code Demo

29 2/24/17

What Else?

Many other capabilities are available

30 2/24/17

Other Extensions to Consider

31 2/24/17

• Connections cloudAdd organization extensions, per serviceBSS API, to access to use registration and guest usersDisplay the business card

• Connections on-premisesCustomize the UI besides iWidgets – act on the JSPsDisplay the business cardParticipate in JavaScript aggregation

Since C5.0, pure client aggregation does not workCreate a Jazz OSGi plug-in and contribute your JS

SPIs

IBM Guest Speaker

How this will evolve in a near future

32 2/24/17

The Future of Connections Application Development

33 2/24/17

• Maureen LelandConnections App Dev Chief Architect

Session to follow:DEV-1048 : The Future Is PINK: IBM Connections Your WayProgram : Development, Design and ToolsTopic : Enterprise collaborationSession Type : Breakout SessionDate/Time : Wed, 22-Feb, 11:00 AM-11:45 AMLocation : Moscone West, Level 2 - Room 2007Presenter(s) : Andre Hagemeier, IBM; Maureen Leland, IBM

Thank you

34 2/24/17