/* CLEAR FIELDS */
//Declare all the variables that appear on the sliders, the start and end values of each one, and the 
//list values

var dragable1

//Global
var start = 0
var end = 166
var end2 = 234
var sliderwidth = 54

//Loan Amount
var maxAmount = 60
var minAmount = 2


// Initial values on page load
var Amount = 2

// set default values 
function CalculatorInit()
{

var AmountRange = maxAmount - minAmount
var AmountFactor = (end) /  AmountRange
var startAmount = Amount * AmountFactor
//document.getElementById("Amount").style.left = -5 + "px"

}
		
var DragHandler = {

    // private property.
    _oElem : null,


    // public method. Attach drag handler to an element.
    attach : function(oElem) {
        oElem.onmousedown = DragHandler._dragBegin;

        // callbacks
        oElem.dragBegin = new Function();
        oElem.drag = new Function();
        oElem.dragEnd = new Function();

        return oElem;
    },


    // private method. Begin drag process.
    _dragBegin : function(e) {
        var oElem = DragHandler._oElem = this;

        if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; }
        if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0'; }

        var x = parseInt(oElem.style.left);
        var y = parseInt(oElem.style.top);

        e = e ? e : window.event;
        oElem.mouseX = e.clientX;
        oElem.mouseY = e.clientY;

        oElem.dragBegin(oElem, x, y);

        document.onmousemove = DragHandler._drag;
        document.onmouseup = DragHandler._dragEnd;
        return false;
    },


    // private method. Drag (move) element.
    _drag : function(e) {
	


        var oElem = DragHandler._oElem;

        var x = parseInt(oElem.style.left);
        var y = parseInt(oElem.style.top);

        e = e ? e : window.event;
		var position = x + (e.clientX - oElem.mouseX)
		
		if (position >= start && position <= end)
		{
        oElem.style.left = position + 'px';
		}
		
		if (oElem.id == "solution-finder-button"){
		
			var rangeAmount = maxAmount - minAmount
			var factor = rangeAmount/(end-start)
			var AmountReal = (parseInt(oElem.style.left)-start) * factor
			AmountReal = AmountReal
			AmountDisplay = Math.round(AmountReal) + minAmount
			document.getElementById("txtLoanAmount").value = AmountDisplay*1000	
			document.getElementById("solution-finder-total").innerHTML = "&pound;" + AmountDisplay + ",000"	
			if (AmountDisplay == 60){
			    document.getElementById("solution-finder-total").innerHTML = "&pound;" + AmountDisplay + ",000+"	
			}
		}
		
		
        oElem.mouseX = e.clientX;
        oElem.mouseY = e.clientY;
        oElem.drag(oElem, x, y);

        return false;
    },


    // private method. Stop drag process.
    _dragEnd : function() {
        var oElem = DragHandler._oElem;

        var x = parseInt(oElem.style.left);
        var y = parseInt(oElem.style.top);

        oElem.dragEnd(oElem, x, y);

        document.onmousemove = null;
        document.onmouseup = null;
        DragHandler._oElem = null;
    }

}


