/*======================================================================
The following script is for use on the Budget Calculator
You need to ensure that the associated HTML is used on the relevant web page

Original modal script: 
http://www.queness.com/post/77/simple-jquery-modal-window-tutorial
Amendments by Gareth Watson

Original 'Sum HTML Text boxes':
http://viralpatel.net/blogs/2009/07/sum-html-textbox-values-using-jquery-javascript.html
Amendments by Gareth Watson

======================================================================*/

$(document).ready(function() {
	//Hide non-active panels
	//Note that panel 1 is held inside '#boxes' div
	//which is hidden by default
	//When #boxes is shown the divs below will remain hidden
	$('#panel2').hide();
    $('#panel3').hide();
    $('#panel4').hide();
    $('#panel5').hide();
    $('#panel6').hide();
		
	//show whichever panel is the next panel
	//when any div with a class of 'btnnext is pressed do the following:
	$('.btnnext').click(function (event) 
	{		
			//get the ID of the button clicked and process accordingly
			switch (event.target.id)
			{
				case 'next1':
        		$('#panel1').fadeOut('slow',function()
				{
					$('#panel2').fadeIn('slow');
				});
        		break;
				
				case 'next2':
				$('#panel2').fadeOut('slow',function()
				{
					$('#panel3').fadeIn('slow');
				});
				break;
				
				case 'next3':
				$('#panel3').fadeOut('slow',function()
				{
					$('#panel4').fadeIn('slow');
				});
				break;
				
				case 'seeMonBal':
				$('#panel4').fadeOut('slow',function()
				{
					$('#panel5').fadeIn('slow');
				});
				break;
				
				//If it's the last panel
				case 'finish':
				$('#panel5').fadeOut('slow',function()
				{
					$('#panel6').fadeIn('slow');
				});
				break;
			
			}
    });
	/*close processing of next panel*/
	
	
	
	//show whichever panel is the previous panel
	//when any div with a class of 'btnnext is pressed do the following:
	$('.btnback').click(function (event) 
	{		
			//get the ID of the button clicked and process accordingly
			switch (event.target.id)
			{
				case 'back2':
        		$('#panel2').fadeOut('slow',function()
				{
					$('#panel1').fadeIn('slow');
				});
        		break;
				
				case 'back3':
				$('#panel3').fadeOut('slow',function()
				{
					$('#panel2').fadeIn('slow');
				});
				break;
				
				case 'back4':
				$('#panel4').fadeOut('slow',function()
				{
					$('#panel3').fadeIn('slow');
				});
				break;
				
				case 'back5':
				$('#panel5').fadeOut('slow',function()
				{
					$('#panel4').fadeIn('slow');
				});
				break;
				
				//If it's the last panel
				case 'back6':
				$('#panel6').fadeOut('slow',function()
				{
					$('#panel5').fadeIn('slow');
				});
				break;
			
			}
    });
	/*close processing of next panel*/
	
	/*======================================================
	FINISH EFFECTS PROCESSING
	======================================================*/
	
	/*======================================================
	BEGIN PROCESSING INCOME AND EXPENDITURE
	=======================================================*/
	
	/*
	The manner in which this portion of the script 
	works is that it appears to total up each value as each panel is traversed.
	However keep in mind that all these panels are on screen at the
	same time (they are just hidden) and that the contents of the final screen are actually
	being totalled up as soon as any key stroke takes place.
	*/
	
	
	/* CREATE VARIABLES TO HOLD INDIVIDUAL RUNNING TOTALS FOR EACH PANEL */	
	var monthlyIncome = 0;				//for Montly Income
	var essentialExpenses = 0;			//for Essential Expenses
	var lessEssentialExpenses = 0;		//for Less Essential Expenses
	var monthlyDebts = 0;				//for Monthly Debts
	
	//Iterate through each input box containing a '.minc' field 
	//and add 'keyup' handler to trigger calculateMincSum event	
	$(".minc").each(function() {
		$(this).keyup(function(){
			monthlyIncome = calculateMincSum(); //assign total monthly income to monthlyIncome							
		});
	});
	
	//function calculate the monthly income figure
	function calculateMincSum() {
		
		var mincsum = 0;
		
		//Iterate thru each minc field
		$(".minc").each(function() {
			//add only if the value is number
			if(!isNaN(this.value) && this.value.length!=0) {
				mincsum += parseFloat(this.value);
			}
		});
		$("#mincsum").html(mincsum);	// add this figure to the '.mincsum' field
		return mincsum;					// return this figure so it can be used elsewhere
	}
	//close calculateMincSum function
	
	
	/*======================================================
	CALCULATE ESSENTIAL EXPENSES
	=======================================================*/
	
	$(".essexp").each(function() {
		$(this).keyup(function(){
			essentialExpenses = calculateEssExpSum();				
		});
	});
	
	function calculateEssExpSum() 
	{		
		var essexpsum = 0;
		
		//Iterate thru each minc field
		$(".essexp").each(function() 
		{		
			//add only if the value is number
			if(!isNaN(this.value) && this.value.length!=0) {
				essexpsum += parseFloat(this.value);
				//alert("Something Happened");
			}
		});
		$("#essexpsum").html(essexpsum);
		return essexpsum;
	}
	//close calculateEssExpSum function*/
	
	
	/*======================================================
	CALCULATE LESS ESSENTIAL EXPENSES
	=======================================================*/

	$(".lessexp").each(function() {
		$(this).keyup(function(){
			lessEssentialExpenses = calculateLessExpSum();				
		});
	});
	
	function calculateLessExpSum() 
	{		
		var lessexpsum = 0;
		
		//Iterate thru each minc field
		$(".lessexp").each(function() 
		{		
			//add only if the value is number
			if(!isNaN(this.value) && this.value.length!=0) {
				lessexpsum += parseFloat(this.value);
			}
		});
		$("#lessexpsum").html(lessexpsum);	
		return lessexpsum;
	}
	//close calculateLessEssExpSum function*/
	
	/*======================================================
	CALCULATE MONTHLY DEBT EXPENSES
	=======================================================*/
	
	$(".mondebt").each(function() {
		$(this).keyup(function(){
			var monthlyDebts = calculateMonDebtSum();	
			strMonthlyDebts = monthlyDebts+'' ;
			//Due to a problem with processing the monthly debts
			//the value is recorded here as a string and used 
			//in the Total Monthly Balances Calculator
			//This is done using yourString=yourInt+'';
		});
	});
	
	function calculateMonDebtSum() 
	{		
		var mondebtsum = 0;
		
		//Iterate thru each minc field
		$(".mondebt").each(function() 
		{
			//add only if the value is number
			if(!isNaN(this.value) && this.value.length!=0) {
				mondebtsum += parseFloat(this.value);		
			}
		});
		$("#mondebtsum").html(mondebtsum);
		return mondebtsum;		
	}
	//close calculatMonDebtSum function*/
	
	/*======================================================
	CALCULATE TOTAL MONTHLY BALANCES
	=======================================================*/	
	
	//When the 'show balances' button is pressed recalculate the monthly balance
	//Another way to do this is to have a function that is called to recalculate
	//these figures every time one of the sum function above is called.
	//The method below only works if a button with an ID of 'seeMonBal'
	//is clicked!
	//If the panels weren't being hidden and the total needed to be recalculated
	//in real time then the method mentioned above would need to be used.
	
	$('#seeMonBal').click(function (event) 
	{	
		//using the string that was recorded in calculateMonDebtSum
		//convert this back to an integer
		intMonDebt = parseInt(strMonthlyDebts);		
		
		var runtotsum = 0;	
		
		//Total up the balances	
		runtotsum = parseFloat(monthlyIncome) 
		- parseFloat(essentialExpenses) 
		- parseFloat(lessEssentialExpenses)			
		- parseFloat(intMonDebt);
		
		//show total monthly balance on the website
		$("#totalbal").html(runtotsum);
	});	
});