$(document).ready(function() {
    
    // an array to store the height of each list item
    var items = new Array();
    var items_length;
    var item_el = '#activity-list ul li'; // the item element
    var item_el_parent = '#activity-list ul'; // the container ul
    var counter = 0;
    var fake_items;
    
    // for each of the items in the activity list 
    $.each($(item_el), function(){
        // add the items height plus the amount of padding to the array
        items.push($(this).height() + 20);
    });
    
    // get the length of the array
    items_length = items.length;
    
    // get the current items in the list and then add them onto the bottom of the current list
    // makes it look like the list doesn't end  
    fake_items = $(item_el_parent).html();
    $(item_el_parent).append(fake_items);
    
    
    // scroll all the list items relative to the size passed through the function
    function scrollList(size)
    {
        $(item_el).animate({
            top: '-='+size        
        }, 1000);
    }
    
    function resetList()
    {
        $(item_el).animate({
            top: 0        
        }, 1000);    
    }
    
    // create a loop 
    setInterval(function() {
        
        // if the counter has reached the length of the arrary stop
        if (counter == (items_length - 1))
        {
            //resetList();
            return false;
        }
        
        // run the scroll list function passing the height of the list item to the function
        scrollList(items[counter]);
        counter++;
        
    }, 3000);
});
