// JavaScript Document

// KNOWN ISSUES/ BUGS:  Goddam annoying bug with eagle. For some reason, I cannot reset its position after animation.  Don't know why.  Its like animation() overrides css() or something.  So stupid.
//
//	UPDATES:	1/22/12 - Changed eagle so there's a one in 100 chance that it will fly across the page immediately.  Eliminated need for reseting position.  Also there's no chance that the eagle will fly more than once
//						  Functions modified:

var debugMode = true;



function menuOver(mi) {	
	mi.css('color', '#A8E0FF');
}


function menuOff(mi) {
	mi.css('color', '#ffffff');
}


function subscribeOver(mi) {
	mi.css('background-color', '#c4d5e9');
}


function subscribeOut(mi) {
	mi.css('background-color', '#f1f7f9');
}


function navigateTo(url) {
	document.location=url;	
}

function navigateOutside(url) {
	document.location=url;
}


// this function is for buttons with 3 stages, over out and not available (in that order).  First it checks to see if the button is available by comparing its y position to its height
// if it is available, it shifts the y position.  Should work for any size button as long as its exactly 3 times the height of the button image
function tsbOver(mi) {
	
	if (mi.find('img').css('top') == '0px') {
		
		// finds the height of the image inside the button
		var ht = mi.find('img').css('height');
		
		// strips the 'px' off of the end of the string
		ht = ht.slice(0, ht.length - 2);
		
		// actual height of the button
		bh = ht/3;
		
		mi.find('img').css('top', 0-bh+'px');
	}
	
}

// this function is for buttons with 3 stages. Returns to normal stage if in rollover position.  Note: May trigger an error if there is no image present
function tsbOut(mi) {
	
	// finds the height of the image inside the button
	var ht = mi.find('img').css('height');
	
	// strips the 'px' off of the end of the string
	ht = ht.slice(0, ht.length - 2);
	
	// actual height of the button
	var bh = ht/3;
	
	if (mi.find('img').css('top') == 0-bh+'px') {
		mi.find('img').css('top', '0px');
	}
	
}

function navigatePage(url) {
	
	window.location.href = url;
}


// This function finds the height of the main box, and then manually sets the height of the paper trim to match.  Calls itself a second time 8 seconds or so later to readjust (fixes a bug caused by the comments)
var dubCheck = false;			// set to true once the height has been adjusted 1 time
var dcDelay = 10;				// delay in seconds
var dcInt;
function setColumns() {
	
	if ($('#mainContent').outerHeight() > $('#leftVertEdge').outerHeight()) {
	
	var ht = $('#mainContent').outerHeight();
	$('#leftVertEdge').css('height', ht+'px');
	$('#rightVertEdge').css('height', ht+'px');
	
	// if this is the first time checking for height, the function will call itself again in the number of seconds specified by dcDelay
	if (!dubCheck) {
	
		dubCheck = true;
		window.clearInterval(dcInt);
		dcInt = window.setTimeout('setColumns()', 1000*dcDelay);		
	
	}

	}
	else {
		
		window.clearInterval(dcInt);
		
	}
}


// ************************** CODE TO RANDOMLY LOAD BANNER AND SUB HEADLINE ******************************

