$(function() {
    
	// create the tooltip
    var $calculator_tooltip = $("<div id=\"calculator_tooltip\"/>")
          .css({ display : "none" })
          .text("")
    
    // create the slider
    $("#calculator_slider").slider({	min: 80,
										max: 750,
										step: 10,
										slide: function(event, ui) {
													calc_update(ui);
												},
										change: function(event, ui) {
													calc_update(ui);
												}
										})
							.find(".ui-slider-handle")
							.append($calculator_tooltip)
       
	
	// add event listener to slide buttons
	$("#calculator_slide_up").click(function() {
		calc_inc("#calculator_slider", 10)
	});
	
	$("#calculator_slide_down").click(function() {
		calc_inc("#calculator_slider", -10)
	});
	
	// add event listener to loan amount
	$("#loanAmount").change(function(){
								
								var loanAmount	 = $("#loanAmount").val();
								var smin		 = $("#calculator_slider").slider( "option", "min");
								var smax		 = $("#calculator_slider").slider( "option", "max");
									
								if (!isNaN(Number(loanAmount))) {
									
									$("#calculator_slider").slider( "option", "value", loanAmount);
									
								} else {
									
									loanAmount	 = $("#calculator_slider").slider( "option", "value");
									
									
									loanAmount	 = (loanAmount < smin) ? smin : loanAmount;
									loanAmount	 = (loanAmount > smax) ? smax : loanAmount;
									
									$("#loanAmount").val(loanAmount);
									
								}
								
							})
							
	$("#loanAmount").keyup(function(){
								
								var loanAmount	 = $("#loanAmount").val();
								var smin		 = $("#calculator_slider").slider( "option", "min");
								var smax		 = $("#calculator_slider").slider( "option", "max");
								
								if (!isNaN(Number(loanAmount)) && loanAmount >= smin && loanAmount <= smax) {
									$("#calculator_slider").slider( "option", "value", loanAmount);
								}
								
							})
	
	
	// display the calculator (we have javascript!)
	$("#calculator").css("display", "block");
		
	// use submitted loan amount or default
	var loanAmountTmp = $("#loanAmountTmp").val();
	if (!isNaN(Number(loanAmountTmp)) && Number(loanAmountTmp) >= $("#calculator_slider").slider("option","min")) {
		$("#calculator_slider").slider( "option", "value", loanAmountTmp);
	} else {
		$("#calculator_slider").slider( "option", "value", 200);
	}
	
});

function calc_update (ui) {
	
	ui.value	 = (ui.value < ui.min) ? ui.min : ui.value;
	ui.value	 = (ui.value > ui.max) ? ui.max : ui.value;
	
	var value	 = ui.value;
	var interest = ui.value * 0.29;
	var repay	 = ui.value + interest;
	
	var fvalue	  = value.toFixed(2);
	var finterest = interest.toFixed(2);
	var frepay	  = repay.toFixed(2);
	
	$("#calculator_borrow").html("&pound;" + fvalue);
	$("#calculator_interest").html("&pound;" + finterest);
	$("#calculator_repay").html("&pound;" + frepay);
	$("#calculator_tooltip").html("&pound;" + value);
	$("#loanAmount").val(value);
	
}

function calc_inc(name, amount) {
	var value = $(name).slider("option","value") + amount;
	if (value > $(name).slider("option","max")) { value = $(name).slider("option","max"); }
	if (value < $(name).slider("option","min")) { value = $(name).slider("option","min"); }
	$(name).slider("option", "value", value);
}