CODEWITHSUNDEEP
jqueryfacebookfacebook-graph-api
toddler dev
toddler dev

Reputation: 21

Jquery timer for Facebook status updates

I'm creating a control that gets the status updates from a fan page and then i have to display them one by one in a label. Now the Facebook part is working perfectly im just having issues with the timer. I get an array of status updates and i want to loop through the array and display a status update every 5 seconds. This is what i have so far:

$(document).ready(function () {
                    $.ajax({
                        //
                        url: 'https://graph.facebook.com/3fifteen/feed?limit=5&access_token={my access token}',
                        dataType: 'json',
                        success: function (response) {
                            for (var i = 0; i < response.data.length; i++) {                                
                                var message = response.data[i].message;
                                var temp = new Date(response.data[i].updated_time);                                
                                if (message) {
                                    $.timer(function () {
                                        $('#lblMessage').text(message);
                                    }, 5000, true);                                        
                                }
                            }
                        },
                        error: function () {
                            // error handling here
                            alert('There was an error loading Facebook data.');
                        }
                    });
                });

Any help will be greatly appreciated. Thanks

Upvotes: 0

Views: 231

Answers (1)

Oliboy50
Oliboy50

Reputation: 2721

Should do the trick :

$(document).ready(function () {
    $.ajax({
        //
        url: 'https://graph.facebook.com/3fifteen/feed?limit=5&access_token={my access token}',
        dataType: 'json',
        success: function (response) {
            for (var i = 0; i < response.data.length; i++) {
                var message = response.data[i].message;
                var temp = new Date(response.data[i].updated_time);
                if (message) {
                    displayMessageWithTimeout(message, i*5000);
                }
            }
        },
        error: function () {
            // error handling here
            alert('There was an error loading Facebook data.');
        }
    });

    function displayMessageWithTimeout(message, timer) {
        setTimeout(function () {
            $('#lblMessage').text(message);
        }, timer);
    }
});

EDIT (with loop)

$(document).ready(function () {
    $.ajax({
        //
        url: 'https://graph.facebook.com/3fifteen/feed?limit=5&access_token={my access token}',
        dataType: 'json',
        success: function (response) {
            var messagesArray = new Array();
            for (var i = 0; i < response.data.length; i++) {
                var message = response.data[i].message;
                var temp = new Date(response.data[i].updated_time);
                if (message) {
                    messagesArray.push(message);
                }
            }
            loopThroughArray(messagesArray); // Display each message once
            setInterval(function () {
                loopThroughArray(messagesArray);
            }, messagesArray.length * 5000); // Loop
        },
        error: function () {
            // error handling here
            alert('There was an error loading Facebook data.');
        }
    });

    function loopThroughArray(messagesArray) {
        for (var i = 0; i < messagesArray.length; i++) {
            displayMessageWithTimeout(messagesArray[i], i * 5000);
        }
    }

    function displayMessageWithTimeout(message, timer) {
        setTimeout(function () {
            $('#lblMessage').text(message);
        }, timer);
    }
});

Upvotes: 1

Related Questions