Resource Update - March 2025

Changes are made on line:
30, 34, 39, 137, 141, 146, 341, 345, 350, 463-487

1window.Webflow ||= [];
2window.Webflow.push(() => {
3
4  /* SDLT Calculator */
5
6  /* Quering all inputs */
7  const inputs = document.querySelectorAll('.input');
8
9  inputs.forEach((input) => {
10
11    /* Setting the default value of all inputs to 0 */
12    input.value = "0"
13
14    /* Reading the value of an input when the value changes */
15    input.addEventListener('change', (e) => {
16
17      /* Reseeting the value of a input to 0 if left empty */
18      if (e.path[0].value === "") {
19        input.value = "0"
20      }
21    });
22  })
23
24  /*****   Creating variable   *****/
25  /* England and Ireland */
26  var efrom1
27  var efrom2
28  var efrom3
29  var efrom4
30  var efrom5
31  var eto1
32  var eto2
33  var eto3
34  var eto4
35  var erate1
36  var erate2
37  var erate3
38  var erate4
39  var erate5
40  var eaddRate
41
42  /* Wales 1st buyer */
43  var w1from1
44  var w1from2
45  var w1from3
46  var w1from4
47  var w1from5
48  var w1to1
49  var w1to2
50  var w1to3
51  var w1to4
52  var w1rate1
53  var w1rate2
54  var w1rate3
55  var w1rate4
56  var w1rate5
57  var w1addRate
58
59  /* Wales 2nd property */
60  var w2from1
61  var w2from2
62  var w2from3
63  var w2from4
64  var w2from5
65  var w2from6
66  var w2to1
67  var w2to2
68  var w2to3
69  var w2to4
70  var w2to5
71  var w2rate1
72  var w2rate2
73  var w2rate3
74  var w2rate4
75  var w2rate5
76  var w2rate6
77  var w2addRate
78
79  /* Scotland 2nd property */
80  var s2from1
81  var s2from2
82  var s2from3
83  var s2from4
84  var s2from5
85  var s2to1
86  var s2to2
87  var s2to3
88  var s2to4
89  var s2rate1
90  var s2rate2
91  var s2rate3
92  var s2rate4
93  var s2rate5
94  var s2addRate
95
96  /* Scotland 1st buyer */
97  var s1from1
98  var s1from2
99  var s1from3
100  var s1from4
101  var s1from5
102  var s1to1
103  var s1to2
104  var s1to3
105  var s1to4
106  var s1rate1
107  var s1rate2
108  var s1rate3
109  var s1rate4
110  var s1rate5
111
112  /***** End of creating variables *****/
113
114  /*****   API call to airtable to get the data   *****/
115  /* Getting data for England and Northern Ireland */
116  var myHeaders = new Headers();
117  myHeaders.append("Authorization",
118    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
119  );
120  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
121
122  var requestOptions = {
123    method: 'GET',
124    headers: myHeaders,
125    redirect: 'follow'
126  };
127
128  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblcknIFR9BQKOuYY/recAFvSv5TJVqN70k",
129      requestOptions)
130    .then(response => response.text())
131    .then(data => {
132      const parsed = JSON.parse(data)
133      efrom1 = parsed.fields.From1
134      efrom2 = parsed.fields.From2
135      efrom3 = parsed.fields.From3
136      efrom4 = parsed.fields.From4
137      efrom5 = parsed.fields.From5
138      eto1 = parsed.fields.To1
139      eto2 = parsed.fields.To2
140      eto3 = parsed.fields.To3
141      eto4 = parsed.fields.To4
142      erate1 = parsed.fields.Rate1
143      erate2 = parsed.fields.Rate2
144      erate3 = parsed.fields.Rate3
145      erate4 = parsed.fields.Rate4
146      erate5 = parsed.fields.Rate5
147      eaddRate = parsed.fields.AdditonalRate
148    })
149    .catch(error => console.log('error', error))
150
151  /* Getting data for Wales first buyer */
152  var myHeaders = new Headers();
153  myHeaders.append("Authorization",
154    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
155  );
156  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
157
158  var requestOptions = {
159    method: 'GET',
160    headers: myHeaders,
161    redirect: 'follow'
162  };
163
164  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblcknIFR9BQKOuYY/recvhhb9Thgdsz1w5",
165      requestOptions)
166    .then(response => response.text())
167    .then(data => {
168      const parsed = JSON.parse(data)
169      w1from1 = parsed.fields.From1
170      w1from2 = parsed.fields.From2
171      w1from3 = parsed.fields.From3
172      w1from4 = parsed.fields.From4
173      w1from5 = parsed.fields.From5
174      w1to1 = parsed.fields.To1
175      w1to2 = parsed.fields.To2
176      w1to3 = parsed.fields.To3
177      w1to4 = parsed.fields.To4
178      w1rate1 = parsed.fields.Rate1
179      w1rate2 = parsed.fields.Rate2
180      w1rate3 = parsed.fields.Rate3
181      w1rate4 = parsed.fields.Rate4
182      w1rate5 = parsed.fields.Rate5
183      w1addRate = parsed.fields.AdditonalRate
184    })
185    .catch(error => console.log('error', error))
186
187  /* Getting data for Wales second property */
188  var myHeaders = new Headers();
189  myHeaders.append("Authorization",
190    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
191  );
192  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
193
194  var requestOptions = {
195    method: 'GET',
196    headers: myHeaders,
197    redirect: 'follow'
198  };
199
200  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblcknIFR9BQKOuYY/reckxO0344JwJ6reZ",
201      requestOptions)
202    .then(response => response.text())
203    .then(data => {
204      const parsed = JSON.parse(data)
205      w2from1 = parsed.fields.From1
206      w2from2 = parsed.fields.From2
207      w2from3 = parsed.fields.From3
208      w2from4 = parsed.fields.From4
209      w2from5 = parsed.fields.From5
210      w2from6 = parsed.fields.From6
211      w2to1 = parsed.fields.To1
212      w2to2 = parsed.fields.To2
213      w2to3 = parsed.fields.To3
214      w2to4 = parsed.fields.To4
215      w2to5 = parsed.fields.To5
216      w2rate1 = parsed.fields.Rate1
217      w2rate2 = parsed.fields.Rate2
218      w2rate3 = parsed.fields.Rate3
219      w2rate4 = parsed.fields.Rate4
220      w2rate5 = parsed.fields.Rate5
221      w2rate6 = parsed.fields.Rate6
222    })
223    .catch(error => console.log('error', error))
224
225  /* Getting data for Scotland second property */
226  var myHeaders = new Headers();
227  myHeaders.append("Authorization",
228    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
229  );
230  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
231
232  var requestOptions = {
233    method: 'GET',
234    headers: myHeaders,
235    redirect: 'follow'
236  };
237
238  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblcknIFR9BQKOuYY/recXvQikGcuvTlzhJ",
239      requestOptions)
240    .then(response => response.text())
241    .then(data => {
242      const parsed = JSON.parse(data)
243      s2from1 = parsed.fields.From1
244      s2from2 = parsed.fields.From2
245      s2from3 = parsed.fields.From3
246      s2from4 = parsed.fields.From4
247      s2from5 = parsed.fields.From5
248      s2to1 = parsed.fields.To1
249      s2to2 = parsed.fields.To2
250      s2to3 = parsed.fields.To3
251      s2to4 = parsed.fields.To4
252      s2rate1 = parsed.fields.Rate1
253      s2rate2 = parsed.fields.Rate2
254      s2rate3 = parsed.fields.Rate3
255      s2rate4 = parsed.fields.Rate4
256      s2rate5 = parsed.fields.Rate5
257      s2addRate = parsed.fields.AdditonalRate
258    })
259    .catch(error => console.log('error', error))
260
261  /* Getting data for Scotland second property */
262  var myHeaders = new Headers();
263  myHeaders.append("Authorization",
264    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
265  );
266  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
267
268  var requestOptions = {
269    method: 'GET',
270    headers: myHeaders,
271    redirect: 'follow'
272  };
273
274  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblcknIFR9BQKOuYY/recOjsvwFIZIEzZMD",
275      requestOptions)
276    .then(response => response.text())
277    .then(data => {
278      const parsed = JSON.parse(data)
279      s1from1 = parsed.fields.From1
280      s1from2 = parsed.fields.From2
281      s1from3 = parsed.fields.From3
282      s1from4 = parsed.fields.From4
283      s1from5 = parsed.fields.From5
284      s1to1 = parsed.fields.To1
285      s1to2 = parsed.fields.To2
286      s1to3 = parsed.fields.To3
287      s1to4 = parsed.fields.To4
288      s1rate1 = parsed.fields.Rate1
289      s1rate2 = parsed.fields.Rate2
290      s1rate3 = parsed.fields.Rate3
291      s1rate4 = parsed.fields.Rate4
292      s1rate5 = parsed.fields.Rate5
293    })
294    .catch(error => console.log('error', error))
295
296  /***** End of API calls to get data from Airtable *****/
297
298  /****  Triggering the calculator when submitting *****/
299  document.querySelector('#calculate').addEventListener('click', (e) => {
300
301    /* Preventing the default behavior from the form */
302    e.preventDefault()
303    /* Getting values from the form */
304    var price = document.querySelector('#price').value
305    var country = document.querySelector('#country').value
306    if (country != "scotland") {
307      var situation = document.querySelector('#situationNotScotland').value
308    } else {
309      var situation = document.querySelector('#situationScotland').value
310    }
311
312    console.log(situation)
313
314    /* Assign default values to variables*/
315    var bracket5 = 0
316    var bracket6 = 0
317    /*
318    var rate1 = 0.00
319    var rate2 = 0.02
320    var rate3 = 0.05
321    var rate4 = 0.10
322    var rate5 = 0.12
323    */
324    var add = 0
325    var resultName = 'Stamp Duty Land Tax Due:'
326
327    /***** Assign values to variables according to the selection *****/
328    if (country === 'wales') {
329      var resultName = 'Land Transaction Tax Due:'
330    }
331
332    if (country === 'scotland') {
333      var resultName = 'Land and Buildings Transaction Tax Due:'
334    }
335
336    if (country === 'england' || country === 'ireland') {
337      var from1 = efrom1
338      var from2 = efrom2
339      var from3 = efrom3
340      var from4 = efrom4
341      var from5 = efrom5
342      var to1 = eto1
343      var to2 = eto2
344      var to3 = eto3
345      var to4 = eto4
346      var rate1 = erate1
347      var rate2 = erate2
348      var rate3 = erate3
349      var rate4 = erate4
350      var rate5 = erate5
351      var rateAdd = eaddRate
352    }
353
354    if (country === 'wales' && situation === 'first') {
355      var from1 = w1from1
356      var from2 = w1from2
357      var from3 = w1from3
358      var from4 = w1from4
359      var from5 = w1from5
360      var to1 = w1to1
361      var to2 = w1to2
362      var to3 = w1to3
363      var to4 = w1to4
364      var rate1 = w1rate1
365      var rate2 = w1rate2
366      var rate3 = w1rate3
367      var rate4 = w1rate4
368      var rate5 = w1rate5
369    }
370
371    if (country === 'wales' && situation === 'second') {
372      var from1 = w2from1
373      var from2 = w2from2
374      var from3 = w2from3
375      var from4 = w2from4
376      var from5 = w2from5
377      var from6 = w2from6
378      var to1 = w2to1
379      var to2 = w2to2
380      var to3 = w2to3
381      var to4 = w2to4
382      var to5 = w2to5
383      var rate1 = w2rate1
384      var rate2 = w2rate2
385      var rate3 = w2rate3
386      var rate4 = w2rate4
387      var rate5 = w2rate5
388      var rate6 = w2rate6
389    }
390
391    if (country === 'scotland' && (situation === 'second' || situation === 'third')) {
392      var from1 = s2from1
393      var from2 = s2from2
394      var from3 = s2from3
395      var from4 = s2from4
396      var from5 = s2from5
397      var to1 = s2to1
398      var to2 = s2to2
399      var to3 = s2to3
400      var to4 = s2to4
401      var rate1 = s2rate1
402      var rate2 = s2rate2
403      var rate3 = s2rate3
404      var rate4 = s2rate4
405      var rate5 = s2rate5
406      rateAdd = s2addRate
407    }
408
409    if (country === 'scotland' && situation === 'first') {
410      var from1 = s1from1
411      var from2 = s1from2
412      var from3 = s1from3
413      var from4 = s1from4
414      var from5 = s1from5
415      var to1 = s1to1
416      var to2 = s1to2
417      var to3 = s1to3
418      var to4 = s1to4
419      var rate1 = s1rate1
420      var rate2 = s1rate2
421      var rate3 = s1rate3
422      var rate4 = s1rate4
423      var rate5 = s1rate5
424    }
425
426    /* Calculating additional tax if second home is selected */
427    if (country != 'wales' && situation === 'second') {
428      add = price * rateAdd
429    }
430
431    if (country == 'scotland' && situation === 'third') {
432      add = 0
433    }
434
435    /***** Calculating taxes *****/
436    /* Calculating 1st bracket */
437    if (+price > +to1) {
438      var bracket1 = (+to1 - +from1) * +rate1
439    } else if (+price < +from1) {
440      var bracket1 = 0
441    } else {
442      var bracket1 = (+price - +from1) * +rate1
443    }
444
445    /* Calculating 2nd bracket */
446    if (+price > +to2) {
447      var bracket2 = (+to2 - +from2) * +rate2
448    } else if (+price < +from2) {
449      var bracket2 = 0
450    } else {
451      var bracket2 = (+price - +from2) * +rate2
452    }
453
454    /* Calculating 3rd bracket */
455    if (+price > +to3) {
456      var bracket3 = (+to3 - +from3) * +rate3
457    } else if (+price < +from3) {
458      var bracket3 = 0
459    } else {
460      var bracket3 = (+price - +from3) * +rate3
461    }
462
463    /* Calculating 4rd bracket */
464    if (+price > +to4) {
465      var bracket4 = (+to4 - +from4) * +rate4
466    } else if (+price < +from4) {
467      var bracket4 = 0
468    } else {
469      var bracket4 = (+price - +from4) * +rate4
470    }
471
472    /* Calculating 5th bracket */
473    if (country === 'england' || country === 'ireland') {
474      if (+price > +from5) {
475        var bracket5 = (+price - +from5) * +rate5
476      } else {
477        var bracket5 = 0
478      }
479    } else {
480      if (+price > +to5) {
481        var bracket5 = (+to5 - +from4) * +rate5
482      } else if (+price < +from5) {
483        var bracket5 = 0
484      } else {
485        var bracket5 = (+price - +from5) * +rate5
486      }
487    }
488
489    /* Calculating 5th bracket for Wales */
490    if ((country === 'wales' && situation === 'first') || country === 'scotland') {
491      if (+price > +from5) {
492        var bracket5 = (+price - +from5) * +rate5
493      } else {
494        var bracket5 = 0
495      }
496    } else if (country === 'wales' && situation === 'second') {
497      if (+price > +to5) {
498        var bracket5 = (+to5 - +from5) * +rate5
499      } else if (+price < +from5) {
500        var bracket5 = 0
501      } else {
502        var bracket5 = (+price - +from5) * +rate5
503      }
504    }
505
506    /* Calculating 6th bracket for Wales */
507    if (country === 'wales' && situation === 'second') {
508      if (+price > +from6) {
509        var bracket6 = (+price - +from6) * +rate6
510      } else {
511        var bracket6 = 0
512      }
513    }
514
515    /* Adding all numbers and displaying the result */
516    document.querySelector('#total').textContent = (bracket1 + bracket2 + bracket3 +
517      bracket4 + bracket5 + bracket6 + add).toFixed(2).toString().replace(
518      /\B(?=(\d{3})+(?!\d))/g, ",")
519    document.querySelector('#resultName').textContent = resultName
520    /* End of Event Listener */
521  })
522
523  /* Showing the right situation select fields */
524  document.querySelector('#country').addEventListener('change', (e) => {
525    console.log(e.target.value)
526    if (e.target.value === "scotland") {
527      document.querySelector('[scotland]').style.display = "flex"
528      document.querySelector('[notscotland]').style.display = "none"
529
530    } else {
531      document.querySelector('[scotland]').style.display = "none"
532      document.querySelector('[notscotland]').style.display = "flex"
533    }
534  })
535
536});
537

