/*==========================================================
    Init
==========================================================*/
var _step = [];
var _selects = [];

function stepsIni(){
    _step = getElementsByClassName(document,'div','formContent');
    
    for(i=0; i<_step.length; i++){
        if(i!=0){
            _step[i].style.display = "none";
        }else{
            _step[i].style.display = "block";
        }
        
        _selects = _step[i].getElementsByTagName('select');        
        for(p=0; p<_selects.length; p++){
            _selects[p].style.visibility = "";
        }
    }
}


/*============================*/
var _step1Inputs = [];
var _step1Eg = [];
var _step1EgText = [];

function step1Ini(){
    _step1Inputs = getElementsByClassName(_step[0],'input','textInput');
    _step1Eg = getElementsByClassName(_step[0],'span','smallText11 eg');
    
    for(q=0; q<_step1Inputs.length; q++){
        _step1EgText[q] = _step1Eg[q].innerHTML;
        _step1Inputs[q].value = "Type...";
        attachEventListener(_step1Inputs[q], "focus", inputFocus, false);
        attachEventListener(_step1Inputs[q], "keyup", calculateInputsStep1, false);
    }
}


/*============================*/
var _step2Inputs = [];
var _step2Select;
var _step2Eg = [];
var _step2EgText = [];

function step2Ini(){
    _step2Inputs = getElementsByClassName(_step[1],'input','textInput');
    _step2Select = getElementsByClassName(_step[1],'select','selectInput')[0];
    _step2Eg = getElementsByClassName(_step[1],'span','smallText11 eg');
        
    for(q=0; q<_step2Inputs.length; q++){
        _step2EgText[q] = _step2Eg[q].innerHTML;
        _step2Inputs[q].value = "Type...";
        attachEventListener(_step2Inputs[q], "focus", inputFocus, false);
        attachEventListener(_step2Inputs[q], "keyup", calculateInputsStep2, false);
    }
    
    _step2Select.selectedIndex = 0;
    attachEventListener(_step2Select, "change", calculateInputsStep2, false);
    
    
}


/*============================*/
var _step3Inputs = [];
var _step3Eg = [];
var _step3EgText = [];
var _totalDebtExpense = 0;

function step3Ini(){
    _step3Inputs = getElementsByClassName(_step[2],'input','textInput');
    _step3Eg = getElementsByClassName(_step[2],'span','smallText11 eg');
        
    for(q=0; q<_step3Inputs.length; q++){
        _step3EgText[q] = _step3Eg[q].innerHTML;
        _step3Inputs[q].value = "Type...";
        attachEventListener(_step3Inputs[q], "focus", inputFocus, false);
        attachEventListener(_step3Inputs[q], "keyup", calculateInputsStep3, false);
    }
        
}


/*==========================================================
    Calculating Functions
==========================================================*/
var _validS1Inputs = [];
var _totalDebt = 0; 

function calculateInputsStep1(){
	_totalDebt = 0;
	
	for(q=0; q<_step1Inputs.length; q++){	
	    inputText = _step1Inputs[q].value;
    	
	    if(inputText!="Type..." && inputText!=""){
	        if(isNumeric(inputText)== true && inputText >= 0){
	            //number is good
	            _step1Inputs[q].style.borderColor = "#679000";
	            _step1Inputs[q].style.borderWidth = "1px";
    	        _step1Eg[q].innerHTML = _step1EgText[q];
    	        _step1Eg[q].style.color = "";
	            _validS1Inputs[q] = inputText;
    	        
	        }else{
	            //number is bad
	            _step1Inputs[q].style.borderColor = "#F00";
	            _step1Inputs[q].style.borderWidth = "2px";
	            _step1Eg[q].innerHTML = " Invalid value"; 
	            _step1Eg[q].style.color = "#F00";   	        
	            _validS1Inputs[q] = "";
	        }
    	    
    	    if(_validS1Inputs[q] && _validS1Inputs[q]!=""){
	            _totalDebt += _validS1Inputs[q]*1;
	        }
    	}
	    document.getElementById('totalDebt').innerHTML = _totalDebt;
	}
}


/*============================*/
var _validS2Inputs = [];
var _totalMonthly = 0;
var _totalYearly = 0; 
var _approxValue = 0; 

function calculateInputsStep2(){
	_totalMonthly = 0;
    _totalYearly = 0; 
    _approxValue = 0; 
	
	for(q=0; q<_step2Inputs.length; q++){	
	    inputText = _step2Inputs[q].value;
    	
	    if(inputText!="Type..." && inputText!=""){
	        if(isNumeric(inputText)== true && inputText >= 0){
	            //number is good
	            _step2Inputs[q].style.borderColor = "#679000";
	            _step2Inputs[q].style.borderWidth = "1px";
    	        _step2Eg[q].innerHTML = _step2EgText[q];
	            _validS2Inputs[q] = inputText;
    	        
	        }else{
	            //number is bad
	            _step2Inputs[q].style.borderColor = "#F00";
	            _step2Inputs[q].style.borderWidth = "2px";
	            _step2Eg[q].innerHTML = " Invalid value";    	        
	            _validS2Inputs[q] = "";
	        }
    	    
    	    if(_validS2Inputs[q] && _validS2Inputs[q]!=""){
	            _totalMonthly += _validS2Inputs[q]*1;
	        }
    	}
    	
    	
	}
	
	_totalYearly = _totalMonthly * 12;
	_approxValue = _totalYearly * _step2Select.value;
	
    document.getElementById('totalMonthly').innerHTML = _totalMonthly;  	    
    document.getElementById('totalYearly').innerHTML = _totalYearly;	    
    document.getElementById('approxValue').innerHTML = _approxValue;
}


