var photoSlider = function (data, initialIndex) {
    var $container = $('#photos');
    var $photo = $('#photo');
    var $title = $('.title', $container);
    var $caption = $('.caption', $container);
    var $thumbnails = $('.thumbnails', $container);
    var slideshowInterval;

    if (!data || !data.photos) return;
    var photos = data.photos;

    var updateDisplay = function (photo) {
        $photo.empty().append($('<a href="' + photo.link + '"><img src="' + photo.src + '" alt="' + photo.title + '" width="' + photo.w + '" height="' + photo.h + '" /></a>'));
        $title.text(photo.title);
        $caption.html(htmlEncode(photo.caption, false, 0) + '<span class="link"><a href="' + photo.link + '">' + photo.linkText + '</a></span>');
    };

    $(photos).each(function (i, photo) {
        if (!photo) return; // HACK: IE
        var $thumbnail = $('<li><a href="' + photo.src + '"><img src="' + photo.thumbnail + '" alt="' + photo.title + '" width="' + photo.w + '" height="' + photo.h + '" /><span>' + photo.thumbnailTitle + '</span></a></li>').appendTo($thumbnails);
        var $anchor = $('a', $thumbnail);
        $anchor.data('photo', photo);
        $anchor.click(function () {
            $(this).closest('li').addClass('active').siblings().removeClass('active');
            updateDisplay(photo);
            if (slideshowInterval) clearInterval(slideshowInterval);
            return false;
        });
    });

    var $initial = $('a', $thumbnails).eq(initialIndex || 0);
    $initial.closest('li').addClass('active');
    updateDisplay($initial.data('photo'));

    slideshowInterval = setInterval(function () {
        var $active = $('li.active', $thumbnails);
        var $next = $active.next();
        if (!$next.length) $next = $active.siblings().first();

        $next.addClass('active').siblings().removeClass('active');
        updateDisplay($('a', $next).data('photo'));
    }, 8000);
};