/*-------------------------------------------------------------------------------------------------
Global variables for star animation
-------------------------------------------------------------------------------------------------*/
var xCartWidget;
var yCartWidget;
var starContainer; 
var wishlistButton;

function shootingStar_step0_setup() {	
	
	// Load global vars
	starContainer = document.getElementById("starContainer");
	xCartWidget   = findPosX(document.getElementById("results_refreshCartWidget"));
	yCartWidget   = findPosY(document.getElementById("results_refreshCartWidget"));
	wishlistButton= document.getElementById("wishlistButtonInHeader");
	

	// Move the star impact into place
	document.getElementById("starImpactContainer").style.left = findPosX(document.getElementById("wishlistButtonInHeader")) - 30;
}



 
/*-------------------------------------------------------------------------------------------------
shootingStar_step1_triggerAllAndFirstMove
Triggers our background, and the star phases
Also triggers the first motion from wishlist to the caption area
-------------------------------------------------------------------------------------------------*/
function shootingStar_step1_triggerAllAndFirstMove() {

	// Swap layer so star above now above the wishlist
		starContainer.style.zIndex  = 1001;
		starContainer.style.display = "block";
		
		wishlistButton.style.zIndex= 9001;
		wishlistButton.style.display = "block";
		wishlistButton.style.position="relative";
	
	// Fade in black transparent background
		toggleStarSky(1);
			
    // Destination: right near the testimonial bubble
 		var xDestination = xCartWidget - 100;
 		var yDestination = yCartWidget + 600;
 		
  	// Setup animation
		var attributes = { points: { to: [xDestination, yDestination] } };
		var anim       = new YAHOO.util.Motion('starContainer', attributes);
		anim.duration  = .5; 
		//anim.method    = YAHOO.util.Easing.backOut;	// http://developer.yahoo.com/yui/docs/YAHOO.util.Easing.html
		anim.onComplete.subscribe(function () { shootingStar_step2_wiggle(); });
		
		// As we move, toggle the star forms
		setTimeout("togglePngs('star',0,1)",60);
		setTimeout("togglePngs('star',1,2)",90);
		setTimeout("togglePngs('star',2,3)",130);
		setTimeout("togglePngs('star',3,4)",170);
			
	// Move it!
	anim.animate();
} 




/*-------------------------------------------------------------------------------------------------
shootingStar_step2_wiggle()
This happens right after the star lands at the testimonials bubble
-------------------------------------------------------------------------------------------------*/
function shootingStar_step2_wiggle() {

	// Trigger fading in sky phases
		triggerSkyPhases(0);

	// Do the wiggle
	setTimeout("togglePngs('star',4,5)",20);
	setTimeout("togglePngs('star',5,6)",40);
	setTimeout("togglePngs('star',6,7)",60);
	setTimeout("togglePngs('star',7,8)",80);
	setTimeout("togglePngs('star',8,9)",100);
	setTimeout("togglePngs('star',9,10)",120);
	setTimeout("togglePngs('star',10,11)",140);
	
	// Send it up the rest of the way up
	setTimeout("shootingStar_step3_flyToWishlistButtonInHeader(); ",500);
	
	// Scroll the window up
	setTimeout("scrollWindow(0)",50);


}


/*-------------------------------------------------------------------------------------------------
shootingStar_step3_flyToWishlistButton()
This is the path from the testimonials bubble to the header
-------------------------------------------------------------------------------------------------*/
function shootingStar_step3_flyToWishlistButtonInHeader() {

    // Destination: wishlist button right above the cart widget
 		var xDestination = xCartWidget - 70;
 		var yDestination = yCartWidget;
 		
 		// The control is what slingshots it down first
 		var xControl = findPosX(starContainer);
 		var yControl = findPosY(starContainer) + 200;
 		
   	// Setup animation
   	// Second control point gives it a slight curve
		var attributes = { points: { to: [xDestination, yDestination], control: [[xControl, yControl],[xControl+200, yControl-500]] } };
		var anim       = new YAHOO.util.Motion('starContainer', attributes);
		anim.duration  = .75; // @@ .75
		//anim.method    = YAHOO.util.Easing.backIn;	// http://developer.yahoo.com/yui/docs/YAHOO.util.Easing.html
		anim.onComplete.subscribe(function () { shootingStar_step4_starImpact() });
	
	// Final flip of the star forms 
		var timeIncrement = 500;
		for(var i = 11; i <= 33; i++) {	
			var nextOne = i + 1;
			eval('setTimeout("togglePngs(\'star\','+i+','+nextOne+')",'+timeIncrement+');');
			timeIncrement += 22; // @@ 22
		}
	
	// Move it!
	anim.animate();
}


