// JQUERY IMAGE GALLERY
//
// jquery.gallery.js V2.0
// http://www.jamie-connolly.co.uk/index.php/blog/javascript/jquery-gallery/
//
// ORIGINAL AUTHOR WEBSITE
// http://enhance.qd-creative.co.uk/2008/07/12/an-image-gallery/
//

var hypes = [];

jQuery.fn.getHyper = function() {
    var hypers = this;

    jQuery(hypers).each(function(i){
        hypes[i] = [this.href];
    })
}

jQuery.fn.gallery = function(sSpeed, tSpeed, showList, autoStart, tLocation, styling) {
		var gallery = this;
		var img = [];
		var currentImage = 0;
		var speed = 5000; if(sSpeed) speed = (parseInt(sSpeed,10)); // GET SPEED
		var transitionSpeed = 400; if(tSpeed) transitionSpeed = (parseInt(tSpeed,10)); // GET SPEED
		var take = 0;
		var slideShowActive = false; // DETERMINES WHEN THE SLIDE SHOW IS ACTIVELY RUNNING
		var firstTime = true; // MAKE SURE FIRST FADEOUT DOESNT OCCUR
		var target = 'body'; if(tLocation) target = tLocation; // GET THE TARGET LOCATION

		if(autoStart == true){slideShowActive = true;}

		// THIS IS THE OUTPUT OF THE GALLERY | ITEMS WILL BE LATER PLACED IN BETWEEN THE <ul></ul> SECTION
		//var galleryStructure = '<div id="img-gallery"><a class="img-hyp" href=""><img style="display:none"/></a><ul></ul><div id="img-description"></div></div>';

		var started = false;
		jQuery(gallery).each(function(i){
			jQuery(this).hide();
			img[i] = [this.src,this.alt,jQuery(this).attr('longdesc')]; // GET IMAGE

			// ONCE IMAGE LOADED IN REMOVE IT FROM PAGE
			this.onload = function(){
				jQuery(this).remove();
			}

			if (i==0) {
				// ON LAST IMAGE START
				gallery[gallery.length-1].onload = function(){
					jQuery(this).remove();
					start();
					started = true;
				}

				setTimeout(function(){if(!started) start();},2000)
			}
		})

		// ###################################################
		// START FUNCTION
		// ###################################################
		function start(){
			jQuery('.gallery').remove();// REMOVE ORIGINAL GALLERY
			//jQuery(target).prepend(galleryStructure); // DESTINATION OF GALLERY (YOU CAN CHANGE THIS)

			// THIS WILL OUTPUT THE PLAY/STOP BUTTON AND THE IMAGE LIST (PROVIDED THAT THERE IS MORE THAN ONE IMAGE)
			if(showList == true){
				if(gallery.length > 1){
					// ADD THE PLAY/STOP BUTTON
					jQuery('#img-gallery ul').append('<li><a href="#" id="playstop" title="Play/Stop SlideShow">&nbsp;</a></li>');

					// ADD IN LINKS
					jQuery(img).each(function(i){
						jQuery('#img-gallery ul').append('<li><a href="#img' + (i + 1) + '">' + (i + 1) + '</a></li>');
					})
				}
			}


			jQuery('#img-gallery ul').hide(); // HIDE LIST

			// ###################################################
			// IF LINK IS CLICKED (NOT PLAY/STOP)
			// ###################################################
			jQuery('#img-gallery ul a:not(#playstop)').click(function(){

				var imgToLoad = jQuery(this).attr('href'); // GET LINK HREF
				imgToLoad = imgToLoad.split('#'); // SPLIT HREF TO GET IMAGE NUMBER
				imgToLoad = parseInt(imgToLoad[1].substr(3)) - 1; // RETRIEVE IMAGE NUMBER
				changeImage(imgToLoad); // CHANGE THE IMAGE TO THE SPECIFIED NUMBER
				currentImage = imgToLoad + 1; // SETUP SLIDESHOW FOR NEXT IMAGE

				if(slideShowActive == true) jQuery('#img-gallery ul a#playstop').click(); // TRIES TO STOP SLIDESHOW WHEN PRESSED
				return false;
			})

			// ###################################################
			// CALLED WHEN PLAY/STOP LINK IS CLICKED # TOGGLE(STOP, PLAY)
			// ###################################################
			jQuery('#img-gallery ul a#playstop').toggle(
			   	function(){
					jQuery(this).removeClass('stop');
					jQuery(this).addClass('play'); // CHANGE PLAY/STOP CLASS
					stopSlideShow();
					return false;
			   	},
				function(){
					jQuery(this).removeClass('play');
					jQuery(this).addClass('stop'); // CHANGE PLAY/STOP CLASS
					startSlideShow();
					return false;
				}
			);

			// ###################################################
			// START SLIDE SHOW IF AUTO START ENABLED
			// ###################################################
			if(slideShowActive == true){
				if(gallery.length > 1){
				   jQuery('#img-gallery ul a#playstop').addClass('stop');
				   startSlideShow();
				}
			}else{
				jQuery('#img-gallery ul a#playstop').addClass('play');
				changeImage(0); // LOAD FIRST IMAGE IF AUTO START OFF
				currentImage = 1; // OFFSET CURRENT IMAGE IN ORDER TO SHOW NEXT IMAGE ON PLAY
				jQuery('#img-gallery ul a#playstop').click(); // OFFSET TOGGLE SO NEXT CLICK TURNS GALLERY ON
			}

			// ###################################################
			// CHNAGE IMAGE FUNCTION
			// ###################################################
			function changeImage(n, callback){
				currentImage = n;

				// IF FIRST START, DO NOT FADE OUT FIRST, JUST START FROM SWITCH OVER
				if(firstTime == true){
					firstTime = false;
					switchOver();
				}else{
					fadeOutAll();
				}

				// FADE OUT ALL ITEMS
				function fadeOutAll(){
					jQuery('#img-gallery #img-description').fadeOut(transitionSpeed); // FADE OUT DESCRIPTION
					jQuery('#img-gallery ul').fadeOut(transitionSpeed); // FADE OUT LIST
					jQuery('#img-gallery img').fadeOut(transitionSpeed, switchOver); // GOT TO SWITCH OVER AFTER IMAGE HAS FADED OUT
				}

				// CHNAGE THE IMAGE ATTRIBUTES
				function switchOver(){

					jQuery('#img-gallery ul a').removeClass('active');

					var originalWidth = jQuery('#img-gallery img').width(); // GET WIDTH OF CURRENT IMAGE TO DETERMINE IF LIST LINK FADES IN OR OUT
					var originalHeight = jQuery('#img-gallery img').height(); // GET WIDTH OF CURRENT IMAGE TO DETERMINE IF LIST LINK FADES IN OR OUT

					jQuery('#img-gallery img').attr('src', img[n][0]).attr('alt', img[n][1]).attr('title', img[n][1]); // REPLACE IMAGE
					jQuery('#img-gallery a.img-hyp').attr('href', hypes[n]); // REPLACE IMAGE LINK
					jQuery('#img-gallery #img-description').html('<p>' + img[n][2] + '</p>'); // REPLACE DESCRIPTION

					var width = jQuery('#img-gallery img').width(); // GET WIDTH OF NEW IMAGE
					var height = jQuery('#img-gallery img').height(); // GET WIDTH OF OLD IMAGE

					if(originalWidth == width && originalHeight == height){
						fadeInAll();
					}else{
						jQuery('#img-gallery').animate({width: width+28,height: height+52}, transitionSpeed, fadeInAll);
					}

				}

				// FADE IN ALL ITEMS
				function fadeInAll(){
					jQuery('#img-gallery #img-description').fadeIn(transitionSpeed); // FADE IN DESCRIPTION
					jQuery('#img-gallery img').fadeIn(transitionSpeed); // FADE IN IMAGE
					jQuery('#img-gallery ul').fadeIn(transitionSpeed); // FADE IN GALLERY LIST

					jQuery('#img-gallery ul a:eq(' + (n + 1 - take) + ')').addClass('active');
					if (callback) callback();
					if (styling) styling();
				}

				// IF NO DESCRIPTION THEN HIDE DESCRIPTION SECTION
				if (img[n][2] == undefined) {
					jQuery('#img-gallery #img-description').hide();
				}else {
					jQuery('#img-gallery #img-description').show();
				}
			}

			// ###################################################
			// START SLIDE SHOW USING currentImage
			// ###################################################
			function startSlideShow(){
				if (currentImage == gallery.length) {currentImage = 0;}
				window['galleryTimeout'] = setTimeout(function(){startSlideShow()}, speed)
				changeImage(currentImage, function(){eval(galleryTimeout);});
				currentImage++;
				slideShowActive = true;
			}

			// ###################################################
			// STOP SLIDE SHOW
			// ###################################################
			function stopSlideShow(){
				slideShowActive = false;
				clearTimeout(eval(galleryTimeout));
			}
		}
}