Working with user profile from flex application

I built this sample portlet to demonstrate how you can retrieve the User Profile attribute from the Adobe Flex application. You can download the sample application from here

1. UserProfileFlex.zip


2. UserProfileFlexPortlet.war

This is how the User Profile Flex Portlet application looks like



When you click on the Print User Profile, the flex application will get the pre defined set of user preference attributes and print them in the Grid format. I followed these steps to build the sample application

• First i did develop UserProfileFlexPortlet.java like this
  
public class UserProfileFlexPortlet extends GenericPortlet{
protected void doView(RenderRequest request, RenderResponse response)
throws PortletException, IOException {
System.out.println("Entering UserProfileFlexPortlet.doView()");
response.setContentType("text/html");
getPortletContext().getRequestDispatcher("/userprofile.jsp").include(request, response);
System.out.println("Exiting UserProfileFlexPortlet.doView()");
}
}

  This portlet is pretty simple, only thing that it does is to forward control to userprofile.jsp
  


• This is how my userprofile.jsp file looks like
  
H<%@page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1" session="false"%>
<%@taglib uri="http://java.sun.com/portlet" prefix="portlet"%>
<%@taglib uri="http://www.ibm.com/xmlns/prod/websphere/portal/v6.1/portlet-client-model" prefix="portlet-client-model"%>
<%@taglib uri="http://java.sun.com/portlet" prefix="portletx"%>
<portlet-client-model:init>
<portlet-client-model:require module="ibm.portal.xml.*" />
<portlet-client-model:require module="ibm.portal.portlet.*" />
</portlet-client-model:init>
<script language="javascript">
function printUserProfile(){
console.log("Entering printUserProfile()");
var _portletWindow = new ibm.portal.portlet.PortletWindow("<%=portletWindowID%>");
_portletWindow.getUserProfile(printUserProfileCallback);
console.log("Exiting printUserProfile()");
}
function printUserProfileCallback(portletWindow, status, userProfile){
if (status==ibm.portal.portlet.PortletWindow.STATUS_OK) {
var attributeList = ["cn","uid", "mobile","displayName","seeAlso","postalAddress","telephoneNumber","jpegPhoto","departmentNumber","viewIdentifiers","secretary","businessCategory","l","homePostalAddress","c","partyRoles","sn","pager","groups","businessAddress","carLinces","ibm-jobTitle","st","description","homeAddress","initials","postalCode","roomNumbr","title","stateOrProvinceName","givenName","children","street","manager","facsimileTelephoneNumber","countryName","localityName","uid","cn" ];
var userProfileList = new Array();
for( var i = 0; i < attributeList.length; i++){
userProfileList[i] = {"name":attributeList[i],"values":userProfile.getAttribute(attributeList[i])};
}
console.log("Returning User Profile array " + userProfileList);
getFlexApp('UserProfile').displayUserProfile(userProfileList);
}else{
console.error("Error in getting user profile");
}
}
function getFlexApp(appName){
if (navigator.appName.indexOf ("Microsoft") !=-1){
return window[appName];
}
else{
return document[appName];
}
}

</script>
<portlet:defineObjects />
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
id="UserProfile" width="750" height="500"
codebase="http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
<param name="movie" value='<%=renderResponse.encodeURL(renderRequest.getContextPath()+ "/UserProfileFlex.swf")%>' />
<embed src="<%=renderResponse.encodeURL(renderRequest.getContextPath() + "/UserProfileFlex.swf")%>"
width="750" height="500" name="UserProfile" align="middle" play="true" loop="false" quality="high"
type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer">
</embed>
</object>

  Most of the code in the userprofile.jsp is same as that of Client Side User Profile manipulation with the difference that in the printUserProfileCallback method i am passing user profile attributes in the form of JavaScript Array to the displayUserProfile method in the Flex application.


• This is how my UserProfileFlex.mxml file looks like
  
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" initialize="initApp()">
<mx:Script>
<![CDATA[
import flash.external.*;
import mx.controls.Alert;

public function initApp():void
{
if (ExternalInterface.available){
ExternalInterface.addCallback("displayUserProfile", displayUserProfile);
}
}
//Event handler for handling button click
public function getUserProfile():void
{
if (ExternalInterface.available) {
// Make call to the printPreference method
ExternalInterface.call("printUserProfile");
} else
Alert.show("Error sending data!");
}
public function displayUserProfile(obj:Object):void
{
dgUserProfile.dataProvider = obj;
}
]]>
</mx:Script>
<mx:Panel id="pnlMain" width="600" height="324" layout="absolute" title="User Profile Example">
<mx:Button label="Print User Profile" y= "37" id="resourceUrl" click="getUserProfile()" x="482"/>
<mx:DataGrid id="dgUserProfile" x="10" y="10" width="464" height="271">
<mx:columns>
<mx:DataGridColumn headerText="Name" dataField="name"/>
<mx:DataGridColumn headerText="Values" dataField="values"/>
</mx:columns>
</mx:DataGrid>
</mx:Panel>
</mx:Application>

  When user clicks on the Print User Profile button the control gets passed to the getUserProfile method which is using the ExternalInterface.call for calling printUserProfile JavaScript method.
  
  Once the UserProfile attributes are retrieved the JavaScript method is passing the control back to the displayUserProfile method, which is setting that Array as data source for the grid