/*============================*/
var _validS3Inputs = [];
var _valueExist = 0;
var _coverNeeded = 0; 

function calculateInputsStep3(){
	_valueExist = 0;
	
	for(q=0; q<_step3Inputs.length; q++){	
	    inputText = _step3Inputs[q].value;
    	
	    if(inputText!="Type..." && inputText!=""){
	        if(isNumeric(inputText)== true && inputText >= 0){
	            //number is good
	            _step3Inputs[q].style.borderColor = "#679000";
	            _step3Inputs[q].style.borderWidth = "1px";
    	        _step3Eg[q].innerHTML = _step3EgText[q];
    	        _step3Eg[q].style.color = "";
	            _validS3Inputs[q] = inputText;
    	        
	        }else{
	            //number is bad
	            _step3Inputs[q].style.borderColor = "#F00";
	            _step3Inputs[q].style.borderWidth = "2px";
	            _step3Eg[q].innerHTML = " Invalid value"; 
	            _step3Eg[q].style.color = "#F00";   	        
	            _validS3Inputs[q] = "";
	        }
    	    
    	    if(_validS3Inputs[q] && _validS3Inputs[q]!=""){
	            _valueExist += _validS3Inputs[q]*1;
	        }
    	}
    	
    	_coverNeeded = _totalDebtExpense - _valueExist;
    	
    	if(_coverNeeded<0){
    	    _coverNeeded *= -1;
    	    _coverNeededText = "-$"+_coverNeeded;
    	}else{
    	    _coverNeededText = "$"+_coverNeeded;
    	}
	    document.getElementById('totalDebtExpenseCovered').innerHTML = _coverNeededText;
	}
}



/*==========================================================
    Common Functions
==========================================================*/
function inputFocus(eventType){
    if(typeof eventType.srcElement!="undefined"){
		srcEl=eventType.srcElement;
	} else {
		srcEl=this;
	}
	
	if(srcEl.value=="Type..."){
	    srcEl.value = "";
	}
}


/*============================*/
function keyHit(){
    alert('hit');
}


/*============================*/
function isNumeric(inputText){
    var validChars = "0123456789.";
    var isNumber=true;
    var character;
 
    for (i = 0; i < inputText.length && isNumber == true; i++){ 
        character = inputText.charAt(i); 
        if (validChars.indexOf(character) == -1){
            isNumber = false;
        }
    }
    return isNumber;
}


/*============================*/
function showStep(stepNum){
    stepNum--;
    for(i=0; i<_step.length; i++){
        if(i!=stepNum){
            _step[i].style.display = "none";
        }else{
            _step[i].style.display = "block";
        }
        
        if(stepNum==2){
            _totalDebtExpense = _totalDebt + _approxValue;
            document.getElementById('totalDebtExpense').innerHTML = _totalDebtExpense;
        }
    }
}


/*==========================================================
    Form and variable reset
==========================================================*/
closeCalculator = function(){
    for(q=0; q<_step1Inputs.length; q++){
        _step1Inputs[q].style.borderColor = "#7F9DB9";
	    _step1Inputs[q].style.borderWidth = "1px";
        _step1Eg[q].innerHTML = _step1EgText[q];
    }

    for(q=0; q<_step2Inputs.length; q++){
        _step2Inputs[q].style.borderColor = "#7F9DB9";
	    _step2Inputs[q].style.borderWidth = "1px";
        _step2Eg[q].innerHTML = _step2EgText[q];
    }
    
    for(q=0; q<_step3Inputs.length; q++){
        _step3Inputs[q].style.borderColor = "#7F9DB9";
	    _step3Inputs[q].style.borderWidth = "1px";
        _step3Eg[q].innerHTML = _step3EgText[q];
    }
    
    document.getElementById('totalDebt').innerHTML = _totalDebt = 0;
    document.getElementById('totalMonthly').innerHTML = _totalMonthly = 0;  	    
    document.getElementById('totalYearly').innerHTML = _totalYearly = 0;	    
    document.getElementById('approxValue').innerHTML = _approxValue = 0;
    document.getElementById('totalDebtExpense').innerHTML = _totalDebtExpense = 0;
    document.getElementById('totalDebtExpenseCovered').innerHTML = "$0";
}

/*==========================================================
    Page Load
==========================================================*/
function calcIni(){
    stepsIni();
    step1Ini();
    step2Ini();
    step3Ini();   
}
addLoadListener(calcIni);