jQuery(document).ready(function($)
{
	//init modal dialog window
	$("#dialog-modal").dialog({
			autoOpen: false,
			height: 730,
			width: 800,
			modal: true
	});
	
	//ajax in gallery content and launch dialog-modal
	$('a.gallerifficModal').ajaxLink({
		target: "#dialog-modal"									   
	}).click(function()
	{
		$('#dialog-modal').html('').dialog('open').css("min-height","640px");
	});
	
	//liveQuery
	$('#galleryModal').livequery(function(){ 
    	 // We only want these styles applied when javascript is enabled
		$('#galleryModal div.navigation').css({'width' : '300px', 'float' : 'left'});
		$('#galleryModal div.content').css('display', 'block');
	
		// Initially set opacity on thumbs and add
		// additional styling for hover effect on thumbs
		
		var onMouseOutOpacity = 0.67;
		
		$('#galleryModal .galleriffic-nav ul.thumbs li').opacityrollover({
			mouseOutOpacity:   onMouseOutOpacity,
			mouseOverOpacity:  1.0,
			fadeSpeed:         'fast',
			exemptionSelector: '.selected'
		});
					
		// Initialize Advanced Galleriffic Gallery
		var gallery = $('#galleryModal .galleriffic-nav').galleriffic({
			delay:                     2500,
			numThumbs:                 12,
			preloadAhead:              10,
			enableTopPager:            true,
			enableBottomPager:         true,
			maxPagesToShow:            5,
			imageContainerSel:         '#galleryModal .slideshow',
			controlsContainerSel:      '#galleryModal .controls',
			captionContainerSel:       '#galleryModal .caption-container',
			loadingContainerSel:       '#galleryModal .loader',
			renderSSControls:          false,
			renderNavControls:         true,
			playLinkText:              'Play Slideshow',
			pauseLinkText:             'Pause Slideshow',
			prevLinkText:              '‹',
			nextLinkText:              '›',
			nextPageLinkText:          'next',
			prevPageLinkText:          'prev',
			enableHistory:             false,
			autoStart:                 false,
			syncTransitions:           true,
			defaultTransitionDuration: 900,
			onSlideChange:             function(prevIndex, nextIndex)
			{
				// 'this' refers to the gallery, which is an extension of $('#thumbs')
				this.find('ul.thumbs').children().eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end().eq(nextIndex).fadeTo('fast', 1.0);
			},
			onPageTransitionOut:       function(callback)
			{
				this.fadeTo('fast', 0.0, callback);
			},
			onPageTransitionIn:        function()
			{
				this.fadeTo('fast', 1.0);
			}
		});
    });

});