viernes, 11 de abril de 2014

listar amigos de facebook y enviarles un mensaje usando Javascript

pues vamos a empezar con algo que esta siendo muy usado y lo haremos
unicamente usando javascript

primeramente tenemos que crear una aplicacion en facebook
para obtener el API KEY

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script>
var fb = {
    config :{
        app_id : 'INGRESAR LA ID DE APLICACION',
        use_xfbml : true,
        extendPermissions : 'email, read_friendlists' ,
        locale : 'es_ES'
    },
  
    login : function (callback){
        FB.login(function(r) {
            if (r.status == 'connected') {
                FB.api('/me/permissions',function(perm){
                    fb.logged = true;
                    fb.perms = [];
                    for(i in perm.data[0]){
                        if (perm.data[0][i] == 1){
                            fb.perms.push(i);
                        }
                    }
                });  
                fb.getUser(callback);
            } else {
                fb.logged = false;
                fb.perms = [];
                callback();
            }
        },{scope:fb.config.extendPermissions});
        return false;
    },
    syncLogin : function (callback){
        if (!callback) callback = function(){};
        FB.getLoginStatus(function(r) {
            if (r.status == 'connected' ) {
                FB.api('/me/permissions',function(perm){
                    fb.logged = true;
                    fb.perms = [];
                    for(i in perm.data[0]){
                        if (perm.data[0][i] == 1){
                            fb.perms.push(i);
                        }
                    }
                });  
                fb.getUser(callback);
                return true;
            } else {
                fb.logged = false;
                callback();
                return false;
            }
        });
    },
    getUser : function(callback){
        FB.api('/me', function(r){
            var user = r;
            user.picture = "https://graph.facebook.com/"+user.id+"/picture?type=large";
            fb.user=user; callback(user);
        });
    },
    getFriends : function(callback){
        FB.api('/me/friends', function(r){
            callback( r.data );
        })
    },
    sendMessage : function(to, requestCallback){
        FB.ui({
            method:'send',
            to: to,
            link: 'INGRESE UNA URL VALIDA'
        }, requestCallback );
    },
    readyFuncs : [],
    ready: function(func){fb.readyFuncs.push(func)},
    launchReadyFuncs : function () {for(var i=0,l=fb.readyFuncs.length;i<l;i++){fb.readyFuncs[i]();};}
}


window.fbAsyncInit = function() {
  if (fb.config.app_id) FB.init({appId: fb.config.app_id, status: true, cookie: true, xfbml: fb.config.use_xfbml});
  fb.syncLogin(fb.launchReadyFuncs);
};

var oldload = window.onload;
window.onload = function() {
  var d = document.createElement('div'); d.id="fb-root"; document.getElementsByTagName('body')[0].appendChild(d);
  var e = document.createElement('script'); e.async = true; e.src = document.location.protocol + '//connect.facebook.net/'+fb.config.locale+'/all.js';
  document.getElementById('fb-root').appendChild(e);
  if (typeof oldload == 'function') oldload();
};

</script>

<script>

var user_fb = null;
var pubnub, channels_subscribe, channels_publish;
$(document).ready(function(){
setTimeout(function(){ loadinvitefb(); },2000);
});

function sendmsg(id_user){

      var URL_HIDDEN = 'INGRESE LA URL QUE USO EN LA CONFIGURACION DE LA API';
        fb.sendMessage(id_user, function(data){
            if(data){
                $.post(URL_HIDDEN+'SendInvite',{UserIdInvite: id_user, Type: 4 }, function(data){
                    channels_publish = ['channel_thebosslife_'+data.UserIdentify];
                    sendPush(channels_publish);
                }, 'json');
                //$this.parent().remove();
            }
        });
}
function loadinvitefb(){
        if(fb.ready){
            if(fb.logged){
                    fb.getFriends(function(data){
                                                    if(data != ''){
                                                        for( i in data){
                                                            $('#ul_notificacion').append('<li data-id="'+data[i].id+'">'+
                                                            '<span class="foto"><img src="https://graph.facebook.com/'+data[i].id+'/picture?width=72&height=72" /></span>'+
                                                            '<span class="nombre">'+data[i].name+'</span>'+
                                                            '<input type="button" class="btn_ok btn_invitar_facebook" onclick=\'sendmsg("'+data[i].id+'")\' value="Invitar" />'+
                                                            '<br style="clear: both;" /></li>');
                                                        }
                                                    }
                    });
            }else{
                fb.login(function(){
                    if(fb.logged){
                        fb.getFriends(function(data){
                            if(data != ''){
                                for(i in data){
                                    $('#ul_notificacion').append('<li data-id="'+data[i].id+'">'+
                                    '<span class="foto"><img src="https://graph.facebook.com/'+data[i].id+'/picture?width=72&height=72" /></span>'+
                                    '<span class="nombre">'+data[i].name+'</span>'+
                                    '<input type="button" class="btn_ok btn_invitar_facebook" onclick=\'sendmsg("'+data[i].id+'")\' value="Invitar" />'+
                                  
                                    '<br style="clear: both;" /></li>');
                                }
                            }
                        });
                    }
                });
            }
        }
}
</script>
<ul id="ul_notificacion">
  
</ul>




como pueden observar todo esta creado por javascript y jquery