var DragHandler2 = {

    // private property.
    _oElem : null,


    // public method. Attach drag handler to an element.
    attach : function(oElem) {
        oElem.onmousedown = DragHandler2._dragBegin;

        // callbacks
        oElem.dragBegin = new Function();
        oElem.drag = new Function();
        oElem.dragEnd = new Function();

        return oElem;
    },


    // private method. Begin drag process.
    _dragBegin : function(e) {
        var oElem = DragHandler2._oElem = this;

        if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; }
        if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0'; }

        var x = parseInt(oElem.style.left);
        var y = parseInt(oElem.style.top);

        e = e ? e : window.event;
        oElem.mouseX = e.clientX;
        oElem.mouseY = e.clientY;

        oElem.dragBegin(oElem, x, y);

        document.onmousemove = DragHandler2._drag;
        document.onmouseup = DragHandler2._dragEnd;
        return false;
    },


    // private method. Drag (move) element.
    _drag : function(e) {
	


        var oElem = DragHandler2._oElem;

        var x = parseInt(oElem.style.left);
        var y = parseInt(oElem.style.top);

        e = e ? e : window.event;
		var position = x + (e.clientX - oElem.mouseX)
		
		if (position >= start && position <= end2)
		{
        oElem.style.left = position + 'px';
		}
		
		if (oElem.id == "solution-finder-button"){
		
			var rangeAmount = maxAmount - minAmount
			var factor = rangeAmount/(end2-start)
			var AmountReal = (parseInt(oElem.style.left)-start) * factor
			AmountReal = AmountReal
			AmountDisplay = Math.round(AmountReal) + minAmount
			document.getElementById("txtLoanAmount").value = AmountDisplay*1000	
			document.getElementById("solution-finder-full-total").innerHTML = "&pound;" + AmountDisplay + ",000"	
			if (AmountDisplay == 60){
			    document.getElementById("solution-finder-full-total").innerHTML = "&pound;" + AmountDisplay + ",000+"	
			}
		}
		
		
        oElem.mouseX = e.clientX;
        oElem.mouseY = e.clientY;
        oElem.drag(oElem, x, y);

        return false;
    },


    // private method. Stop drag process.
    _dragEnd : function() {
        var oElem = DragHandler2._oElem;

        var x = parseInt(oElem.style.left);
        var y = parseInt(oElem.style.top);

        oElem.dragEnd(oElem, x, y);

        document.onmousemove = null;
        document.onmouseup = null;
        DragHandler2._oElem = null;
    }

}


function clearfield(fieldname,numeric) {
var field = document.getElementById(fieldname)
if (numeric != 'false'){
    if (isNaN(field.value) == true){
    field.value = ''
  }
}
else
{
	if (field.value == 'Name' || field.value == 'Number' || field.value == 'Search website' || field.value == 'First name' || field.value == 'Surname' || field.value == 'Telephone number')
    {
    field.value = ''
    }
}
}

function populate(original,fieldname,numeric) {
var field = document.getElementById(fieldname)
if (numeric != 'false'){
    if (field.value == '' || isNaN(field.value) == true){
    field.value = original
  }
}
else
{
    if (field.value == ''){
    field.value = original
}
}
}




/* CUSTOM FORM ELEMENTS */
var checkboxHeight = "29";
var radioHeight = "25";
var selectWidth = "218";

document.write('<style type="text/css">input.styled {display:none} select.styled {position:relative; width:' + selectWidth + 'px; opacity:0; filter:alpha(opacity=0); z-index:5} .disabled {opacity:0.5; filter:alpha(opacity=50)}</style>');