Changes are made on line:
34-60, 68-112

1/* You can remove this Webflow function is your not using webflow to develop your project */
2window.Webflow ||= [];
3window.Webflow.push(() => {
4
5  /*   API call to airtable to get main allowances table  */
6  var myHeaders = new Headers();
7  myHeaders.append("Authorization",
8    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
9  );
10  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
11
12  var requestOptions = {
13    method: 'GET',
14    headers: myHeaders,
15    redirect: 'follow'
16  };
17
18  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblUJeRe8ao2unR2m", requestOptions)
19    .then(response => response.text())
20    .then(data => {
21      const parsed = JSON.parse(data)
22      /* Give the values to the elements on the page from our APi call */
23      document.querySelector('[class1title]').textContent = parsed.records[0].fields[
24        "Class 1 (Employees)"]
25      document.querySelector('[class1employee]').textContent = parsed.records[0].fields
26        .Employee
27      document.querySelector('[class1employer]').textContent = parsed.records[0].fields
28        .Employer
29      document.querySelector('[class2title]').textContent = parsed.records[0].fields[
30        "Class 2 (Self employed)"]
31      document.querySelector('[class2from]').textContent = parsed.records[0].fields[
32        "Year from"]
33      document.querySelector('[class2to]').textContent = parsed.records[0].fields["Year to"]
34      document.querySelector('[flat]').textContent = parsed.records[15].fields[
35        "Class 2 (Self employed)"]
36      document.querySelector('[flat21-22]').textContent = parsed.records[15].fields[
37        "Year from"]
38      document.querySelector('[flat22-23]').textContent = parsed.records[15].fields["Year to"]
39      document.querySelector('[small]').textContent = parsed.records[13].fields[
40        "Class 2 (Self employed)"]
41      document.querySelector('[small21-22]').textContent = parsed.records[13].fields[
42        "Year from"]
43      document.querySelector('[small22-23]').textContent = parsed.records[13].fields[
44        "Year to"]
45      document.querySelector('[class3]').textContent = parsed.records[3].fields[
46        "Class 2 (Self employed)"]
47      document.querySelector('[flat2]').textContent = parsed.records[14].fields[
48        "Class 2 (Self employed)"]
49      document.querySelector('[flat221-22]').textContent = parsed.records[14].fields[
50        "Year from"]
51      document.querySelector('[flat222-23]').textContent = parsed.records[14].fields[
52        "Year to"]
53      document.querySelector('[profit1]').textContent = parsed.records[18].fields[
54        "Class 2 (Self employed)"]
55      document.querySelector('[profit121-22]').textContent = parsed.records[18].fields[
56        "Year from"]
57      document.querySelector('[profit122-23]').textContent = parsed.records[18].fields[
58        "Year to"]
59      document.querySelector('[class3a]').textContent = parsed.records[2].fields[
60        "Class 2 (Self employed)"]
61      document.querySelector('[vary]').textContent = parsed.records[10].fields[
62        "Class 2 (Self employed)"]
63      document.querySelector('[class4]').textContent = parsed.records[1].fields[
64        "Class 2 (Self employed)"]
65      document.querySelector('[profit2]').textContent = parsed.records[4].fields[
66        "Class 2 (Self employed)"]
67      document.querySelectorAll('[pageheading]').forEach(el => el.textContent = parsed
68        .records[7].fields["Class 1 (Employees)"])
69      document.querySelector('[profit3]').textContent = parsed.records[7].fields[
70        "Class 2 (Self employed)"]
71      document.querySelector('[profit321-22]').textContent = parsed.records[7].fields[
72        "Year from"]
73      document.querySelector('[profit322-23]').textContent = parsed.records[7].fields[
74        "Year to"]
75      document.querySelector('[main]').textContent = parsed.records[12].fields[
76        "Class 1 (Employees)"]
77      document.querySelector('[mainemployee]').textContent = parsed.records[12].fields
78        .Employee
79      document.querySelector('[mainemployer]').textContent = parsed.records[12].fields
80        .Employer
81      document.querySelector('[nonic1]').textContent = parsed.records[10].fields[
82        "Class 1 (Employees)"]
83      document.querySelector('[nonic1employee]').textContent = parsed.records[10].fields
84        .Employee
85      document.querySelector('[nonic1employer]').textContent = parsed.records[10].fields
86        .Employer
87      document.querySelector('[nonic2]').textContent = parsed.records[1].fields[
88        "Class 1 (Employees)"]
89      document.querySelector('[nonic2employee]').textContent = parsed.records[1].fields
90        .Employee
91      document.querySelector('[nonic2employer]').textContent = parsed.records[1].fields
92        .Employer
93      document.querySelector('[mainrate]').textContent = parsed.records[16].fields[
94        "Class 1 (Employees)"]
95      document.querySelector('[mainrateemployee]').textContent = parsed.records[16].fields
96        .Employee
97      document.querySelector('[mainrateemployer]').textContent = parsed.records[16].fields
98        .Employer
99      document.querySelector('[earnings]').textContent = parsed.records[9].fields[
100        "Class 1 (Employees)"]
101      document.querySelector('[earningsemployee]').textContent = parsed.records[9].fields
102        .Employee
103      document.querySelector('[earningsemployer]').textContent = parsed.records[9].fields
104        .Employer
105      document.querySelector('[employment]').textContent = parsed.records[4].fields[
106        "Class 1 (Employees)"]
107      document.querySelector('[employmentemployee]').textContent = parsed.records[4].fields
108        .Employee
109      document.querySelector('[employmentemployer]').textContent = parsed.records[4].fields
110        .Employer
111      document.querySelector('[note]').innerHTML = parsed.records[17].fields.Notes
112      document.querySelector('[bottomnote]').innerHTML = parsed.records[7].fields.Notes
113
114      /***** Hiding rows that don't receive content from Airtbale *****/
115      document.querySelectorAll('.tax-data_table-row').forEach((el) => {
116        var children = el.children
117
118        function isNodeEmpty(node) {
119          return !node.textContent.trim();
120        }
121        // Check if all children are empty
122        const allChildrenEmpty = Array.from(children).every(isNodeEmpty);
123        if (allChildrenEmpty) {
124          el.classList.add('hide')
125        }
126      })
127
128      const rows = document.querySelectorAll(
129        '.tax-data_table-row:not(.hide):not(.is--first-row)').forEach((element, index) => {
130        if (index % 2 === 0) {
131          element.style.background = "#FFFFFF"
132        } else {
133          element.classList.add('color-bg')
134        }
135      });
136    })
137    .catch(error => console.log('error', error))
138
139})
140/*****  End of Webflow push function *****/
141

