$(document).ready(function(){
    // Add first and last classes to appropriate li
    $('li:first-child').addClass('first');
    $('li:last-child').addClass('last');


    var wrapper = $('<div class="wrapper">').css({
        'float': 'left',
        'clear': 'none'
    });
    $('#news-line div').css({
        'float': 'left',
        'clear': 'none'
    }).wrapAll(wrapper);

    var film = $('<div id="film">');
    film.css({
        width: '9000px',
        position: 'relative',
        height: film.parent().height()+'px'
    });
    $('.wrapper').wrapAll(film);

    $('.wrapper').clone().appendTo($('#film'));

    var interval = 50;
    var seed = 2;

    var scroller = setInterval(function(){
        scroll(seed);
    }, interval);
    $('#news-line').hover(function(){
        clearInterval(scroller);
    }, function(){
        scroller = setInterval(function(){
            scroll(seed);
        }, interval);
    })
});

function scroll(seed) {
    var film = $('#film');
    var wrapperWidth = film.children(':first').width();
    var offset = parseInt(film.css('left'));
    
    if (Math.abs(offset) > wrapperWidth) {
        offset = 0;
    }
    offset -= seed;

    film.css({
        'left': offset + 'px'
        });
}