var Custom = {
	init: function() {
		var inputs = document.getElementsByTagName("input"), span = Array(), textnode, option, active;
		for(a = 0; a < inputs.length; a++) {
			if((inputs[a].type == "checkbox" || inputs[a].type == "radio") && inputs[a].className == "styled") {
				span[a] = document.createElement("span");
				span[a].className = inputs[a].type;

				if(inputs[a].checked == true) {
					if(inputs[a].type == "checkbox") {
						position = "0 -" + (checkboxHeight*2) + "px";
						span[a].style.backgroundPosition = position;
					} else {
						position = "0 -" + (radioHeight*2) + "px";
						span[a].style.backgroundPosition = position;
					}
				}
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				inputs[a].onchange = Custom.clear;
				if(!inputs[a].getAttribute("disabled")) {
					span[a].onmousedown = Custom.pushed;
					span[a].onmouseup = Custom.check;
				} else {
					span[a].className = span[a].className += " disabled";
				}
			}
		}
		inputs = document.getElementsByTagName("select");
		for(a = 0; a < inputs.length; a++) {
			if(inputs[a].className == "styled") {
				option = inputs[a].getElementsByTagName("option");
				active = option[0].childNodes[0].nodeValue;
				textnode = document.createTextNode(active);
				for(b = 0; b < option.length; b++) {
					if(option[b].selected == true) {
						textnode = document.createTextNode(option[b].childNodes[0].nodeValue);
					}
				}
				span[a] = document.createElement("span");
				span[a].className = "select";
				span[a].id = "select" + inputs[a].name;
				span[a].appendChild(textnode);
				inputs[a].parentNode.insertBefore(span[a], inputs[a]);
				if(!inputs[a].getAttribute("disabled")) {
					inputs[a].onchange = Custom.choose;
				} else {
					inputs[a].previousSibling.className = inputs[a].previousSibling.className += " disabled";
				}
			}
		}
		document.onmouseup = Custom.clear;
	},
	pushed: function() {
		element = this.nextSibling;
		if(element.checked == true && element.type == "checkbox") {
			this.style.backgroundPosition = "0 -" + checkboxHeight*3 + "px";
		} else if(element.checked == true && element.type == "radio") {
			this.style.backgroundPosition = "0 -" + radioHeight*3 + "px";
		} else if(element.checked != true && element.type == "checkbox") {
			this.style.backgroundPosition = "0 -" + checkboxHeight + "px";
		} else {
			this.style.backgroundPosition = "0 -" + radioHeight + "px";
		}
	},
	check: function() {
		element = this.nextSibling;
		if(element.checked == true && element.type == "checkbox") {
			this.style.backgroundPosition = "0 0";
			element.checked = false;
		} else {
			if(element.type == "checkbox") {
				this.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
			} else {
				this.style.backgroundPosition = "0 -" + radioHeight*2 + "px";
				group = this.nextSibling.name;
				inputs = document.getElementsByTagName("input");
				for(a = 0; a < inputs.length; a++) {
					if(inputs[a].name == group && inputs[a] != this.nextSibling) {
						inputs[a].previousSibling.style.backgroundPosition = "0 0";
					}
				}
			}
			element.checked = true;
		}
	},
	clear: function() {
		inputs = document.getElementsByTagName("input");
		for(var b = 0; b < inputs.length; b++) {
			if(inputs[b].type == "checkbox" && inputs[b].checked == true && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 -" + checkboxHeight*2 + "px";
			} else if(inputs[b].type == "checkbox" && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 0";
			} else if(inputs[b].type == "radio" && inputs[b].checked == true && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 -" + radioHeight*2 + "px";
			} else if(inputs[b].type == "radio" && inputs[b].className == "styled") {
				inputs[b].previousSibling.style.backgroundPosition = "0 0";
			}
		}
	},
	choose: function() {
		option = this.getElementsByTagName("option");
		for(d = 0; d < option.length; d++) {
			if(option[d].selected == true) {
				document.getElementById("select" + this.name).childNodes[0].nodeValue = option[d].childNodes[0].nodeValue;
			}
		}
	}
}


function stage2(){
	
	var txtResidentType = document.getElementById("txtResidentType");
	var txtLocation = document.getElementById("txtLocation");
	var txtEmployment = document.getElementById("txtEmployment");
	
	if(txtResidentType.value == "0" || txtLocation.value== "0" || txtEmployment.value== "0"){		
		var msg = "Please make sure that you have completed the following:\n\n";
		msg += (!vrule_debttest(txtLocation.value))?" - Where do you live?\n":"";
		msg += (!vrule_debttest(txtResidentType.value))?" - Are you a homeowner?\n":"";
		msg += (!vrule_debttest(txtEmployment.value))?" - Your employment status\n":"";
		alert(msg);	
	}
	else
	{
	next2()
	}
	
}


function debttest() {
	
	var txtResidentType = document.getElementById("txtResidentType");
	var txtLocation = document.getElementById("txtLocation");
	var txtEmployment = document.getElementById("txtEmployment");
	
	var txtForenames = document.getElementById("txtForenames");
	var txtSurname = document.getElementById("txtSurname");
	var txtMobiletelno = document.getElementById("txtMobiletelno");
	var chkPrivacyPolicy = document.getElementById("chkPrivacyPolicy");
	
	if(chkPrivacyPolicy.checked!= true || txtResidentType.value == "0" || txtLocation.value== "0" || txtEmployment.value == "0" || !vrule_name(txtForenames.value) || !vrule_name(txtSurname.value) || !vrule_telephone(txtMobiletelno.value)){		
		var msg = "Please make sure that you have completed the following:\n\n";
		msg += (!vrule_debttest(txtLocation.value))?" - Where do you live?\n":"";
		msg += (!vrule_debttest(txtResidentType.value))?" - Are you a homeowner?\n":"";
		msg += (!vrule_debttest(txtEmployment.value))?" - Your employment status\n":"";
		msg += (!vrule_name(txtForenames.value))?" - First name\n":"";
		msg += (!vrule_name(txtSurname.value))?" - Surname\n":"";
		msg += (!vrule_telephone(txtMobiletelno.value))?" - A valid phone or mobile number\n":"";
		msg += (!chkPrivacyPolicy.checked==true)?" - Agree to the privacy policy\n":"";

		alert(msg);	
		return false;
	}
	else
	{
	document.getElementById("txtMobiletelno").value = vtidy_telephone(txtMobiletelno.value );
	return true
	}
	}


