$(document).ready( function() {
	
	$('a.lightbox').lightBox({
		imageLoading: '/js/jquery/lightbox/images/lightbox-ico-loading.gif',
		imageBtnClose: '/js/jquery/lightbox/images/lightbox-btn-close.gif'
	});
	
	$('#slideshow').empty();
	
	var gallery = $('#thumbs').galleriffic({
        delay:                     3000, // in milliseconds
        numThumbs:                 5, // The number of thumbnails to show page
        preloadAhead:              5, // Set to -1 to preload all images
        enableTopPager:            false,
        enableBottomPager:         false,
        maxPagesToShow:            7,  // The maximum number of pages to display in either the top or bottom pager
        imageContainerSel:         '#slideshow', // The CSS selector for the element within which the main slideshow image should be rendered
        controlsContainerSel:      '.work-img .controls', // The CSS selector for the element within which the slideshow controls should be rendered
        captionContainerSel:       '#caption', // The CSS selector for the element within which the captions should be rendered
        loadingContainerSel:       '', // The CSS selector for the element within which should be shown when an image is loading
        renderSSControls:          false, // Specifies whether the slideshow's Play and Pause links should be rendered
        renderNavControls:         true, // Specifies whether the slideshow's Next and Previous links should be rendered
        playLinkText:              'Play',
        pauseLinkText:             'Pause',
        prevLinkText:              '',
        nextLinkText:              '',
        nextPageLinkText:          'Next ›',
        prevPageLinkText:          '‹ Prev',
        enableHistory:             false, // Specifies whether the url's hash and the browser's history cache should update when the current slideshow image changes
        enableKeyboardNavigation:  false, // Specifies whether keyboard navigation is enabled
        autoStart:                 false, // Specifies whether the slideshow should be playing or paused when the page first loads
        syncTransitions:           false, // Specifies whether the out and in transitions occur simultaneously or distinctly
        defaultTransitionDuration: 1000, // If using the default transitions, specifies the duration of the transitions
        onSlideChange:             function( prevIndex, nextIndex ) {
        	$('#slideshow').empty();
        	
        	// code should be inserted here
        }, 
        onTransitionOut:           undefined, // accepts a delegate like such: function(slide, caption, isSync, callback) { ... }
        onTransitionIn:            undefined, // accepts a delegate like such: function(slide, caption, isSync) { ... }
        onPageTransitionOut:       function(callback) {
			this.fadeTo('fast', 0.0, callback);
		},
        onPageTransitionIn:        function() {
			var prevPageLink = this.find('a.prev').css('display', 'none');
			var nextPageLink = this.find('a.next').css('display', 'none');
			
			// Show appropriate next / prev page links
			if (this.displayedPage > 0)
				prevPageLink.css('display', 'block');

			var lastPage = this.getNumPages() - 1;
			if (this.displayedPage < lastPage)
				nextPageLink.css('display', 'block');

			this.fadeTo('fast', 1.0);
		},
        onImageAdded:              undefined, // accepts a delegate like such: function(imageData, $li) { ... }
        onImageRemoved:            undefined  // accepts a delegate like such: function(imageData, $li) { ... }
	});

	gallery.find('a.prev').click(function(e) {
		gallery.previousPage();
		e.preventDefault();
	});

	gallery.find('a.next').click(function(e) {
		gallery.nextPage();
		e.preventDefault();
	});

	gallery.find('.controls').show();


	$('.work-img #thumbs').hide();
});