Monday, April 7, 2008

Integrate OCS in webpages using JavaScript connecting through the webservice

For a couple of months now e-office and the guys of the UC development team (Rogier Giessen and Marc Wetters) are working on very nice things to integrate with MOSS/OCS. As you probably know e-office is a working easier company and constantly looking for special MOSS/OCS projects. Especially projects where we can integrate both products. Constantly looking for innovation. Unified Communications is really the future for upcoming software. So be prepared for the 21st century.

Today, we would like to tell you something about integrate OCS in webpages using JavaScript connecting to the webservice. Special thanks to our UC-guy Rogier Giessen working on this project for the last couple of weeks. By using the Unified Communications weblog in the Netherlands we are trying to inspirate other users or customers who like to integrate MOSS and OCS. Launching our new functionalities into the community means you can also give your feedback. It's very welcome.

Scenario (case):

The integration of OCS and Sharepoint is available through the ‘rich client’. In some corporate environments or on public computers installation of the ‘rich client’ is not possible or desirable.

Public extranet websites can also be enhanced with OCS functionality. Problem can be that variation and configuration of browsers, plugins and/or firewalls can cause many problems.

Solution:
Create a lightweight set of functions in JavaScript, that communicates through the OCS webservice and generates and manages controls.
According to requirements and/or design, functions can easily be added with the use of just one small JavaScript file. (According to functionality additional images or a small HTML file need to be added)

Example application:
Integration with Sharepoint without the use of the rich client and working without using additional protocols or ports.

Desired functionality:

  • Single sign-on: without additional programs or dialogs the ocs-functionality integrates in the sharepoint-site
  • The user can see and change his state using a dropdown-list
  • The user can see the availability of other users.

The biggest technical problems we encountered

  • How do I log in and maintain logged in
  • How do I manage all sessions and incoming requests
  • What is the best way to interact with the host page and user
  • How can the interaction be manageable and, at the same time fast and independent on the type of browser/platform.

The solution for these problems:

1. the “Unified Communications AJAX SDK” helpfile is a big help in getting the requests XML-syntax right. At the moment we have the single sign-on part in development. For now we have to enter our password again to be able to generate all the other functions.

2. Using a minimal set of variables helper-functions and variables the incoming events are passed to al the needed objects. Between pages cookies are being used.

3. We have created a handful of objects based on the desired functionality. If you want to add OCS- functionality to a page, you have to initiate the functions mentioned in the items above. The desired element you want can be added with a small line of code. At the end of the article there is a sample.

4. First we had to look at the required functionality. In the process of development the re-arrangement of objects were numerous.
The way to integrate is using id’s of an element. This is independent of whether it is a hyperlink or entire section of a page. Besides the JavaScript-file with our logic file and two simple .html files (one for firing the desired functions and one for the layout of the chatwindow). And off course images for the colored bullets in front of the names and the image in the chatwindow. The size of this is 26kByte for the JavaScript, HTML and CSS and an additional 20kByte for the images)

Example:

The following html code was added to a “content editor webpart” in sharepoint.

clip_image002

Which results in the following page:

clip_image002

The possibilities seem endless with the overload of information you can send and receive from the service. The integration with a portal or content management system can be seamless. The danger is the application can get bloated.
The beautiful thing about Unified Communications is: you can use it in parallel with other clients and they work together. Just open a dedicated program like the rich- or webclient from Microsoft, or perhaps you prefer your smart phone. The OCS-Webclient is another step closer to integrating UC in an intuitive way.

10 comments:

Anonymous said...

Hi Joachim, can you post the code of your content web part? I've tryed to use your tips, but I don't see any data from OCS.
Can you help me?
Regards
MaxAmbrogi

Joachim Farla said...

Hi Max, sorry this webpart is a commercial product for us. I can connect you to our sales manager if you like?

Anonymous said...

Could you confirm that the solution is pure JavaScript and does not include any ActiveX controls?

Is the solution platform independent which means that I could be using FireFox on a linux box and still have access to "presence" data?

This could be exactly what I'm looking for!!!

Thanks,

Jose

Anonymous said...

Hello Jose,

I can confirm that the service is 100% JavaScript(Except for some plain HTML for layout). However...
The Javascript imposes new 'chalenges' in Firefox. The major issue are the security settings, primarily the cross-site scripting protection. The problem is that Sharepoint and the CWA Webservice are usualy not installed on the same domain.
The security-settings in Firefox need to be lowered substantially to allow JavaScript in one domain to access a webservice in another one. (In IE with higher security settings the same issues occured.)
Another issue are the tags: The Active-X as you mention adds the sip-adresses to the tags. If you can extract the sip from e-mail adresses, you can translate them into tags.
These issues made us focus on a different aproach: use a proxy-service to bypass the cross-site scripting problem. Or writing a webservice ourselves with the possibility to add our own logic and new functionality of the R2 release.

Sendil said...

Could u please share me the code ?
Since I couldn't achieve it?
please ....
sendil.bonanzo@gmail.com

Eric said...
This comment has been removed by the author.
Eric said...

Hi Joachim,
I am working in a project which requires an instant messenger web part in a MOSS 2007 My Site. The instant messenger would be required to retrieve the contact list of the My Site Owner. That means we cannot fulfill the instant messenger function by merely the built-in presence in MOSS 2007.
Unfortunately, our clients are using OCS R2. The UC Ajax SDK cannot work under OCS R2 and they are unfavorable to the option to the workaround of installing CWA R2 Server in their OCS topology.
When I am searching on MSDN forums, they suggest using the UCMA SDK which is provided in OCS R2 to build the web services.
I would like to ask if there are any alternatives for this case, or if you can provide some expert opinion on my issue.
Thanks a lot.

Michiel said...

Hi Erik,

The best way I would suggest is to write a small WCF series which can connect, using UCMA, to OCS and return the contact list for the user.

As an alternative; in the next OCS release there are control for Silverlight to directly access OCS (using the Communicator client).

Another way is maybe to use an ActiveX control and query the OCS Communicator so you can access the contact list. This means deployment of this ActiveX control. You are actually building a more advanced name.dll (http://msdn.microsoft.com/en-us/library/ms455335.aspx)

Michiel said...

Oh Eric, you might want to take a look at this: http://blogs.msdn.com/modonovan/archive/2005/05/11/416376.aspx
You only have to return a list of contacts for a user, the control will take care of the presence. getting the contacts can be done using the UCMA.

Zinavo-Web Design | Web Development | SEO | Mobile Apps | ERP/CRM said...

Thanks, This is really important one, and information. Keep sharing on more information. Web Development Company in Bangalore | Website Designing Companies in Bangalore | Web Design Services in Bangalore | Web Designing Companies in Bangalore