function loadBanner () {
	
//	alert("loadBanner called");
//	dT('loadBanner called');
	
	var wr = Math.floor(Math.random()*10);
	var qr = Math.floor(Math.random()*4);
	
	var path = "http://wheezywaiter.com/images/";
	var wURL;
	var qTEXT;
	
	switch (wr) {
	
		case 0: 	wURL = "MainBanner1.png";
				 	break;
					
		case 1: 	wURL = "MainBanner2.png";
				 	break;
					
		case 2: 	wURL = "MainBanner3.png";
				 	break;
					
		case 3: 	wURL = "MainBanner4.png";
				 	break;
									
		case 4: 	wURL = "MainBanner5.png";
				 	break;
					
		case 5: 	wURL = "MainBanner6.png";
				 	break;
								
		case 6: 	wURL = "MainBanner7.png";
				 	break;					
					
		default: 	wURL = "MainBanner1.png";
				 	break;
	}
	
//	alert ("hello?"+wURL);
	
	$("#mainBannerOverlay").html('<img src="'+path+wURL+'" width="1040" height="340" />');
	
	switch (qr) {
	
		case 0:		qText = "asthmatic since 1980";
					break;
					
		case 1:		qText = "where the coffee is always done";
					break;
					
		case 2:		qText = "not sure if it's a thing yet since 2007";
					break;
					
		case 3:		qText = "sending clones to a better place since 2007";
					break;
					
		default:	qText = "asthmatic since 1980";
					break;
					
	}
	
	$("#tagline").html(qText);
//	dT('wassup bitches');



	//This portion of the code checks the pageID variable, and sets the appropriate menu link
	if (pageID != null) {
		
		$('#menu'+pageID).addClass("menuSelected");
		$('#menu'+pageID).removeAttr('onclick');
		
	}
	
}





// *******************************************************************************************************



// ************************* STUPID EAGLE FLIGHT CODE ********************************
var timeoutID;
var etimeoutID;
var posNum;
//var eagleNumb = 0;				// number of times eagle has swooped
//var maxEagle = 3;			// maximum number of eagle swoops per page
var eagOds = 80;				// The odds of an eagle swooping on page load are 1/eagOds
var eagPause = 3;			// number of seconds that we wait before eagle flies out.

// function called when eagle is clicked on.  Initiates its collapse
// not currently in use
function hitEagle () {
	
//	dT("Eagle has been struck!!!");

/*
	var tO = 600;

	$('#stupidEagle').animate({top:'+=250'}, tO);
	$('#stupidEagle').rotate({ angle:0, animateTo:180 })
	
	clearTimeout(timeoutID);
	timeoutID = window.setTimeout('eagleIsDead()', tO);
*/

//	dT("Come on eagle!");
	
}


// not sure what this function will contain, but it will be what happens when the eagle corpse hits the ground.
// not currently in use
function eagleIsDead () {
	
	// not sure why i have to call animate, but some reason using css() doesn't seem to work.  ITs like it has to fly back up
	$('#stupidEagle').animate({top:'-=400'}, 1);
	$('#stupidEagle').css('visibility', 'visible');
	
	// for the time being we'll just bring the eagle back temporarily
//	initiateEagle();
	
	// for the time being once the eagle has been punched, it no longer comes back on that specific page
	
}

// returns true if window is scrolled to the top
function isScrolledUp () {
	
//	if ($(document.body).scrollTop() <= 20) {
//		return true;
//	}
//	else {
//		return false;
//	}
}


