// redline-gallery.js
(function($) {
	
// Initialize variables
var vpanecount = 0;
var panecount = 0;


jQuery(document).ready(function() {
	
	var setID = window.location.href.split("#")[1];
	if (setID == undefined) {
		loadPhotoSets();
	}
	else {
		loadPhotoThumbs(setID);
	}
	
	loadVideoThumbs();
	
});


//////////// Load Photo Sets /////////////
function loadPhotoSets() {
	// Get photosets via AJAX
	jQuery.post(
		'/wp-content/themes/redline/gallery.inc.php',
		{type: "photos"},
		function(data) {
			panecount = data.panecount;
		
			// Fade out loading
			jQuery('#setloading').fadeOut('slow');
			jQuery('#shifter').html(data.output);
			setupPhotoSets();
			photoSlider();
		},
		"json"
	);
}
	
	
//////////// Photo Slider ////////////////
function photoSlider() {
	
	// Set the width of gview based on panecount
	jQuery('#shifter').width((900 * (panecount+1)));
	
	// Get the width of the outermost container div.
	var getWidth = jQuery('#gview').width();

	// Set a global variable to keep track of how far
	// the "shifter" should be moved.
	var setWidth = 0;

	// Variable for Current Pane
	var curPane = 1;
	
	// "Disable" left nav button
	jQuery('#gleftbtn').css('opacity', '0.4');
	
	// Only one pane, so disable right nav button
	if (curPane == panecount) {
		jQuery('#grightbtn').css('opacity', '0.4');
	}

	// Subtract the pane width from the amount by which
	// the "shifter" has already been moved.
	// Don't forget to give back the changed setWidth variable!
		jQuery('a.shiftleft').click(function() {
			if (curPane < panecount) {
				setWidth = setWidth - getWidth; 
				jQuery('#shifter').animate({left: setWidth}, {duration:500, easing: "swing"});
				curPane++;
				
				if(curPane != 1) {
					jQuery('#gleftbtn').css('opacity', '1.0');
				}
			}
			
			if (curPane == panecount) {
				jQuery('#grightbtn').css('opacity', '0.4');
			}
			
			return false;
		});
	
	// Same thing in reverse.
	jQuery('a.shiftright').click(function() {
		if (curPane != 1) {
			setWidth = setWidth + getWidth;
			jQuery('#shifter').animate({left: setWidth}, {duration:500, easing: "swing"});
			curPane--;
			
			if (curPane < panecount) {
				jQuery('#grightbtn').css('opacity', '1.0');
			}
		}
		
		if (curPane == 1) {
			jQuery('#gleftbtn').css('opacity', '0.4');
		}

		return false;			
	});
}

//////////////// Photosets Hover ////////////////////
function setupPhotoSets() {

	// Image Hover //
	jQuery('.photobutton').hover(function() {
		jQuery(this).stop();
		jQuery(this).animate({opacity:1.0, marginTop:0}, 'slow');
		return false;
		
	}, function() { 
		jQuery(this).stop();
		jQuery(this).animate({opacity:0.6, marginTop:5}, 'fast');
		return false;
	});
	
	// Image Hover //
	jQuery('.photothumb').hover(function() {
		jQuery(this).stop();
		jQuery(this).animate({opacity:1.0, marginTop:5}, 'slow');
		return false;
		
	}, function() { 
		jQuery(this).stop();
		jQuery(this).animate({opacity:0.6, marginTop:10}, 'fast');
		return false;
	});
	
	// Click to load photoset
	jQuery('.photobutton').click(function() {
		loadPhotoThumbs(jQuery(this).attr('id'));
	});

}


//////////////// loadPhotoThumbs ///////////////////
function loadPhotoThumbs(pset) {
		jQuery('#shifter').html('');
		jQuery('#setloading').fadeIn('slow');
		
		jQuery.post(
			'/wp-content/themes/redline/gallery.inc.php',
			{type: "photoset", id: pset},
			function(data) {
				$panecount = data.panecount;
				// Fade out loading
				jQuery('#setloading').fadeOut('slow');
				jQuery('#shifter').html(data.output);
				photoSlider();
				setupPhotoThumbs();
			},
			"json"
		);
}
	
//////////////// Photoset View  ////////////////////
function setupPhotoThumbs() {
	
	// Image Hover //
	jQuery('.photothumb').hover(function() {
		jQuery(this).stop();
		jQuery(this).animate({opacity:1.0}, 'slow');
		return false;
		
	}, function() { 
		jQuery(this).stop();
		jQuery(this).animate({opacity:0.6}, 'fast');
		return false;
	});
	
	// Lightbox link for thumbs
	jQuery('.photothumb a').fancybox();
	
}


///////////////// Load Videos ///////////////////////
function loadVideoThumbs() {
	// Get photosets via AJAX
	jQuery.post(
		'/wp-content/themes/redline/gallery.inc.php',
		{type: "videos"},
		function(data) {
			vpanecount = data.vpanecount;
		
			// Fade out loading
			jQuery('#vsetloading').fadeOut('slow');
			jQuery('#vshifter').html(data.output);
			setupVideoThumbs();
			videoSlider();
		},
		"json"
	);
}
	
///////////////// Video Slider //////////////////////
function videoSlider() {

	// Set the width of gview based on panecount
	jQuery('#vshifter').width((900 * (vpanecount+1)));
	
	// Get the width of the outermost container div.
	var getWidth = jQuery('#vview').width();

	// Set a global variable to keep track of how far
	// the "shifter" should be moved.
	var setWidth = 0;

	// Variable for Current Pane
	var curPane = 1;
	
	// "Disable" left nav button
	jQuery('#vleftbtn').css({'opacity' : '0.4', 'cursor' : 'default'});
	
	// Only one pane, so disable right nav button
	if (curPane == panecount) {
		jQuery('#vrightbtn').css({'opacity' : '0.4', 'cursor' : 'default'});
	}

	// Subtract the pane width from the amount by which
	// the "shifter" has already been moved.
	// Don't forget to give back the changed setWidth variable!
		jQuery('a.vshiftleft').click(function() {
			if (curPane < vpanecount) {
				setWidth = setWidth - getWidth; 
				jQuery('#vshifter').animate({left: setWidth}, {duration:500, easing: "swing"});
				curPane++;
				
				if(curPane != 1) {
					jQuery('#vleftbtn').css('opacity', '1.0');
				}
			}
			
			if (curPane == vpanecount) {
				jQuery('#vrightbtn').css('opacity', '0.4');
			}
			
			return false;
		});
	
	// Same thing in reverse.
	jQuery('a.vshiftright').click(function() {
		if (curPane != 1) {
			setWidth = setWidth + getWidth;
			jQuery('#vshifter').animate({left: setWidth}, {duration:500, easing: "swing"});
			curPane--;
			
			if (curPane < vpanecount) {
				jQuery('#vrightbtn').css('opacity', '1.0');
			}
		}
		
		if (curPane == 1) {
			jQuery('#vleftbtn').css('opacity', '0.4');
		}

		return false;			
	});
	
}

function setupVideoThumbs(){
	
	// Video Thumb Hover //
	jQuery('.videothumb').hover(function() {
		jQuery(this).stop();
		jQuery(this).animate({opacity:1.0}, 'slow');
		return false;
		
	}, function() { 
		jQuery(this).stop();
		jQuery(this).animate({opacity:0.6}, 'fast');
		return false;
	});
	
	jQuery('.videothumb a').each(function() {
		jQuery(this).attr('href', '/wp-content/themes/redline/gallery.inc.php?type=video&id='+jQuery(this).attr('id'));
	});
	
	jQuery('.videothumb a').fancybox({
		'frameWidth':	650,
		'frameHeight':	395
	});
}
	
})(jQuery);