Changes are made on line:
17-18, 36-42, 59, 62, 81-96, 106-109, 118-124

1/* You can remove this Webflow function is your not using webflow to develop your project */
2window.Webflow ||= [];
3window.Webflow.push(() => {
4  /*   API call to airtable to get main allowances table  */
5  var myHeaders = new Headers();
6  myHeaders.append("Authorization",
7    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
8  );
9  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
10
11  var requestOptions = {
12    method: 'GET',
13    headers: myHeaders,
14    redirect: 'follow'
15  };
16
17  let newYear;
18  let pastYear;
19
20  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblHNDCEXfqRF3F33", requestOptions)
21    .then(response => response.text())
22    .then(data => {
23      const parsed = JSON.parse(data)
24      /*console.log(parsed)*/
25      /* Give the values to the elements on the page from our APi call */
26      document.querySelectorAll('[pageheading]').forEach(el => el.textContent = parsed
27        .records[1].fields.Name0)
28      document.querySelector('[payroll1]').textContent = parsed.records[3].fields.Name
29      document.querySelector('[payroll2]').textContent = parsed.records[2].fields.Name
30      document.querySelector('[payroll3]').textContent = parsed.records[4].fields.Name
31      document.querySelector('[payroll4]').textContent = parsed.records[1].fields.Name
32      document.querySelector('[payroll5]').innerHTML = parsed.records[0].fields.Name
33      document.querySelector('[payroll6]').textContent = parsed.records[3].fields.Name0
34      document.querySelector('[payroll7]').textContent = parsed.records[2].fields.Name0
35      document.querySelector('[payroll8]').textContent = parsed.records[4].fields.Name0
36      newYear = parsed.records[3].fields.Notes
37      pastYear = parsed.records[3].fields.Name1
38
39      document.querySelector("#years > option:nth-child(1)").textContent = pastYear
40      document.querySelector("#years > option:nth-child(1)").value = pastYear
41      document.querySelector("#years > option:nth-child(2)").textContent = newYear
42      document.querySelector("#years > option:nth-child(2)").value = newYear
43    })
44
45    .catch(error => console.log('error', error))
46  /*****  End of Webflow push function for API call*****/
47
48  /***** Payroll Calculatyor  *****/
49  const inputs = document.querySelectorAll(".input");
50  inputs.forEach((input) => {
51      (input.value = "0"),
52      input.addEventListener("change", (e) => {
53        "" === e.target.value && (input.value = "0"); //path[0]
54      });
55    }),
56    document.querySelector("#calculate").addEventListener("click", (e) => {
57      e.preventDefault();
58      var salary = document.querySelector("#salary").value,
59        years = document.querySelector("#years").value == pastYear ? true : false,
60
61        country = document.querySelector("#country").value,
62        primaryRate = 0.08,
63        upperRate = 0.02,
64        primaryTreshold = 1048,
65        upperEarnings = 4189,
66        bracket4 = 0,
67        bracket5 = 0,
68        bracket6 = 0,
69        gross1 = 12570,
70        band3 = 0,
71        band4 = 0;
72      if (country != "scotland") {
73        var gross2 = 50270,
74          gross3 = 125140,
75          band1 = 37700,
76          band2 = 74870,
77          taxRate1 = 0.2,
78          taxRate2 = 0.4,
79          taxRate3 = 0.45;
80      } else {
81        var gross2 = years ? 14876 : 15398,
82          gross3 = years ? 26561 : 27492,
83          gross4 = years ? 43662 : 43663,
84          gross5 = 75000,
85          gross6 = 125140,
86          band1 = years ? 2306 : 2827,
87          band2 = years ? 11685 : 12094,
88          band3 = years ? 17101 : 16171,
89          band4 = 31338,
90          band5 = 50140,
91          taxRate1 = 0.19,
92          taxRate2 = 0.2,
93          taxRate3 = 0.21,
94          taxRate4 = 0.42,
95          taxRate5 = 0.45,
96          taxRate6 = 0.48;
97      }
98      revisedTax = (salary > 100000) ? Math.max(0, gross1 - (salary - 100000) * .5) : 12570;
99
100      document.querySelector("#payroll").textContent = revisedTax.toFixed(2).toString()
101        .replace(/\B(?=(\d{3})+(?!\d))/g, ",")
102
103      var additionalTax = salary > 100000 && country != "scotland" ?
104        (gross1 - revisedTax) * taxRate2 :
105        salary > 100000 && country == "scotland" ?
106        (gross1 - revisedTax) * taxRate5 :
107        0;
108
109      // (years ? taxRate4 : taxRate5) : 0
110      if (salary > gross2) var bracket1 = band1 * taxRate1;
111      else if (salary < gross1) var bracket1 = 0;
112      else var bracket1 = (salary - gross1) * taxRate1;
113      if (salary > gross3) var bracket2 = band2 * taxRate2;
114      else if (salary < gross2) var bracket2 = 0;
115      else var bracket2 = (salary - gross2) * taxRate2;
116      var bracket3 = salary > gross4 ? band3 * taxRate3 : salary < gross3 ? 0 : (salary -
117        gross3) * taxRate3;
118      if (country == "scotland" && years == true) {
119        bracket4 = salary > gross5 ? band4 * taxRate4 : salary < gross3 ? 0 : (salary -
120          gross4) * taxRate4
121        bracket5 = salary > gross6 ? band5 * taxRate5 : salary < gross4 ? 0 : (salary -
122          gross5) * taxRate5
123        bracket6 = salary > 125140 ? (salary - 125140) * taxRate6 : 0
124      }
125      if (country == "scotland" && years == false) {
126        bracket4 = salary > gross5 ? band4 * taxRate4 : salary < gross3 ? 0 : (salary -
127          gross4) * taxRate4
128        bracket5 = salary > gross6 ? band5 * taxRate5 : salary < gross4 ? 0 : (salary -
129          gross5) * taxRate5
130        bracket6 = salary > 125140 ? (salary - 125140) * taxRate6 : 0
131      }
132
133      var between = (salary / 12) > upperEarnings ? (upperEarnings - primaryTreshold) *
134        primaryRate : (salary / 12) < primaryTreshold ? 0 : ((salary / 12) -
135          primaryTreshold) * primaryRate
136      var uel = (salary / 12) > upperEarnings ? ((salary / 12) - upperEarnings) * upperRate :
137        0
138      /*(upperEarnings - primaryTreshold) * primaryRate;
139      if (salary / 12 < primaryTreshold) var between = 0;
140      else var between = (salary / 12 - primaryTreshold) * primaryRate;
141      if (salary / 12 > upperEarnings) var uel = (salary / 12 - upperEarnings) * upperRate;
142      else var uel = 0;*/
143      var totalInsurance = (uel + between) * 12;
144
145      /* console.log(bracket1)
146       console.log(bracket2)
147       console.log(bracket3)
148       console.log(bracket4)
149       console.log(bracket5)
150       console.log(bracket6)
151       console.log("additional" + additionalTax)
152       console.log("revised" + revisedTax)
153       console.log("insurance" + totalInsurance)*/
154      document.querySelector("#totalIncome").textContent = (bracket1 + bracket2 + bracket3 +
155          bracket4 + bracket5 + bracket6 + additionalTax)
156        .toFixed(2)
157        .toString()
158        .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
159
160      document.querySelector("#totalInsurance").textContent = totalInsurance
161        .toFixed(2)
162        .toString()
163        .replace(/\B(?=(\d{3})+(?!\d))/g, ",")
164
165      document.querySelector("#totalTaxes").textContent = (bracket1 + bracket2 + bracket3 +
166          bracket4 + bracket5 + bracket6 + additionalTax + totalInsurance)
167        .toFixed(2)
168        .toString()
169        .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
170
171      document.querySelector("#netIncome").textContent = (salary - (bracket1 + bracket2 +
172          bracket3 + bracket4 + bracket5 + bracket6 + additionalTax + totalInsurance))
173        .toFixed(2)
174        .toString()
175        .replace(/\B(?=(\d{3})+(?!\d))/g, ",");
176
177    })
178})
179

