]> git.scottworley.com Git - inverse-tax/commitdiff
UI
authorScott Worley <scottworley@scottworley.com>
Thu, 23 May 2019 23:47:27 +0000 (16:47 -0700)
committerScott Worley <scottworley@scottworley.com>
Thu, 23 May 2019 23:47:27 +0000 (16:47 -0700)
tax.html
tax_ui.js [new file with mode: 0644]

index 3b0ab91f53fde060e199029adc37d33d4d6b7b50..51c323e4ae54a00f57d7c121b8e8b04e2df5211b 100644 (file)
--- a/tax.html
+++ b/tax.html
@@ -2,8 +2,66 @@
 <html>
 <head>
 <script src="tax.js"></script>
-</script>
+<script src="tax_ui.js"></script>
+<style>
+  td { padding: .5em; vertical-align: top}
+  textarea { height: 12em; }
+  input { width: 7em }
+</style>
 </head>
-<body>
+<body onload="calculate()">
+<h1>Inverse income tax tool</h1>
+<p>What gross salary is needed to provide a specified after-tax salary?</p>
+
+<form>
+<table>
+<tr>
+<td>
+Federal deductible<br/><input id="deductible_1" value="24000"/>
+</td>
+<td>
+State deductible<br/><input id="deductible_2" value="8258"/>
+</td>
+</tr>
+<tr>
+<td>
+Federal tax table<br/>
+<textarea id="tax_table_1">     0 10
+ 18651 15
+ 75901 25
+153101 28
+233351 33
+416701 35
+470001 39.6</textarea>
+</td>
+<td>
+State tax table<br/>
+<textarea id="tax_table_2">      0  1
+  16030  2
+  38002  4
+  59978  6
+  83258  8
+ 105224  9.3
+ 537500 10.3
+ 644998 11.3
+1000000 12.3
+1074996 13.3</textarea>
+<br/>(Initial table is California's)
+</td>
+</tr>
+<tr>
+<td colspan="2">
+Desired after-tax salary</br>
+<input id="after_tax" value="100000" onchange="calculate()" oninput="calculate()">
+</td></tr>
+</table>
+</form>
+
+<p><strong><span id="before_tax"></span> before tax</strong>
+   - <span id="tax_1"></span> federal tax
+   - <span id="tax_2"></span> state tax
+   = <span id="after_tax_verification"></span> after tax.</p>
+
+<p>Privacy policy: All calculations are client-side; no figures are sent to any server.</p>
 </body>
 </html>
diff --git a/tax_ui.js b/tax_ui.js
new file mode 100644 (file)
index 0000000..4f2b625
--- /dev/null
+++ b/tax_ui.js
@@ -0,0 +1,24 @@
+function load_tax_table(table_id, deductible_id) {
+  return apply_deductible(parse_tax_table(document.getElementById(table_id).value),
+                          parseFloat(document.getElementById(deductible_id).value));
+}
+
+function format_number(n) {
+  return n.toLocaleString('en', {useGrouping:true, style: 'currency', currency: 'USD'});
+}
+
+function calculate() {
+  const table1 = load_tax_table('tax_table_1', 'deductible_1');
+  const table2 = load_tax_table('tax_table_2', 'deductible_2');
+  const after_tax = parseFloat(document.getElementById('after_tax').value);
+
+  const before_tax = invert(merge_tax_tables(table1, table2))(after_tax);
+
+  const tax1 = tax(table1, before_tax);
+  const tax2 = tax(table2, before_tax);
+
+  document.getElementById('before_tax').textContent = format_number(before_tax);
+  document.getElementById('tax_1').textContent = format_number(tax1);
+  document.getElementById('tax_2').textContent = format_number(tax2);
+  document.getElementById('after_tax_verification').textContent = format_number(before_tax - (tax1 + tax2));
+}