5.4 Adding additional actions

Back to main topic 5. Busines card

In this section, we provide step-by-step instructions about how to add custom actions to a Lotus Connections business card. This sample demonstrates how you can integrate with real-life applications such as LinkedIn, Facebook, Skype, and so forth.

These sample actions perform the following actions:

• View the person's LinkedIn Profile
• View the person's profile in Facebook
• Call the person (using Skype or any other methods)
• Demonstrate how to call a JavaScript function

In the sample actions that integrate with LinkedIn, Facebook, and Skype, we assume that the UID in Lotus Connections matches those in the target applications. The final sample demonstrates a call to a very simple JavaScript function. The JavaScript call sample provides a guide for situations when you cannot simply integrate with the third-party applications by making a URL call.

The following figure displays four custom actions that we added.

Custom Business Card Actions

To add additional actions in the business card, you modify the personTagUI.js file, which is located in the following directory:

<WAS_PROFILE_ROOT>/installedApps/<cellName>/Profiles.ear/peoplepages.war/javascript/personTagUI.js

Look for the writeMoreActionsMenu function in the personTagUI.js file, and add your additional actions to integrate to external applications, as shown in the bold text in the following example.

writeMoreActionsMenu: function(header, person, baseURL, isInline)
{
try{
header.write(' <ul class="lotusActionMenu" id="'+person.key);

if(isInline)
header.write('Inline');

header.write('MoreActionMenu">');

header.write('<li class="lotusSendMail"><a href="mailto:'+escape(person.email.internet) +'">'+generalrs.personCardSendMail+'</a></li>');
header.write('<li id="'+person.email.internet+'ChatActionMore" style="display:none;"><a href="javascript:void(0);" onclick="SemTagPerson.sametimeStart(\'chat\', \''+person.email.internet+'\');">'+generalrs.personCardChat+'</a></li>');
header.write('<li id="'+person.email.internet+'CallActionMore" style="display:none;"><a href="javascript:void(0);" onclick="SemTagPerson.sametimeStart(\'call\', \''+person.email.internet+'\');">'+generalrs.personCardCall+'</a></li>');
header.write('<li class="lotusMenuSeparator"><a href="'+baseURL+'/html/wc.do?action=fr&requireAuth=true&widgetId=friends&targetKey='+person.key+'">'+generalrs. personCardAddAsColleagues+'</a></li>');
header.write('<li class="lotusMenuSeparator"><a href="'+baseURL+'/vcard/profile.do?key='+person.key+'">'+generalrs.personCardDownloadVCard+'</a></li>');
header.write('<li class="lotusMenuSeparator"><a href="http://www.linkedin.com/in/' + escap e(person.uid) + '">View LinkedIn Profile</a></li>');
header.write('<li class="lotusMenuSeparator"><a href="http://www.new.facebook.com/s.php?re f=search&i nit=q&q=' + escape(person.email.internet) +'">My FaceBook</a></li>');
header.write('<li class="lotusMenuSeparator"><a href="callto:' + escape(person.uid) +'">Call me</a></li>');
header.write('<li class="lotusMenuSeparator"><a href="javascript:void(0);" onclick="SemTagPersonUI.customAction();">Call JS Function</a></li>');

header.write(' </ul>');

}catch(exception2){alert(exception2.message);}
},

Because one of the actions added to this sample makes a call to a JavaScript function, you also need to add the JavaScript function called customAction as shown in the following example. See the attached personTagUI.js file for the complete code modifications.

customAction: function() {
alert('test');
return;
}

After you have completed these changes, you need to clear the browser cache and refresh the Web page in order to view the changes.

When you click "View LinkedIn Profile" information similar to that shown in the following figure displays.

LinkedIn

You can edit the public LinkedIn Web address so that it matches the Lotus Connections UID that is accessed using person.uid (for example, FAdams in this example). To modify the public LinkedIn Web Address, follow these steps:

1. Go to http://www.linkedin.com.
2. Click Accounts -& Settings -> Public Profile -> Public Profile URL.
3. Edit the Public Profile Web address to match the Lotus Connections UID as shown in the following figure (for example, http://www.linkedin.com/in/).

Edit LinkedIn Public Profile URL

After you configure LinkedIn to use a public profile Web address, you can use the Web address that we include in the previous code example.

When you click the My Facebook action button, information similar to that shown in the following figure displays. It performs a search of the passed in parameter, which should match the searchable parameter in Facebook.

Facebook

The following figure displays how to initiate a Skype call by adding the "Call me" feature as one of the action buttons in the business card. See the previous code example that we include in this topic for details about how to add this action.

Skype

The following figure shows the result of the custom JavaScript call. This JavaScript function is very simple; however, it demonstrates the steps that are necessary to integrate with real-world Web applications.

Custom JavaScript call

(Edited by DW)