Changes are made on line:
170-188

1/* You can remove this Webflow function is your not using webflow to develop your project */
2window.Webflow ||= [];
3window.Webflow.push(() => {
4
5  /*   API call to airtable to get main allowances table  */
6  var myHeaders = new Headers();
7  myHeaders.append("Authorization",
8    "Bearer pat3xBDAwQuPoFK0d.3807c807f50f8c70f0d5f37373927208612efee25ec4fad2d4864a0b157bdc09"
9  );
10  myHeaders.append("Cookie", "brw=brwrmCv4hFJTjFb7C");
11
12  var requestOptions = {
13    method: 'GET',
14    headers: myHeaders,
15    redirect: 'follow'
16  };
17
18  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tbl859m8WhwIV59tT", requestOptions)
19    .then(response => response.text())
20    .then(data => {
21      const parsed = JSON.parse(data)
22      console.log(parsed)
23      /* Give the values to the elements on the page from our APi call */
24      document.querySelector('[ma]').textContent = parsed.records[11].fields[
25        "Main allowances"]
26      document.querySelector('[mato]').textContent = parsed.records[11].fields["Year from"]
27      document.querySelector('[mafrom]').textContent = parsed.records[11].fields["Year to"]
28      document.querySelector('[mapersonal]').textContent = parsed.records[0].fields[
29        "Main allowances"]
30      document.querySelector('[mapersonal21-22]').textContent = parsed.records[0].fields[
31        "Year from"]
32      document.querySelector('[mapersonal22-23]').textContent = parsed.records[0].fields[
33        "Year to"]
34      document.querySelector('[mablind]').textContent = parsed.records[8].fields[
35        "Main allowances"]
36      document.querySelector('[mablind21-22]').textContent = parsed.records[8].fields[
37        "Year from"]
38      document.querySelector('[mablind22-23]').textContent = parsed.records[8].fields[
39        "Year to"]
40      document.querySelector('[maallowwed]').textContent = parsed.records[1].fields[
41        "Main allowances"]
42      document.querySelector('[mamarried]').textContent = parsed.records[2].fields[
43        "Main allowances"]
44      document.querySelector('[mamarried21-22]').textContent = parsed.records[2].fields[
45        "Year from"]
46      document.querySelector('[mamarried22-23]').textContent = parsed.records[2].fields[
47        "Year to"]
48      document.querySelector('[maincome]').textContent = parsed.records[13].fields[
49        "Main allowances"]
50      document.querySelector('[maincome21-22]').textContent = parsed.records[13].fields[
51        "Year from"]
52      document.querySelector('[maincome22-23]').textContent = parsed.records[13].fields[
53        "Year to"]
54      document.querySelector('[madividendsavings]').textContent = parsed.records[12].fields[
55        "Main allowances"]
56      document.querySelector('[madividend]').textContent = parsed.records[3].fields[
57        "Main allowances"]
58      document.querySelector('[madividend21-22]').textContent = parsed.records[3].fields[
59        "Year from"]
60      document.querySelector('[madividend22-23]').textContent = parsed.records[3].fields[
61        "Year to"]
62      document.querySelector('[masavingshigher]').textContent = parsed.records[14].fields[
63        "Main allowances"]
64      document.querySelector('[masavingshigher21-22]').textContent = parsed.records[14]
65        .fields["Year from"]
66      document.querySelector('[masavingshigher22-23]').textContent = parsed.records[14]
67        .fields["Year to"]
68      document.querySelector('[masavingsbasic]').textContent = parsed.records[9].fields[
69        "Main allowances"]
70      document.querySelector('[masavingsbasic21-22]').textContent = parsed.records[9].fields[
71        "Year from"]
72      document.querySelector('[masavingsbasic22-23]').textContent = parsed.records[9].fields[
73        "Year to"]
74      document.querySelector('[rate1title]').textContent = parsed.records[11].fields[
75        "Rate bands"]
76      document.querySelector('[rate1titleto]').textContent = parsed.records[11].fields[
77        "Year from"]
78      document.querySelector('[rate1titlefrom]').textContent = parsed.records[11].fields[
79        "Year to"]
80      document.querySelector('[rate2title]').textContent = parsed.records[11].fields[
81        "Rate bands"]
82      document.querySelector('[rate2titleg]').textContent = parsed.records[11].fields[
83        "General income"]
84      document.querySelector('[rate2titles]').textContent = parsed.records[11].fields[
85        "Savings income"]
86      document.querySelector('[rate2titled]').textContent = parsed.records[11].fields[
87        "Dividend income"]
88      document.querySelectorAll('[mabandsbasic]').forEach((el) => {
89        el.textContent = parsed.records[5].fields["Rate bands"]
90      })
91      document.querySelector('[mabandsbasic21-22]').textContent = parsed.records[5].fields[
92        "Year from"]
93      document.querySelector('[mabandsbasic22-23]').textContent = parsed.records[5].fields[
94        "Year to"]
95      document.querySelector('[mabandsbasicg]').textContent = parsed.records[5].fields[
96        "General income"]
97      document.querySelector('[mabandsbasics]').textContent = parsed.records[5].fields[
98        "Savings income"]
99      document.querySelector('[mabandsbasicd]').textContent = parsed.records[5].fields[
100        "Dividend income"]
101      document.querySelectorAll('[mabandshigher]').forEach((el) => {
102        el.textContent = parsed.records[10].fields["Rate bands"]
103      })
104      document.querySelector('[mabandshigher21-22]').textContent = parsed.records[10].fields[
105        "Year from"]
106      document.querySelector('[mabandshigher22-23]').textContent = parsed.records[10].fields[
107        "Year to"]
108      document.querySelector('[mabandshigherg]').textContent = parsed.records[10].fields[
109        "General income"]
110      document.querySelector('[mabandshighers]').textContent = parsed.records[10].fields[
111        "Savings income"]
112      document.querySelector('[mabandshigherd]').textContent = parsed.records[10].fields[
113        "Dividend income"]
114      document.querySelectorAll('[mabandsadditional]').forEach((el) => {
115        el.textContent = parsed.records[7].fields["Rate bands"]
116      })
117      document.querySelectorAll('[pageheading]').forEach(el => el.textContent = parsed
118        .records[7].fields["Main allowances"])
119      document.querySelector('[mabandsnotes2]').textContent = parsed.records[4].fields[
120        "Main allowances"]
121      document.querySelector('[mabandsadditional21-22]').textContent = parsed.records[7]
122        .fields["Year from"]
123      document.querySelector('[mabandsadditional22-23]').textContent = parsed.records[7]
124        .fields["Year to"]
125      document.querySelector('[mabandsadditionalg]').textContent = parsed.records[7].fields[
126        "General income"]
127      document.querySelector('[mabandsadditionals]').textContent = parsed.records[7].fields[
128        "Savings income"]
129      document.querySelector('[mabandsadditionald]').textContent = parsed.records[7].fields[
130        "Dividend income"]
131      document.querySelector('[manotes]').innerHTML = parsed.records[4].fields.Notes
132      document.querySelector('[mabandsnotes]').innerHTML = parsed.records[6].fields.Notes
133    })
134    .catch(error => console.log('error', error))
135
136  fetch("https://api.airtable.com/v0/apphKFqKdClqcgF26/tblf4WESF6Q7u0fZp", requestOptions)
137    .then(response => response.text())
138    .then(data => {
139      const parsed = JSON.parse(data)
140      /* Give the values to the elements on the page from our APi call */
141      document.querySelectorAll('[pageheading0]').forEach(el => el.textContent = parsed
142        .records[4].fields["Remittance basis charge"])
143      document.querySelector('[rbc]').textContent = parsed.records[3].fields[
144        "Remittance basis charge"]
145      document.querySelector('[rbcto]').textContent = parsed.records[3].fields["Year from"]
146      document.querySelector('[rbcfrom]').textContent = parsed.records[3].fields["Year to"]
147      document.querySelector('[remittance1]').textContent = parsed.records[7].fields[
148        "Remittance basis charge"]
149      document.querySelector('[remittance121-22]').textContent = parsed.records[7].fields[
150        "Year from"]
151      document.querySelector('[remittance122-23]').textContent = parsed.records[7].fields[
152        "Year to"]
153      document.querySelector('[remittance2]').textContent = parsed.records[8].fields[
154        "Remittance basis charge"]
155      document.querySelector('[remittance221-22]').textContent = parsed.records[8].fields[
156        "Year from"]
157      document.querySelector('[remittance222-23]').textContent = parsed.records[8].fields[
158        "Year to"]
159      document.querySelector('[remittance3]').textContent = parsed.records[6].fields[
160        "Remittance basis charge"]
161      document.querySelector('[remittance321-22]').textContent = parsed.records[6].fields[
162        "Year from"]
163      document.querySelector('[remittance322-23]').textContent = parsed.records[6].fields[
164        "Year to"]
165      document.querySelector('[topnote]').innerHTML = parsed.records[4].fields.Notes
166    })
167
168    .catch(error => console.log('error', error))
169
170  //Hide title
171  // Hide any heading (h1, h2, h3, h4) that contains "REMITTANCE BASIS"
172  const headings = document.querySelectorAll("h1, h2, h3, h4");
173
174  headings.forEach(heading => {
175    const text = heading.textContent.trim().toLowerCase();
176    if (text === "remittance basis") {
177      heading.style.display = "none";
178    }
179  });
180
181  const divElements = document.querySelectorAll("div");
182
183  divElements.forEach(div => {
184    if (div.textContent.trim().startsWith(
185        "For non-UK domiciled individuals who have been UK resident in at least")) {
186      div.style.display = "none";
187    }
188  });
189
190  /***** Hiding rows that don't receive content from Airtbale *****/
191  setTimeout(() => {
192    document.querySelectorAll('.tax-data_table-row').forEach((el) => {
193      var children = el.children
194
195      function isNodeEmpty(node) {
196        return !node.textContent.trim();
197      }
198      // Check if all children are empty
199      const allChildrenEmpty = Array.from(children).every(isNodeEmpty);
200      if (allChildrenEmpty) {
201        el.classList.add('hide')
202      }
203    })
204
205    const rows = document.querySelectorAll(
206      '.tax-data_table-row:not(.hide):not(.is--first-row)').forEach((element,
207      index) => {
208      if (index % 2 === 0) {
209        element.style.background = "#FFFFFF"
210      } else {
211        element.classList.add('color-bg')
212      }
213    });
214  }, 1000)
215
216})
217