function validate() {

	var txtForenames = document.getElementById("txtForenames2"); 
	var txtSurname = document.getElementById("txtSurname2"); 
	var txtHometelno = document.getElementById("txtHometelno2"); 
	var txtMobiletelno = document.getElementById("txtMobiletelno2"); 
	var chkPrivacyPolicy = document.getElementById("chkPrivacyPolicy2"); 
	var msg = "";

	
	if (chkPrivacyPolicy.checked == true && vrule_name(txtForenames.value) && vrule_name(txtSurname.value) && (vrule_telephone(txtHometelno.value) || vrule_telephone(txtMobiletelno.value))) {
		// tidy up the field content before submitting
		document.getElementById("txtHometelno2").value = vtidy_telephone( txtHometelno.value );
		document.getElementById("txtMobiletelno2").value = vtidy_telephone( txtMobiletelno.value );
		return true;	
	} else {
		if (!vrule_name(txtForenames.value)){msg = msg + " - First name\n"} 
		if (!vrule_name(txtSurname.value)){msg = msg + " - Surname\n"} 
		if(!vrule_telephone(txtHometelno.value) && !vrule_telephone(txtMobiletelno.value)){msg = msg + " - A valid phone or mobile number\n"} ;
		if(!chkPrivacyPolicy.checked==true){msg = msg + " - Agree to the privacy policy\n"} 
		alert ("Please check the following have been filled correctly\n\n" + msg)
		return false;
	}
}


function validatepopup() {

	var txtForenames = document.getElementById("txtForenames3"); 
	var txtMobiletelno = document.getElementById("txtMobiletelno3"); 
	var chkPrivacyPolicy = document.getElementById("chkPrivacyPolicy3"); 
	var msg = "";

	
	if (chkPrivacyPolicy.checked == true && vrule_name(txtForenames.value) && vrule_telephone(txtMobiletelno.value)) {
		// tidy up the field content before submitting
		document.getElementById("txtMobiletelno3").value = vtidy_telephone( txtMobiletelno.value );
		return true;	
	} else {
		if (!vrule_name(txtForenames.value)){msg = msg + " - Your name\n"} 
		if(!vrule_telephone(txtMobiletelno.value)){msg = msg + " - A valid phone or mobile number\n"} ;
		if(!chkPrivacyPolicy.checked==true){msg = msg + " - Agree to the privacy policy\n"} 
		alert ("Please check the following have been filled correctly\n\n" + msg)
		return false;
	}
}

function vrule_debttest( value ) {
	
	if (value == "0")
	{ return false;}
	else
	{return value;}
}

function vrule_telephone( value ) {
	
	value = vtidy_telephone( value );
	
	telNoPattern = /^\d{11}$/;
	return telNoPattern.test(value);
}

function vtidy_telephone( value ) {
	// strip out any spaces and other junk
	return value.replace( /[^0-9]/g, "");
}

function vrule_name( value ) {
	
	if (value.length == 0 || value == "First name" || value == "Surname" || value== "Name") return false; // name is required
	
	telNoPattern = /^[a-zA-Z\-\' ]*$/;
	
	return telNoPattern.test(value);
}

function vrule_text( value ) {
	
	if (value.length == 0){return false; }
	else
	{return true}
}


function vrule_email( value ) {
	
	if (value.length == 0) return true; // email address is optional
	
	telNoPattern = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,4}$/i;
	
	return telNoPattern.test(value);
}

function searchme(){
	
	var searchBox = document.getElementById('searchBox')
	
	if (searchBox.value == "" || searchBox.value=="Search website"){
		return false
	}
	else
	{
		return true	
	}
}

window.onload = Custom.init;