/*
	Title: StudentCity.com Tripvite Landing Page
	Date: 9 Sep 2008
	Author: TJ Kelly (www.tjkwebdesign.com)
*/




sfHover = function() {
	var sfEls = document.getElementById("tripvite_price_trip_list").getElementsByTagName("LI");
	for (var i=0; i<sfEls.length; i++) {
		sfEls[i].onmouseover=function() {
			this.className+=" sfhover";
		}
		sfEls[i].onmouseout=function() {
			this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
		}
	}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);



// jquery
$(document).ready(function(){
	
	// hover effect - add class
	$(".tripvite_step_wrap").mouseover(function(){
		$(this).addClass("tripvite_step_wrap_hover");
	});
	
	// hover effect - remove class
	$(".tripvite_step_wrap").mouseout(function(){
		$(this).removeClass("tripvite_step_wrap_hover");
	});

	// animate
	$(".tripvite_step_wrap").click(function(){
		
		
		
		if($(this).hasClass("tripvite_step_wrap_active")) { // if the "step" you clicked on is already active
			
			// remove "active" class
			$(this).removeClass("tripvite_step_wrap_active");
			
			// reset image
			$("#tripvite_screenshot").animate({ 
				"width":"390px",
				"height":"500px",
				"top":"0px",
				"left":"0px"
			}, 500 );
			$("#zoom_out").remove();
			
		} else {
			
			// remove zoom out
			$("#zoom_out").remove();
			
			// remove all other "active" classes
			$(".tripvite_step_wrap_active").removeClass("tripvite_step_wrap_active");
														
			// add "active" class
			$(this).addClass("tripvite_step_wrap_active");
			
			if($(this).attr("id")=="tripvite_step1_wrap") { // step 1: customize
				$("#tripvite_screenshot").animate({ 
					"width":"940px",
					"height":"993px",
					"top":"-133px",
					"left":"-488px"
				}, 1000 );
				$("#tripvite_screenshot_wrap").append('<a href="#" id="zoom_out">zoom out</a>'); // add zoom out
			}
			else if($(this).attr("id")=="tripvite_step2_wrap") { // step 2: details
				$("#tripvite_screenshot").animate({ 
					"width":"940px",
					"height":"993px",
					"top":"-541px",
					"left":"-12px"
				}, 1000 );
				$("#tripvite_screenshot_wrap").append('<a href="#" id="zoom_out">zoom out</a>'); // add zoom out
			}
			else if($(this).attr("id")=="tripvite_step3_wrap") { // step 3: reponses
				$("#tripvite_screenshot").animate({ 
					"width":"940px",
					"height":"993px",
					"top":"-412px",
					"left":"-490px"
				}, 1000 );
				$("#tripvite_screenshot_wrap").append('<a href="#" id="zoom_out">zoom out</a>'); // add zoom out
			}
			else if($(this).attr("id")=="tripvite_step4_wrap") { // step 3: reponses
				$("#tripvite_landing_page_price_trip_wrap").show();
			}
			
			
		} // end if
	}); // end animate
	
	
	
	
	
	// zoom out
	$("#zoom_out").livequery("click", function(){
		$("#tripvite_screenshot").animate({ 
			"width":"390px",
			"height":"500px",
			"top":"0px",
			"left":"0px"
		}, 1000 );
		$("#zoom_out").remove();
		return false;
	});
	// end zoom out

});