Social Apps

Display a Drop-down List of Viewer’s Friends in Open Social

Complete example to Display a Drop-down List of Viewer’s Friends in Open Social

var dataReqObj;
var heading = ‘’;
var friends_html;
var TheFriends = new Array();
//function called initially in XML file, this makes data request
//for friend.
 
 
function init() {
    //Create Data Request
    dataReqObj = opensocial.newDataRequest();
    //create viewer request
    var viewerReq = dataReqObj.newFetchPersonRequest(opensocial.IdSpec.
    PersonId.VIEWER);
    dataReqObj.add(viewerReq, ‘viewer’);
    // create friends of viewer request
    var idspec = opensocial.newIdSpec({
        "userId": "VIEWER",
        "groupID": "FRIENDS"
    });
    viewerReq = dataReqObj.newFetchPeopleRequest(idspec);
    dataReqObj.add(viewerReq, ‘viewerFriends’);
    //Send Data Request
    dataReqObj.send(onLoadViewerResponse);
}
//Callback function to process Viewer data requested.
 
 
function onLoadViewerResponse(data) {
    var viewer;
    //retrieve data associated with viewer request.
    try {
        viewer = data.get(’viewer’).getData();
    } catch (err) {
        heading = ‘Error‘ + err.description;
        alert(heading);
    }
    //Set up html to return to display viewer basic info
    try {
        var thumb = viewer.getField(opensocial.Person.Field.THUMBNAIL_URL);
        var profile = viewer.getField(opensocial.Person.Field.PROFILE_URL);
        heading = heading + ‘ < a href = "’ + profile +’" > < img src = "’ + thumb +
‘" > < /a>’;
} catch(err){
heading = ‘Error ‘ + err.description;
alert(heading);}
document.getElementById(’heading’).innerHTML = heading;
/ / Get Friends Information
        var viewer_friends = data.get(’viewerFriends’).getData();
        friends_html = ‘Your Friend,
        ‘;
        friends_html = friends_html + ‘ < select id = select_friend
        onchange = "getFriendStatus();" > ’;
        viewer_friends.each(function (person) {
            friends_html = friends_html + ‘ < option value = ’ + person.getId() + ‘ > ’ + person.getDisplayName() + ‘ < /option>’;
TheFriends[person.getId()] = person;
});
friends_html = friends_html + ‘</select > ’;
            document.getElementById(’friends’).innerHTML = friends_html;
        }

Request and Display Basic Viewer Data in Open Social

Step 1. Request data:
a. Create DataRequest object by calling opensocial.newDataRequest.
b. For each request you wish to make, create it using one of the opensocial.new* methods.
c. For each piece of data you want to request, add a request via DataRequest.add(request).
d. Make a request by registering the callback function, DataRequest.send(callback).

Step 2. Create a callback function to receive data:
a. Once a container gets the request and it is processed, the callback function will be executed. It will be passed the opensocial.DataResponse object that contains the response data of the processed request. In the following code example, the DataResponse object is received as a parameter to the callback function, and is called dataResponse:

function callback(dataResponse) {
//process the response data
}

Complete Example:

var dataReqObj;
var heading = ‘’;
//function called initially in XML file, this makes data request
//for viewer
function init() {
    //Create Data Request
    dataReqObj = opensocial.newDataRequest();
    //depending of version of OpenSocial, viewer reference changes
    var viewerReq = dataReqObj.newFetchPersonRequest
    ( opensocial.IdSpec.PersonId.VIEWER);
    dataReqObj.add(viewerReq, ‘viewer’);
    //Send Data Request
    dataReqObj.send(onLoadViewerResponse);
}
//Callback function to process Viewer data requested.
function onLoadViewerResponse(data) {
    var viewer;
    //retrieve data associated with viewer request.
    try{
        viewer = data.get(’viewer’).getData();
        }catch(err){
        heading = ‘Error ‘ + err.description;
    alert (heading);}
    //Setup html to return to display viewer basic info
    try{
        heading = ‘Hello, ‘ + viewer.getDisplayName();
        var thumb =
        viewer.getField(opensocial.Person.Field.THUMBNAIL_URL);
        var profile =
        viewer.getField(opensocial.Person.Field.PROFILE_URL);
        heading = heading + ‘<a href="’ + profile +’">&lt;img src="’
        + thumb
        + ‘"&gt;</a>’;
        } catch(err){
        heading = ‘Error ‘ + err.description;
    alert(heading);}
    //Display results inside XML document at the div
    //element with id heading
    document.getElementById(’heading’).innerHTML = heading;
}

Latest Tutorials & Code Snippets

Reference Guides

Social Apps

Latest Tutorials & Code Snippets

Reference Guides

Popular Tags