https://www.scotwest.co.uk/wp-content/themes/glasgoweb/assets/js/mortgage-calculator.js?ver=1790280023

1jQuery(document).ready(function($) {
2
3	var $mortgageCalculator = (function() {
4
5		var $form = $('.mortgage-calculator'), // The main form
6			$stage1 = $form.find('.stage-1'), // Numerical input from user
7			$stage2 = $form.find('.stage-2'), // User name and agreement
8			$step1 = $form.find('.step-1'), // The first step - amount and valuation
9			$step2 = $form.find('.step-2'), // The second step - mortgage type and term
10			$loanToValue = $form.find('.loan-to-value'), // The loan to value container
11			$quickResults = $form.find('.quick-results'), // The quick results container
12			$fixedResults = $form.find('.fixed-results'), // The fixed results container
13			$variableResults = $form.find('.variable-results'), // The variable results container
14			$reset = $form.find('.reset-calculator'),
15			$proceedToQuote = $form.find('.proceed-to-quote'),
16			$_loanAmount = $form.find('input[name="loan_amount"]'), // The loan amount input
17			$_valuation = $form.find('input[name="valuation"]'), // The valuation input
18			$_type = $form.find('select[name="type"]'), // The mortgage type input (select)
19			$_paymentTerm = $form.find('input[name="payment_term"]'), // The payment term input
20			$_username = $form.find('input[name="username"]'),
21			$terms = $('.link-mortgage-terms'),
22			$privacy = $('.link-mortgage-privacy'),
23			$formSubmitted = false,
24			$termsRead = false,
25			$privacyRead = false,
26			$termsBox = $('input[name="confirmation"]'),
27
28		init = function() {
29			initEvents();
30		},
31
32		initEvents = function() {
33
34			/*
35			 * The button to submit step one information
36			 */
37			$('.step-1-complete').on('click', function(e) {
38				e.preventDefault();
39				submitStep1();
40			});
41
42			/*
43			 * Intercept enter key on loan amount input
44			 */
45			$_loanAmount.on('keydown', function(e) {
46				if (null == e) {
47					e = window.event;
48				}
49				if (e.keyCode == 13)  {
50					submitStep1();
51					return false;
52				}
53			});
54
55			/*
56			 * Intercept enter key on valuation input
57			 */
58			$_valuation.on('keydown', function(e) {
59				if (null == e) {
60					e = window.event;
61				}
62				if (e.keyCode == 13)  {
63					submitStep1();
64					return false;
65				}
66			});
67
68			/*
69			 * Intercept enter key on valuation input
70			 */
71			$_paymentTerm.on('keydown', function(e) {
72				if (null == e) {
73					e = window.event;
74				}
75				if (e.keyCode == 13)  {
76					submitStep2();
77					return false;
78				}
79			});
80
81			/*
82			 * After filling in the second step
83			 */
84			$('.get-quick-results').on('click', function(e) {
85				e.preventDefault();
86				submitStep2()
87			});
88
89			/*
90			 * Resets the form
91			 */
92			$reset.on('click', function(e) {
93				e.preventDefault();
94				reset();
95			});
96
97			/*
98			 * After quick results, click this button to show the 
99			 * name and confirmation fields
100			 */
101			$proceedToQuote.on('click', function(e) {
102				e.preventDefault();
103				showStep3();
104			});
105
106			$terms.on('click', function() {
107				$termsRead = true;
108				$(this).find('span').tooltip('hide');
109			});
110
111			$privacy.on('click', function() {
112				$privacyRead = true;
113				$(this).find('span').tooltip('hide');
114			});
115
116			$termsBox.on('click', function(e) {
117				if( ! $termsRead || ! $privacyRead ) {
118					e.preventDefault();
119					e.stopPropagation();
120				}
121
122				if( ! $termsRead ) {
123					$terms.find('span').tooltip('show');
124				}
125
126				if( ! $privacyRead ) {
127					$privacy.find('span').tooltip('show');
128				}
129			});
130
131			$form.on('submit', function(e) {
132
133				if( ! $termsRead && $form.find('input[name="staff"]').length < 1 ) {
134					$terms.find('span').tooltip('show');
135					return false;
136				}
137
138				var $this = $(this);
139
140				if( ! $formSubmitted ) {
141					e.preventDefault();
142					
143					$.ajax({
144						type: "POST",
145						url: '/wp-admin/admin-ajax.php',
146						data: {
147							action: "submit_to_gf",
148							form_id: $this.data('form'),
149							values: {
150								input_1: $_loanAmount.val(),
151								input_2: $_valuation.val(),
152								input_3: $_type.find('option:selected').val(),
153								input_4: $_paymentTerm.val(),
154								input_5: $_username.val()
155							}
156						}
157					}).done(function(result) {
158						$formSubmitted = true;
159						$form.submit();
160					});
161				}
162			});
163		},
164
165		reset = function() {
166			$_loanAmount.val('');
167			$_paymentTerm.val('');
168			$_type.val('');
169			$_valuation.val('');
170			$quickResults.hide();
171			$fixedResults.hide();
172			$variableResults.hide();
173			$step2.hide();
174			$loanToValue.hide();
175			$('.step-1-complete').show();
176			$('.fixed-payment-amount').html('');
177			$('.number-fixed-payments').html('');
178			$('.variable-payment-amount').html('');
179			$('.number-variable-payments').html('');
180			$stage1.show();
181			$stage2.hide();
182		},
183
184		submitStep1 = function() {
185			// If the user has filled in all required fields
186			if( validateStep1() ) {
187
188				// Show the loan to value ratio
189				displayLoanToValue();
190
191				getAvailableMortgages();
192
193				// Slide down the second step
194				showStep2();
195			}
196		},
197
198		submitStep2 = function() {
199			displayLoanToValue();
200			
201			if( ! validateStep1() ) {
202				$stage2.hide();
203			}
204
205			if( validateStep2() ) {
206				// Make an ajax request and display the summary information to the user
207				getQuickResults();
208			}
209		},
210
211		/*
212		 * Validate the info submitted in step 1
213		 */
214		validateStep1 = function() {
215
216			var $ltv = calculateLoanToValue();
217
218			$('input[name="ltv"]').val($ltv);
219
220			// Check that neither field has been left empty
221			if( 
222				$_loanAmount.parsley().validate() === true && 
223				$_valuation.parsley().validate() === true && 
224				$('input[name="ltv"]').parsley().validate() === true
225			)  {
226				return true;
227			}
228
229			return false;

230		},
231
232		/*
233		 * Validate the info submitted in step 2
234		 */
235		validateStep2 = function() {
236
237			// Check that neither field has been left empty
238			if( 
239				$_type.parsley().validate() === true && 
240				$_paymentTerm.parsley().validate() === true &&
241				validateStep1()
242			) {
243				return true;
244			}
245
246			return false;
247		},
248
249		/*
250		 * Show the ratio of amount to valuation 
251		 */
252		displayLoanToValue = function() {
253			$loanToValue.show().children().children('span').html(calculateLoanToValue());
254		},
255
256		/*
257		 * Work out the ratio and format it to 2 decimal places
258		 */
259		calculateLoanToValue = function() {
260			return parseFloat($_loanAmount.val() / $_valuation.val() * 100, 2).toFixed(2);
261		},
262
263		/*
264		 * Checks if the mortage is fixed rate (if not then it's variable rate)
265		 */
266		isFixed = function() {
267			return $_type.find('option:selected').val() == 'Fixed';
268		},
269
270		/*
271		 * Show the second step and also hide the button at the end of step 1
272		 */
273		showStep2 = function() {
274			$('.step-1-complete').hide();
275			$step2.slideDown();
276		},
277
278		showStep3 = function() {
279			$stage1.hide();
280			$stage2.show();
281			$('html,body').animate({
282				scrollTop: 0
283			});
284		},
285
286		/*
287		 * Checks whether an input field has been left empty
288		 */
289		isEmpty = function(input) {
290			return $.trim(input) === '' ? true : false;
291		},
292
293		/*
294		 * Makes an ajax request to lib/custom.php. Creates a new mortgage object
295		 * and returns summary values: fixed and variable monthly payments and
296		 * corresponding number of payments
297		 */
298		getQuickResults = function() {
299			$.ajax({
300				type: "GET",
301				url: '/wp-admin/admin-ajax.php',
302				data: $form.serialize()
303			}).done(function(result) {
304				$values = $.parseJSON(result);
305				displayValues($values);
306			});
307		},
308
309		forceRead = function() {
310
311		},
312
313		/**
314		 * Makes an ajax request to lib/custom.php. Checks to see which mortgages
315		 * are available for the given loan to valuation ratio and populates
316		 * the mortgage type dropdown with these.
317		 */
318		getAvailableMortgages = function() {
319			$_type.html('<option value="">Loading...</option>');
320			$.ajax({
321				type: "GET",
322				url: '/wp-admin/admin-ajax.php',
323				data: {
324					valuation: $_valuation.val(),
325					loan_amount: $_loanAmount.val(),
326					action: 'get_available_mortgages'
327				}
328			}).done(function(result) {
329				$_type.html('');
330				$mortgages = $.parseJSON(result);
331				if( ! $.isEmptyObject($mortgages) ) {
332					$.each($mortgages, function(i,v) {
333						$_type.append('<option value="' + i + '">' + v + '</option>');
334					});
335				}
336			});
337		},
338
339		/*
340		 * Display summary values to user. Shows the appropriate section depending
341		 * on whether or not the mortgage is fixed or variable.
342		 */
343		displayValues = function(values) {
344			if( isFixed() ) {
345				$fixedResults.show();
346				$variableResults.hide();
347			} else {
348				$variableResults.show();
349				$fixedResults.hide();
350			}
351			$('.fixed-payment-amount').html(values.fixed_payment_amount);
352			$('.number-fixed-payments').html(values.number_fixed_payments);
353			$('.variable-payment-amount').html(values.variable_payment_amount);
354			$('.number-variable-payments').html(values.number_variable_payments);
355			$('.fixed-annual-interest-rate').html(values.fair);
356			$('.variable-annual-interest-rate').html(values.vair);
357			$quickResults.slideDown();
358			$form.closest('.modal').animate({
359				scrollTop: $quickResults.position().top + 'px'
360			}, 1000);
361		};
362
363		return {init: init};
364
365	})();
366
367	$mortgageCalculator.init();
368
369});