var itemCount, totalCount;
var ondpos = 0;
var ondsz = 0;
$(document).ready(function () {
    $.getJSON("http://api.flickr.com/services/feeds/groups_pool.gne?id=1185720@N21&lang=en-us&format=json&jsoncallback=?", function (data) {
        $.each(data.items, function (i, item) {
            var img = '<a href="' + item.link + '" title="' + item.title + '"><img border="0" src="' + item.media.m.replace(/_m/i, "_s") + '" alt="' + item.title + '" /></a>';
            var liItem = '<li class="featuredItem" style="float: left; width: 130px; padding: 16px 14px; height: 100px; position: relative; list-style: none;">' + img + '</li>';
            //var liItem = '<li class="featuredItem">' + img + '</li>';
            $("#featurelist").append(liItem);
        });
        var maxItems = 4; // number of images to be shown in the carousel
        $(".wrapper li").each(function (i) {
            if (i % maxItems == 0 && i >= maxItems) {
                $(".wrapper").append("<ul class='featurelist'></ul>");
            }
            $(".wrapper .featurelist").last().append(this);
        });
        $('.wrapper').cycle({
            fx: 'scrollHorz',
            speed: '600',
            timeout: 0,
            next: '#archiveNext',
            prev: '#archivePrev'

        });
        totalCount = data.items.length;
        itemCount = data.items.length / maxItems;
        ondsz = itemCount - 1;        
    });
    $("#archivePrev").hide();
    $("#archiveNext").click(function () { ondpos++; if (ondpos > 0) { $("#archivePrev").show(); } if (ondpos >= ondsz) { $(this).hide(); } });
    $("#archivePrev").click(function () { ondpos--; if (ondpos == ondsz) { $("#archiveNext").hide(); } if (ondpos != ondsz) { $("#archiveNext").show(); } if (ondpos <= 0) { $(this).hide(); $("#archiveNext").show(); } });
});
