Search code examples
javascripthtmlfbconnect

Can't catch if person uses the like button


I tried many different ways of catching if a person hits the like button, but I cant seem to catch the click.

Here is the HTM:

<fb:login-button autologoutlink="true"></fb:login-button>
<div id="alertClick" class="fb-like" data-href="https://www.facebook.com/ProbandoRest" data-layout="standard" data-action="like" data-show-faces="true" data-share="false"></div>
<div class="fb-share-button" data-href="https://www.facebook.com/ProbandoRest" data-type="button_count"></div>
<div id="fb-root"></div>
<div
  class="fb-comments"
  data-href="https://www.facebook.com/ProbandoRest"
  data-numposts="5"
  data-colorscheme="light">
</div>

and here is the JS:

<script>
(function (d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&appId=699580430058671&version=v2.0";
    fjs.parentNode.insertBefore(js, fjs);
    console.log("comment_callback");
} (document, 'script', 'facebook-jssdk'));

$(document).ready(function () {
    console.log("comment_callback");
    FB.Event.subscribe('edge.create', page_like_or_unlike_callback);
    FB.Event.subscribe('edge.remove', page_like_or_unlike_callback);
    FB.Event.subscribe('auth.authResponseChange', auth_response_change_callback);
    FB.Event.subscribe('auth.statusChange', auth_status_change_callback);
});

$("#auth-logoutlink").click(function () { FB.logout(function () { window.location.reload(); }); });

$("#alertClick").click(function () {
    alert('Aqui se cuenta los shares que se hayan dado por usuario');
    console.log("alert click aqui");
});

FB.api('/me/likes/642246055864172', { limit: 1 }, function (r) {
    if (r.data.length == 1) {
        alert('ya le gustaba al usuario');
    } else {
        alert('Todavia no le gusta al usuario');
    }
});

window.fbAsyncInit = function () {
    FB.init({
        appId: '642246055864172',
        status: false,
        cookie: false,
        xfbml: true
    });

    //Additional
    FB.Event.subscribe('edge.create',
                    function (response) {
                        alert('LIKED: ' + response);
                        console.log("comment_callback");
                    }
             );
};

var comment_callback = function (response) {
    console.log("comment_callback");
    console.log(response);
    alert('Hola regreso el comment');
}

var page_like_or_unlike_callback = function (url, html_element) {
    console.log("page_like_or_unlike_callback");
    console.log(url);
    console.log(html_element);
    alert('Hola regreso el comment');
}
var auth_response_change_callback = function (response) {
    console.log("auth_response_change_callback");
    console.log(response);
}

var auth_status_change_callback = function (response) {
    console.log("auth_status_change_callback: " + response.status);
}

I tryed every way I saw in the documentation of the FB Connect. and some other answers here at stack overflow. Im programming in visual studio using C# and the errors Im getting in my FireFox Browser are:

ReferenceError: FB is not defined Info:44
Use of getAttributeNode() is deprecated. Use getAttribute() instead. 8C1Yby4wT_P.js:148
Empty string passed to getElementById().

I can't find why it's not catching when I hit the like button. I figured out the fb not defined is because in my app I still haven't set up the user_likes property, but I'm not sure.


Solution

  • Ok thanks to i-- I put everything into the fbAsyncInit and the functions outside.Here is the code:

    window.fbAsyncInit = function () {
    
        FB.Event.subscribe('edge.create', page_like_or_unlike_callback);
    
        FB.Event.subscribe('edge.remove', page_like_or_unlike_callback);
    
        FB.Event.subscribe('auth.authResponseChange', auth_response_change_callback);
    
        FB.Event.subscribe('auth.statusChange', auth_status_change_callback);
    
        FB.Event.subscribe('comment.create', comment_callback);
    
        FB.Event.subscribe('comment.remove', comment_callback);
    
    };
    
    var comment_callback = function (response) {
        console.log("comment_callback");
        console.log(response);
        alert('Hola regreso el comment');
    }
    
    var page_like_or_unlike_callback = function (url, html_element) {
        console.log("page_like_or_unlike_callback");
        console.log(url);
        console.log(html_element);
        alert('Hola Like o dejo de likear algo');
    }
    var auth_response_change_callback = function (response) {
        console.log("auth_response_change_callback");
        console.log(response);
    }
    
    var auth_status_change_callback = function (response) {
        console.log("auth_status_change_callback: " + response.status);
    }
    

    This solved the problem for me. I took out the rest just leaving the function(d,s,id). No I will proceed to add the things I need to catch in the window.fbAsyncInit