function initiateEagle () {

//	if (eagleNumb < maxEagle) {
	
//	eagleNumb ++;
	
//	alert("initiate Eagle called");
//	dT('initiateEagle called!');
//	$('#debuggerText').append("initiate eagle called!! <br/>");
//	var rand = 30+10*Math.floor(Math.random()*11);  			// random number to determine eagle wait time.
	var rand = Math.ceil(Math.random()*eagOds);
//	posNum = Math.ceil(Math.random()*2);				// one of three possible positions and flight paths the eagle can take;
//	var tp = -125;
//	var lt;

	if (rand==1) {
		timeoutID = window.setTimeout('flyEagle()', 1000*eagPause);
	//	$('#stupidEagle').css('visibility', 'visible');
	//	flyEagle();
	}
		
		
//	$('#stupidEagle').removeAttr('style');
	
//	$('#stupidEagle').css('top', '');
//	$('#stupidEagle').css('left', '');
//	$('#stupidEagle').css('top', '-125px');

//	dT("top of stupid eagle = "+$('#stupidEagle').css('top'));
//	$('#stupidEagle').rotate({angle:0});
	
//	dT("initiate: "+posNum);
	

	
/*	switch (posNum) {
		
		
		
		case 1: 	lt = -100;
					//$('#stupidEagle').css('left', '-100px');
				//	$('#stupidEagle').attr('style', 'top: -125px;left:-100px');
					//$('#stupidEagle').addClass('unflip-horizontal');
					$('#stupidEagle').html('<img src="images/eagle_small.png" width="100" height="106" />');
//					dT("INITIATE CASE 1!!!!!!!!!K");
					//$('#stupidEagle').left(-100);
					//$('#stupidEagle').top(-125);
				 	break;
		
		case 2: 	lt = 1000;
					//	$('#stupidEagle').css('left', '1000px');
				//	$('#stupidEagle').attr('style', 'top: -125px;left:1000px');
				//	$('#stupidEagle').addClass('flip-horizontal');
					$('#stupidEagle').html('<img src="images/eagle_small_flipped.png" width="100" height="106" />');
//					dT("INITIATE CASE 2!!!!!!!!!!! ");
					//$('#stupidEagle').css({'left': '1000px', 'top': '-125px'});
					//$('#stupidEagle').css({'left': '300px', 'top': '-125px'});
					break;
					
		default:	//$('#stupidEagle').css('left', '-100px');
					//$('#stupidEagle').addClass('unflip-horizontal');
				//	$('#stupidEagle').attr('style', 'top: -125px;left:-100px');
					$('#stupidEagle').html('<img src="images/eagle_small.png" width="100" height="106" />');
					break;
	
	}*/
//	$('#stupidEagle').removeAttr('style');
	// for some reason once you use animate it overrides the css function.  There for I need to do this to properly position the eagle
//	$('#stupidEagle').animate({left:lt, top:tp},0);

//	dT("Eagle location, top: "+$('#stupidEagle').css('top')+", left: "+$('#stupidEagle').css('left')+", offsetLeft: "+$('#stupidEagle').offset().left);
	
//	timeoutID = window.setTimeout('flyEagle()', 1000*rand);
//	dT("rand = "+rand+", "+posNum);
//	delay(1000*rand).flyEagle(rand);
//	}
}

function initiateExplosion () {
	
	if (isWednesday()) {
	
	var randX = Math.floor(Math.random()*1000);
	var randY = Math.floor(Math.random()*500);
	var rand = Math.floor(Math.random()*11);
	
//	dT("explosion initiated!! X = "+randX+", Y = "+randY+", rand = "+rand);
	
	$('#explosionContainer').css('top', randY);
	$('#explosionContainer').css('left', randX);
	$('#explosion').css('visibility', 'hidden');
	ecount = 0;
	
	etimeoutID = window.setTimeout('shiftExplosion()', 1000*rand);
	}

}

function shiftExplosion () {
	
	if (ecount == 0) {
		
		// this code causes the eagle sound effect to play
		$.fn.soundPlay({url: 'sounds/explosion.mp3',
			playerId: 'embed_player',
			command: 'play'});
	}
	
	
	var p = $('#explosion').position();
//	dT("shift Explosion!! "+p.left);
	$('#explosion').css('visibility', 'visible');
	clearTimeout(etimeoutID);
	$('#explosion').css({'left' : (p.left-300)+'px', 'top': p.top+'px'});
//	dT("did it move?"+$('#explosion').position().left+", "+$('#explosion').css('left'));
	ecount++;
	
	if (ecount < 13) {
		etimeoutID = window.setTimeout('shiftExplosion()', 42);	
	}
	else {
//		$('#explosion').css('visibility', 'hidden');
		$('#explosion').css({'left': '0px', 'top': '0px'});
		initiateExplosion();
	}
}

// function that checks wether or not its wednesday. If it is, you get an explosion
function isWednesday () {
	
	return true;
}