/*-------------------------------------------------------------------------------------------------
shootingStar_step4_starImpact()
-------------------------------------------------------------------------------------------------*/
function shootingStar_step4_starImpact() {
		
	// Turn it on
		document.getElementById("starImpactContainer").style.visibility = "visible";
		
	// Flip through the star impact frames
		var timeIncrement = 140;
		
		for(var i = 34; i <= 41; i++) {	
			var nextOne = i + 1;
			eval('setTimeout("togglePngs(\'starImpactPng\','+i+','+nextOne+')",'+timeIncrement+');');
			timeIncrement += 20;
		}

	// Wait then reset everything
		setTimeout("shootingStar_step5_resetEverything()",timeIncrement + 750);
	
}


/*-------------------------------------------------------------------------------------------------
shootingStar_step5_resetEverything()
Last step: get us ready for next time
-------------------------------------------------------------------------------------------------*/
function shootingStar_step5_resetEverything() {

	// Sky dark background
		var attributes = { opacity: { from: .75, to: 0 } };
		var anim      = new YAHOO.util.Anim('starSky', attributes); 
		anim.duration = 0.8;
		anim.animate();	
		anim.onComplete.subscribe(function () { document.getElementById("starSky").style.display = "none"; });
	
	// Sky phases
		document.getElementById("skyPhaseSubcontainer1").style.opacity = "0";	
		document.getElementById("skyPhaseSubcontainer2").style.opacity = "0";	
		document.getElementById("skyPhaseSubcontainer3").style.opacity = "0";	
		document.getElementById("skyPhaseSubcontainer4").style.opacity = "0";	
		document.getElementById("skyPhasesContainer").style.display    = "none"; // Do this in addition to opacity so it does not cover any clicakble regions
	
	// Star
		// Swap layer back
		starContainer.style.zIndex  = 997;
		starContainer.style.display = "none";
		
		// Go back to start image
		togglePngs('star',33,0);
		
		// Reposition under wishlist
		starContainer.style.top    = "15px";
		starContainer.style.left   = "55px";

}


/*-------------------------------------------------------------------------------------------------
fadeInSkyPhase
recursive
-------------------------------------------------------------------------------------------------*/
function triggerSkyPhases(whichPhase) {

	// Turn on and set in position the sky phase container
	if(whichPhase == 0) document.getElementById("skyPhasesContainer").style.display = "block";
	
	whichPhase = parseInt(whichPhase) + 1;

	if(whichPhase <= 4) {
		var attributes = { opacity: { from: 0, to: 1.0 } };
		var anim       = new YAHOO.util.Anim('skyPhaseSubcontainer' + whichPhase, attributes); 
		anim.onComplete.subscribe(function () { triggerSkyPhases(whichPhase) });
		anim.duration = 0.3;
		anim.animate();
	}
}




/*-------------------------------------------------------------------------------------------------
togglePngs()
-------------------------------------------------------------------------------------------------*/
function togglePngs(whichDiv,off,on) {
	
	var offDiv = document.getElementById(whichDiv + off);
	var onDiv  = document.getElementById(whichDiv + on);
	
	if(offDiv) offDiv.style.display = "none";
	if(onDiv) onDiv.style.display   = "block";
	
}


/*-------------------------------------------------------------------------------------------------
toggleStarSky()
-------------------------------------------------------------------------------------------------*/
function toggleStarSky(onOrOff) {

	// ON
	if(onOrOff == 1) {
		document.getElementById("starSky").style.display = "block";
		var attributes = { opacity: { from: 0, to: .8 } }; 
		var anim = new YAHOO.util.Anim('starSky', attributes); 
		anim.duration  = .10;
	 }
	 // OFF
	 else {
	 	var attributes = { opacity: { from: .7, to: 0 } }; 
	 	var anim = new YAHOO.util.Anim('starSky', attributes); 
	 	anim.duration  = .75; 
	 	anim.onComplete.subscribe(function () {document.getElementById("starSky").style.display = "none";});
	 }
	 	 
	 anim.animate(); 
}