var delay = 6;
var slideshow =  null;

jQuery.timer = function() {
	clearTimeout(slideshow);
	slideshow = window.setTimeout(function(){
		$.galleria.next();
	}, delay * 1000);
};


$(document).ready(function(){

	// Initialize Accordion
	$("#accordion").accordion({ header: "h3" });
	
	
	// Make Banner clickable
	$("#assnbanner2cell img").click(function() {
		window.location = "/";
	});
	
	
	// Fade Banner in/out on hover
	$("#assnbanner2cell img").hover(
		function() {
			$("#assnbanner2cell").fadeTo('fast', 0.6);
		},
		function() {
			$("#assnbanner2cell").fadeTo('fast', 1.0);
		}
	);
	
	
/* Start Galleria & jCarousel
----------------------------------------------*/

	// Set thumbnail indexes
    $('#gallery li').each(function(idx) {
        $(this).data('index', (++idx));
    });

	// Start carousel
    $('#gallery').jcarousel({
        scroll: 5,
        initCallback: initCallbackFunction
    }).addClass("jcarousel-skin-tango");
    
	// Carousel Callback function
    function initCallbackFunction(carousel) {
        $('#img').bind('image-loaded',function() {
            var idx =  $('#gallery li.active').data('index') - 2;
            carousel.scroll(idx);
            return false;
        });
        
/*
		// hotkeys plugin: use arrows to control the gallery
        $(document).bind('keydown', 'right', function (evt){ $.galleria.next(); });
        $(document).bind('keydown', 'left', function (evt){ $.galleria.prev(); });
        $(document).bind('keydown', 'up', function (evt){ $('.jcarousel-next-horizontal').click(); return false; });
        $(document).bind('keydown', 'down', function (evt){ $('.jcarousel-prev-horizontal').click(); return false; });
*/
	};

    // Load and fade-in thumbnails
    $('#gallery li img').css('opacity', 0).each(function() {    
        if (this.complete || this.readyState == 'complete') { $(this).animate({'opacity': 1}, 300) } 
        else { $(this).load(function() { $(this).animate({'opacity': 1}, 300) }); }
    });

    // Start Galleria
    $('#gallery').galleria({

		insert: '#img',		// #img is the empty div which holds full size images
		history: true,		// enable history plugin
        
        // function fired when the image is displayed
        onImage: function(image, caption, thumb) {
			$.timer();
			image.hide().fadeIn(500);		// fade in the image
			thumb.parent().fadeTo(200, 1).siblings().fadeTo(200, 0.6);		// animate active thumbnail's opacity to 1, other list elements to 0.6
            
            // $('#img').data('currentIndex', $li.data('index')).trigger('image-loaded')
            
            $('#img').trigger('image-loaded').hover(
				function(){
					$('#img .caption').stop().animate({height: 50}, 250);
				},
				function(){
					$('#img .caption').stop().animate({height: 0}, 250) 
				});
        },
        
		// function similar to onImage, but fired when thumbnail is displayed
		onThumb: function(thumb) {
			var $li = thumb.parent();
			var opacity = $li.is('.active') ? 1 : 0.6;
            
            // hover effects for list elements
            $li.hover(
                function() {
					$li.fadeTo(200, 1);
				},
                function() {
					$li.not('.active').fadeTo(200, opacity);
				})
        }        
    }).find('li:first').addClass('active'); // display first image when Galleria is loaded
    
    // Hide initially, then FadeIn Slideshow
    $('#slideshow').hide()
	$('#slideshow').fadeIn();
    
	// Hide/Show Caption on Hover
    $('#img .caption').css('height', 0)
    $('#img').hover(
		function(){
   			$('#img .caption').stop().animate({height: 50}, 250);
		},
    	function(){
            $('#img .caption').stop().animate({height: 0}, 250); 
        }
    );

	// Clear & Start Timer 
	$.timer();
 





/*
	// Setup Carousel
	$('#gallery').jcarousel({
    	scroll: 5,
		initCallback: initCallbackFunction
	});
	 
	function initCallbackFunction(carousel) {
	 
	};
	*/


	
	/*// Start Slideshow
	Galleria.loadTheme('/associations/11125/js/galleria/themes/asid/galleria.asid.js');
	$('#gallery').galleria('asid', {
		height: 435
	});
	
	$('#gallery').hover(
		function(){
			$('#gallery .galleria-info').stop().animate( {height: 50 }, 250);
		},
		function(){
			$('#gallery .galleria-info').stop().animate( {height: 0 }, 250);
		}
	);
//	$('#gallery .galleria-info').stop().animate( { height: 0 }, 250);
	$('#gallery .galleria-info-text').click(function(){ return false });
	*/
	
	
	/*
	// OLD Slideshow function
	$('#gallery ul li').each(function(idx) {
        $(this).data('index', (++idx));
    });

    $('#gallery ul').jcarousel({
        scroll: 5,
        initCallback: initCallbackFunction
    })
    
    function initCallbackFunction(carousel) {
        $('#img').bind('image-loaded',function() {
            var idx =  $('#gallery ul li.active').data('index') - 2;
            
            carousel.scroll(idx);
            return false;
        });
        
        // hotkeys plugin: use arrows to control the gallery
        $(document).bind('keydown', 'right', function (evt){ j.galleria.next(); });
        $(document).bind('keydown', 'left', function (evt){ j.galleria.prev(); });
        $(document).bind('keydown', 'up', function (evt){ $('.jcarousel-next-horizontal').click(); return false; });
        $(document).bind('keydown', 'down', function (evt){ $('.jcarousel-prev-horizontal').click(); return false; });
    };

    // load and fade-in thumbnails
    $('#gallery ul li img').css('opacity', 0).each(function() {    
        if (this.complete || this.readyState == 'complete') { $(this).animate({'opacity': 1}, 300) } 
        else { $(this).load(function() { $(this).animate({'opacity': 1}, 300) }); }
    });

    
    $('#gallery ul').galleria({
        // #img is the empty div which holds full size images
        insert: '#img',
        
        // enable history plugin
        history: false,
        
        // function fired when the image is displayed
        onImage: function(image, caption, thumb) {        
            // fade in the image 
            image.hide().fadeIn(500);
            
            // animate active thumbnail's opacity to 1, other list elements to 0.6
            thumb.parent().fadeTo(200, 1).siblings().fadeTo(200, 0.6)
            
            // $('#img').data('currentIndex', jli.data('index')).trigger('image-loaded')
            
            $('#img')
                .trigger('image-loaded')
                .hover(
                    function(){ $('#img .caption').stop().animate({height: 50}, 250) },
                    function(){ 
                        if (!$('#show-caption').is(':checked')) {
                            $('#img .caption').stop().animate({height: 0}, 250) 
                        }
                    }
                );
        },
        
        // function similar to onImage, but fired when thumbnail is displayed
        onThumb: function(thumb) {
            var jli = thumb.parent(),
                opacity = jli.is('.active') ? 1 : 0.6;
            
            // hover effects for list elements
            jli.hover(
                function() { jli.fadeTo(200, 1); },
                function() { jli.not('.active').fadeTo(200, opacity); }
            )
        }        
    }).find('li:first').addClass('active') // display first image when Galleria is loaded
    
    $('#img .caption').css('height', 0)
    
    $('#slideshow').hide()
    
    // this one is for Firefox, which loves to leave fields checked after page refresh
    $('#toggle-slideshow, #show-caption').removeAttr('checked')
    
    $('#show-caption').change(function(){
    	if (this.checked) {
    		$('#img .caption').stop().animate({height: 50}, 250)
    	} else {
            $('#img .caption').stop().animate({height: 0}, 250)   
        }
    })

	// Start slideshow
	$("#slideshow").fadeIn()
	
	// set interval when slideshow is enabled
	window.setInterval(function(){
	    $.galleria.next()
	}, 6000);
	*/
	
	
});