function flyEagle () {
	
//	$('#debuggerText').append("FLY EAGLE!!!");
	clearTimeout(timeoutID);
	$('#stupidEagle').css('visibility', 'visible');
	var tO = 2000;
	
//	dT("fly: "+posNum);
	
/*	switch (posNum) {
		
		case 1:		tO = 2000;
					$('#stupidEagle').animate({left:'+=700', top:'+=150' }, tO);
//					dT("fly CASE 1!!!!!!!!!");
					break;
					
		case 2:		tO = 2000;
					$('#stupidEagle').animate({left:'-=700', top:'+=150' }, tO);
//					dT("fly CASE 2!!!!!!!!!");
					break;
					
		default: 	tO = 2000;
					$('#stupidEagle').animate({left:'+=700', top:'+=150' }, tO);
					break;
					
		
	}
*/

	$('#stupidEagle').animate({left:'+=700', top:'+=150' }, tO);
	
	// this code causes the eagle sound effect to play
	$.fn.soundPlay({url: 'sounds/eagle.mp3',
		playerId: 'embed_player',
		command: 'play'});
	
	timeoutID = window.setTimeout('flyEagleUp()', tO);
}

function flyEagleUp () {
	
//	dT("fly: "+posNum);
//	$('#debuggerText').append("FLY UP EAGLE!!!");
	
	clearTimeout(timeoutID);
	$('#stupidEagle').animate({left:'+=400', top:'-=150' }, 1000);
//	var tO;

/*	switch (posNum) {
		
		case 1:		tO = 1000;
					$('#stupidEagle').animate({left:'+=400', top:'-=150' }, tO);
					timeoutID = window.setTimeout('initiateEagle()', tO);
//					dT("flyUp CASE 1!!!!!!!!!");
					break;
					
		case 2:		tO = 1000;
					$('#stupidEagle').animate({left:'-=350', top:'-=150' }, tO);
					timeoutID = window.setTimeout('initiateEagle()', tO);
//					dT("flyUp CASE 2!!!!!!!!!");
					break;
			
			
	}
	
	$('#stupidEagle').removeAttr('style'); */
	
	// code determines 1 of several random positions the eagle could be in to start
	
		
}

// ************************  CODE FOR SLIDING PANEL **********************************


// this function initializes the sliding panel.  Requires a back button, next button, and a panel container in which the sliding part is an ul.  The next and back buttons must be three stage
// buttons as defined above.  The ul element also needs a specified width style which should be the exact width of the combined panel.  Also requires function called checkButtons
// THere must also be a variable defined somewhere called bioList which has the names of all the bioPanels
var panelWidth;
var thePanel;
var backButt;
var nextButt;
var panelContainer;
var currentIndex;
var scrollMem;
//var userHash = 0;			// if set to 1, than a user clicked it.  If 0, then it was the browser

function initializePanel(bb, nb, pc) {
	
//	alert('init panel called');
	
	backButt = bb;
	nextButt = nb;
	panelContainer = pc;
	thePanel = pc.find('ul');
	panelWidth = parseInt(thePanel.css('width').slice(0, thePanel.css('width').length-2));	
	currentIndex = 0;
	scrollMem = 0;
	
	// for some reason I have to do this for deep linking.  Basically I'm adding in the names of all the li after the document is loaded to prevent stupid things from happening
	for (j=0; j < thePanel.children().length; j++) {
	
		thePanel.children()[j].id = bioList[j];
		
	}
	
	window.onhashchange = function () {
	// Checks the hash, and sees if there's anything there.  If there is, then it updates the list accordingly 
	// NOTE: For this to work thePanel must be a ul, and each li must have an id that will correspond to the hash.  The ids should be in an array called bioList, and not in the html

		var key = window.location.hash.substring(1);
		if (key.length > 0) {
				
			var ind=0;
			for (i=0;i < thePanel.children().length; i++) {
				
			//	alert('key: '+key+', '+$('li#'+key).attr('id')+', '+thePanel.children()[i]);
				
				if (key == thePanel.children()[i].id) {
					ind = i;		
				}
			
			}
						
			var wdt = parseInt(panelContainer.css('width').slice(0, panelContainer.css('width').length - 2));
			
			thePanel.css('left', 0-wdt*ind+'px');
	
			currentIndex = ind;
		}	
	
		checkButtons();
		
	}
	
	window.onhashchange();
	
	// calls check buttons to see if buttons need to be activated or deactivated
	checkButtons();

}

