Wednesday, May 15, 2013

Facebook Login and friend list - Post on User Wall and Friends Wall javascript SDK

 Facebook Login and friend list - Post on User Wall and Friends Wall javascript SDK

<html>
<head>
    <title>Facebook Get Logged in User Details UserName,Email,Profile Image</title>

    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>

</head>
<body>

<script>

// publish to friend wall
function postonwall(src){
         FB.init({
            appId:'Application ID', cookie:true,
            status:true, xfbml:true
         });
var str=src;
var n=str.split("/");

         FB.ui({ method:'feed',from:'User ID',to:n[3] ,
            message: ''},

function(response) {
    if (response && response.post_id) {
     
    } else {
     
    }
  }
);
}
 

</script>


 <script>

 // Post on User Timeline

 
      FB.init({appId: "Application ID", status: true, cookie: true});

      function postToFeed() {

        // calling the API ...
        var obj = {
          method: 'feed',
          redirect_uri: 'http://localhost',
          link: 'https://developers.facebook.com/docs/reference/dialogs/',
          picture: 'http://fbrell.com/f8.jpg',
          name: 'Facebook Dialogs',
          caption: 'Reference Documentation',
          description: 'Using Dialogs to interact with users.'
        };

        function callback(response) {
          document.getElementById('msg').innerHTML = "Post ID: " + response['post_id'];
        }

        FB.ui(obj, callback);
      }
  
    </script>


<script>
function publish_to_wall(){
FB.ui({ method: 'stream.publish', message: 'This is a simple post to appshack.tv' });
}
</script>

    <script>
// Load the SDK Asynchronously
(function(d) {
var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
if (d.getElementById(id)) { return; }
js = d.createElement('script'); js.id = id; js.async = true;
js.src = "//connect.facebook.net/en_US/all.js";
ref.parentNode.insertBefore(js, ref);
} (document));

// Init the SDK upon load
window.fbAsyncInit = function() {
FB.init({
appId: 'Application ID', // App ID
channelUrl: '//' + window.location.hostname + '/channel', // Path to your Channel File
status: true, // check login status
cookie: true, // enable cookies to allow the server to access the session
xfbml: true  // parse XFBML
});

// listen for and handle auth.statusChange events
FB.Event.subscribe('auth.statusChange', function(response) {
if (response.authResponse) {
// user has auth'd your app and is logged into Facebook
var uid = "http://graph.facebook.com/" + response.authResponse.userID + "/picture";
        FB.api('/me', function(me)
        {
        document.getElementById('Id').innerHTML = me.id;
        document.getElementById('auth-displayname').innerHTML = me.name;
        document.getElementById('Email').innerHTML = me.email;
        document.getElementById('link').innerHTML = me.link;
        document.getElementById('locale').innerHTML=me.locale;
        document.getElementById('DOB').innerHTML = me.birthday;
        document.getElementById('profileImg').src = uid;
        document.getElementById('Gender').innerHTML = me.gender;      
      
      
      
       FB.api('/me/friends', function(response)
       {     
        for(i=0;i<response.data.length;i++)
            {
                $(document.createElement("img")).attr({ src: 'https://graph.facebook.com/'+response.data[i].id+'/picture', title: response.data[i].name,onClick:'postonwall(this.src)'}).appendTo('.divContainer');
            }
        });
      
      
        })
        document.getElementById('auth-loggedout').style.display = 'none';
        document.getElementById('auth-loggedin').style.display = 'block';
        }
        else
        {
            // user has not auth'd your app, or is not logged into Facebook
            document.getElementById('auth-loggedout').style.display = 'block';
            document.getElementById('auth-loggedin').style.display = 'none';
        }});
        $("#auth-logoutlink").click(function() { FB.logout(function() { window.location.reload(); }); });
        }
    
    </script>

    <h1>
        Facebook Login Authentication Example</h1>
    <div id="auth-status">
        <div id="auth-loggedout">
            <div class="fb-login-button" autologoutlink="true" scope="email,user_checkins">
                Login with Facebook</div>
        </div>
        <div id="auth-loggedin" style="display: none; border: solid 1px #000; width: 231px;
            height: auto;">
            <img id="profileImg" width="100px" height="100px" onClick="postToFeed()"  /><a href="#" id="auth-logoutlink"
                style="float: right; font-weight: bold; text-decoration: none;">logout</a>
            <br />
            <b>User-ID :</b><span id="Id"></span>
            <br />
            <b>Name :</b><span id="auth-displayname"></span><br />
            <b>Gender: </b><span id="Gender"></span>
            <br />
            <b>locale: </b><span id="locale"></span>
            <br />
            Your Date of Birth :, <span id="DOB"></span><br/>
            <br />
            <b>Email: </b><span id="Email"></span>
            <br />
            <b>link: </b><span id="link"></span>
            <br />
        </div>
        <div class="divContainer">              
        </div>
    </div>
</body>
</html>

2 comments: