$(document).ready(function(){
    
    $("div.project").each(function (i) {
        $("ul.screennav", this).attr("id", function (arr) {
        	return "screennav_" + i;
        });
		$("ul.screennav", this).show();
       
		$(".projectimage", this).attr("id", function (arr) {
         	 return "slideshow_" + i;
        })
    });

    $(".projectimage").each(function (i) {
		$(this).cycle({ 
    		fx:     'fade', 
    		speed:  'fast', 
    		timeout: 0, 
    		pager:  '#screennav_'+i,
    		// callback fn that creates a thumbnail to use as pager anchor 
    		pagerAnchorBuilder: function(idx, slide) { 
        		return '<li><a href="' + slide.src + '">&nbsp;</a></li>'; 
    		} 
		});
    });
	$.fn.cycle.updateActivePagerLink = function(pager, currSlide) {
		$(pager).find('a.activeSlide').addClass('visitedSlide');
		$(pager).find('a').removeClass('activeSlide').filter('a:eq('+currSlide+')').addClass('activeSlide');
	};
	
	$(".projectimage img").lazyload({
		threshold : 100,
		effect : "fadeIn" 
	});
			
});