// this function is called by initializePanel, backPanel and nextPanel to check if the back or next buttons require activation or deactivation.  Requires panelWidthm thePanel, backButt, nextButt 
// and panelContainer
function checkButtons () {
	
//	alert('check buttons called!!!');
	
	var bbh;	// height of back button
	var nbh;	// height of next button
	var btp;	// y position of back button image
	var ntp;	// y position of next button image
	
	// back button height calculation
	bbh = backButt.find('img').css('height');
	bbh = parseInt(bbh.slice(0, bbh.length - 2));
	bbh = bbh/3;

	// finds current y position of backButton
	btp = parseInt(backButt.find('img').css('top').slice(0, backButt.find('img').css('top').length - 2));

	// next button calculation
	nbh = nextButt.find('img').css('height');
	nbh = parseInt(nbh.slice(0, nbh.length - 2));
	nbh = nbh/3;
	
	// finds current y position of next button
	ntp = parseInt(nextButt.find('img').css('top').slice(0, nextButt.find('img').css('top').length - 2));
	
	
	// if the panel is docked at zero, disables the back button
	if (thePanel.css('left') == '0px') {
			
		// places the button in the disabled position
		backButt.find('img').css('top', 0-2*bbh+'px');
		
		// sets the cursor to the default mouse state
		backButt.css('cursor', 'default');
	}
	// checks to see if back button needs to be re-enabled
	else if (btp == 0-2*bbh) {
		
		backButt.find('img').css('top', '0px');
		backButt.css('cursor', 'hand');				// don't know if I really need this line
		backButt.css('cursor', 'pointer');	
	}
		
	
	// if the panel is docked at its last position, we disable the next button
	if (parseInt(thePanel.css('left').slice(0, thePanel.css('left').length-2)) <= parseInt(panelContainer.css('width').slice(0, panelContainer.css('width').length - 2)-panelWidth)) {
			
		// places the button in the disabled position
		nextButt.find('img').css('top', 0-2*nbh+'px');
		
		// sets the cursor to the default mouse state
		nextButt.css('cursor', 'default');
	}	
	// checks to see if next button needs to be re-enabled
	else if (ntp == 0-2*nbh) {
		
		nextButt.find('img').css('top', '0px');
		nextButt.css('cursor', 'hand');				// don't know if I really need this line
		nextButt.css('cursor', 'pointer');	
	}
	
	
}


// function that is called when the back or next button is clicked.  Requires the above initializePanel function, as well as defined backButt, nextButt, thePanel, panelContainer and panelWidth
// requires a 0 or 1 as parameter. 0 for back, 1 for next
function changePanel(dir) {
	
	var pl = parseInt(thePanel.css('left').slice(0, thePanel.css('left').length-2));
	var pw = parseInt(panelContainer.css('width').slice(0, panelContainer.css('width').length-2));
	
//	userHash = 1;
		
	// only executes if left position is less than 0.  Function slides panel to the right the amount of the width of the panel container
	if (dir == 0 && pl < 0) {
	
	//	thePanel.css('left', pl+pw+'px');
		currentIndex--;
		
		// this code updates the location.hash for deep linking purposes
		var ttl = thePanel.children()[currentIndex].id;
		thePanel.children()[currentIndex].id='';
		window.location.hash = '#'+ttl;
		thePanel.children()[currentIndex].id=ttl;
										   
	}
	
	// only executes if left position is greater than furthest back position  Function slides panel to the left the amount of the width of the panel container
	else if (dir == 1 && pl > pw-panelWidth) {
	
//		thePanel.css('left', pl-pw+'px');
		currentIndex++;

		// this code updates the location.hash for deep linking purposes
		var ttl = thePanel.children()[currentIndex].id;
		thePanel.children()[currentIndex].id='';
		window.location.hash = '#'+ttl;
		thePanel.children()[currentIndex].id=ttl;
										   
	}
	
}

// ********************************** END SLIDING PANEL CODE **************************************

// this is the function for the debug panel.  If debugMode is true, it displays text and what not
function dT (t) {
	
	if (debugMode) {
		
		$('#debuggerText').append(t+"<br/>");
		
	}
	
}

