Facebook JavaScript API: Get Facebookfriends name and pictures

By -

Add this coe to body element of your html file.....


<div id="findAllFriends">
    <div id="fb-root"></div>    
    <div class="fb_login_user_status">
        <a class="fb_button fb_button_medium">
            <span id="fb-auth" class="fb_button_text">Log In with Facebook</span>
        </a>
     </div>
     <div class="fbUser" id="user-info"></div
    <div id="friendslistFB" >
       <table id="fbFriends" width="100%" border="0" >
       </table>  
     </div>   
</div>


/**** Java Script code ********/

var facebookAppId='your facebook app id';
window.fbAsyncInit = function() {
  FB.init({ appId: facebookAppId, 
   status: true, 
   cookie: true,
   xfbml: true,
   oauth: true});
  
  function updateButton(response) {
    var button = document.getElementById('fb-auth');
    if (response.authResponse) {
       //user is already logged in and connected
       var userInfo = document.getElementById('user-info');
       FB.api('/me',{fields: 'name,id'}, function(response) {
           userInfo.innerHTML = response.name+" is connected";
           button.innerHTML = 'Logout';
           getFriends();
       });
       button.onclick = function() {
           FB.logout(function(response) {
                var userInfo = document.getElementById('user-info');
                userInfo.innerHTML="";   
               
      });
       };
    }else {
        //user is not connected to your app or logged out
        button.innerHTML = 'Log In with Facebook';
        button.onclick = function() {
           FB.login(function(response) {
         if(response.authResponse) {
                  FB.api('/me', function(response) {
                      var userInfo = document.getElementById('user-info');
                 userInfo.innerHTML = response.name+" is connected";
           });   
              }else {
                //user cancelled login or did not grant authorization
              }
           },{scope:'publish_stream'});  
      }
    }
  } // end of updateButton()


  // run once with current status and whenever the status changes
  FB.getLoginStatus(updateButton);
  FB.Event.subscribe('auth.statusChange', updateButton);
  
 };


(function() {
    var e = document.createElement('script'); e.async = true;
    e.src = document.location.protocol 
     + '//connect.facebook.net/en_US/all.js';
     document.getElementById('fb-root').appendChild(e);
 }());


var facebookFriendsIds=new Array();
var facebookFriendsName;


function getFriends() {
document.getElementById("friendslistFB").style.display="block";
var htmlcontent;

    FB.api('/me/friends', function(response) {
        if(response.data) {
        facebookFriendsIds=new Array();
        facebookFriendsName=new Array();
        
        var headerTable='<tr><td style="font-size: 14px;color:red">Facebook friends</td><td></td><td></td></tr>';
            $('#fbFriends').append(headerTable);
            $.each(response.data,function(index,friend) {
                 htmlcontent='<tr id=fb_'+friend.id+'><td><img height="30px" width="30px" src="https://graph.facebook.com/' + friend.id 
                 + '/picture" /></td>'
                 +'<td class="fb_friendsName">'+friend.name+'</td>'
                 +'<td><input type="checkbox" name="checkboxFB" id="checkboxFB" /></td></tr>';
                 facebookFriendsName.push(friend.name);
                 facebookFriendsIds.push(friend.id);
                $('#fbFriends').append(htmlcontent);


            });
            
           
        } else {
            alert("Error!");
        }
    });
    
}


Comments

Post a Comment

Popular posts from this blog

Struts 2 : Warning :No configuration found for the specified action: 'Login.action' in namespace: '/'

By -
No configuration found for the specified action: 'Login.action' in namespace: '/'''. Form action defaulting to 'action' attribute's literal value. Solution: To remove this warning you need to change following... See your struts.xml file what name you have specified... If you are using namespace / and your action name is 'Login' then  replace Login.action to Login as given below... <s:form action=" Login.action " method="post" >   Use below with namespace  1) <s:form action=" Login " method="post" namespace="/">   Or   2) <s:form action=" /Login " method="post" >   Now you will not get this warning.
Read more

Upload csv file at Google Cloud Storage using java

By -
First do all required pre requiste as per google doc https://cloud.google.com/appengine/docs/java/googlestorage/ Now see the sample code for a csv file uploader using latest api public String uploadFileUsingGCSClient(String csvDate, String fileName, String dirName,String bucketName) throws IOException {  // init the bucket access     GcsService gcsService = GcsServiceFactory.createGcsService(RetryParams.getDefaultInstance());     GcsFilename filename = new GcsFilename(bucketName+"/"+dirName, fileName);     GcsFileOptions fileOptions = new GcsFileOptions.Builder()    .mimeType("application/CSV")       .acl("public-read")    //.addUserMetadata("myfield1", "my field value")    .build();     GcsOutputChannel outputChannel = gcsService.createOrReplace(filename, fileOptions);          // write file using this st...
Read more

Read Images from a xlsx file using Apache POI

By -
This article is all about how to read and download images inside a file in xlsx format. We will use Apache POI using java. 1. Maven dependencies commons-logging-1.2.jar  commons-collections4-4.1.jar openxml4j-1.0-betapoi-3.16.jar poi-ooxml-3.16.jar poi-ooxml-schemas-3.16.jar xmlbeans-2.6.0.jar servlet-api 2. Sharing java code import java.io.File; import java.io.FileInputStream; import java.io.FileNotFoundException; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.util.ArrayList; import java.util.Iterator; import java.util.LinkedHashMap; import java.util.List; import java.util.Map; import org.apache.poi.ss.usermodel.PictureData; import org.apache.poi.xssf.usermodel.XSSFCell; import org.apache.poi.xssf.usermodel.XSSFDrawing; import org.apache.poi.xssf.usermodel.XSSFPicture; import org.apache.poi.xssf.usermodel.XSSFRow; import org.apache.poi.xssf.usermodel.XSSFShape; import org.apache.poi.xssf.usermodel.XSSFSheet; imp...
Read more