/*
		
		// affecting html
		
		<p>You are borrowing 
			<span>£<strong id="amountText"></strong></span>
			(for <span><strong id="daysText"></strong> days</span>) + interest & fees of <span class="red" id="interest">£95.50</span>
			 = TOTAL <span class="total" id="totalApplication">£848.50</span>
			 
		</p>
	
	*/
		
	$(function() {
		
		$( "#slider1" ).slider({
			
			range: "min",
			value: slider1_default,
			min: 70,
			max: 1000,
			slide: function( event, ui ) {
				
				$( "#amount" ).val( ui.value );
				$( "#amountText" ).text( ui.value );
				
				var interestVar = interest( ui.value );
				$( "#interest" ).text( '£' + interestVar );
				$( "#totalApplication" ).text( '£' + totalPayable( ui.value, interestVar ) );
				
			}
			
		});
		
		$( "#amount" ).val( $( "#slider1" ).slider( "value" ) );
		$( "#amountText" ).text( $( "#slider1" ).slider( "value" ) );
		var interestVar = interest( $( "#slider1" ).slider( "value" ) );
		$( "#interest" ).text( '£' + interestVar );
		$( "#totalApplication" ).text( '£' + totalPayable( $( "#slider1" ).slider( "value" ), interestVar ) );
		
		$( "#slider2" ).slider({
			
			range: "min",
			value: slider2_default,
			min: 1,
			max: 30,
			slide: function( event, ui ) {
				
				$( "#days" ).val( ui.value );
				$( "#daysText" ).text( ui.value );
		
			}
			
		});
		
		$( "#days" ).val( $( "#slider2" ).slider( "value" ) );
		$( "#daysText" ).text( $( "#slider2" ).slider( "value" ) );
	
		function interest( $n ) {
			
			var value = ( $n / 100 );
			var value = Math.round( value ).toFixed(2);
			var value = ( value * 25 );
			return value;
			
		};
	
		function totalPayable( $n, $i ) {
			
			var value = $n + $i;
			var value = ( value );
			return value;
			
		};
	
		
	});