// another hover function. Usefull for when you're just working with a div with an img in it.
function opHover (bt, ov) {
	
	// for roll over
	if (ov == 1) {
	
		bt.css({ opacity: 0.4 });
	
	}
	else {
		
		bt.css({ opacity: 1 });
	}
	
}

// J*********************************************************************************  

// THis is a class which creates a simple animation out of a png file.  This specialized png file must be a single image that contains all the frames of the animation, so that the total width of the file is the number of frames mulitplied by the width of the animation

// ob = reference object that contains the png to be animated, nf is the total number of frames, snd is the location of the sound file to be played simultaneously, a is the random multiplier, and b is the random adder
function randomPNGAnimation (ob, nf, snd, fr, a, b) {
	
	dT('randomPNGAnimation called');
	
	this.shiftAnim = simplePNGAnimation;
	
	var rand = Math.floor(Math.random()*a+b);
	this.shiftAnim (ob, nf, snd, fr, rand);
	
	
}


function simplePNGAnimation (ob, nf, snd, fr, del) {
	
	dT("no?");
		
	this.animObj = ob;	
	this.frameNo = nf;
	this.soundFile = snd;
	this.frameRate = fr;
	this.timeOut = 0;
	this.ecount = 0;
	
	dT("simplePNGAnimation called");
	
//	dT("explosion initiated!! X = "+randX+", Y = "+randY+", rand = "+rand);
	
	if (del != 0) {
		dT("del not equal 0, = "+del);
		ob.css('visibility', 'hidden');
		this.timeOut = setTimeout('shiftAnimation()', del);
		dT("help?");
	}
	else {
		ob.css('visibility', 'visible');
		this.shiftAnimation();
	}
	
	/*
	this.shiftAnimation = function() {
		
		dt("shiftAnimation called");
	
		if (this.ecount == 0 && snd != null) {
			
			// this code causes the eagle sound effect to play
			$.fn.soundPlay({url: soundFile,
				playerId: 'embed_player',
				command: 'play'});
		}
		
		
		var p = this.animObj.position();
	//	dT("shift Explosion!! "+p.left);
		this.animObj.css('visibility', 'visible');
		clearTimeout(this.timeOut);
		this.animObj.css({'left' : (p.left-(this.animObj.width()/this.frameNo))+'px', 'top': p.top+'px'});
//		dT("did it move?"+$('#explosion').position().left+", "+$('#explosion').css('left'));
		this.ecount++;
		
		if (this.ecount < this.frameNo) {
			this.timeOut = setTimeout('this.shiftAnimation()', 1000/this.frameRate);	
		}
		else {
	//		$('#explosion').css('visibility', 'hidden');
			this.animObj.css({'left': '0px', 'top': '0px'});
			
//			this ain't quite right, but we'll roll with it for now.
			randomPNGAnimation(this.animObj, this.frameNo, this.soundFile, this.frameRate, 11, 30);
		}
	}*/
	
}
function shiftAnimation() {
		
		dt("shiftAnimation called");
	
		if (this.ecount == 0 && snd != null) {
			
			// this code causes the eagle sound effect to play
			$.fn.soundPlay({url: soundFile,
				playerId: 'embed_player',
				command: 'play'});
		}
		
		
		var p = this.animObj.position();
	//	dT("shift Explosion!! "+p.left);
		this.animObj.css('visibility', 'visible');
		clearTimeout(this.timeOut);
		this.animObj.css({'left' : (p.left-(this.animObj.width()/this.frameNo))+'px', 'top': p.top+'px'});
//		dT("did it move?"+$('#explosion').position().left+", "+$('#explosion').css('left'));
		this.ecount++;
		
		if (this.ecount < this.frameNo) {
			this.timeOut = setTimeout('shiftAnimation()', 1000/this.frameRate);	
		}
		else {
	//		$('#explosion').css('visibility', 'hidden');
			this.animObj.css({'left': '0px', 'top': '0px'});
			
//			this ain't quite right, but we'll roll with it for now.
			randomPNGAnimation(this.animObj, this.frameNo, this.soundFile, this.frameRate, 11, 30);
		}
}