[inverse-tax] / index.html

<!DOCTYPE html>
<html>
<head>
<script src="tax.js"></script>
<script src="tax_ui.js"></script>
<style>
  td { padding: .5em; vertical-align: top}
  textarea { height: 12em; }
  input { width: 7em }
  .output { padding: 1em; background-color: #eee; border: thin solid #888; width: max-content;  }
  .privacy_policy { margin-top: 5em; }
</style>
</head>
<body onload="calculate()">
<h1>Inverse income tax tool</h1>
<p>What before-tax salary is needed to provide a specified after-tax salary?</p>

<form>
<table>
<tr>
<td>
Federal deductible<br/><input id="deductible_1" value="24000" onchange="calculate()" oninput="calculate()"/>
</td>
<td>
State deductible<br/><input id="deductible_2" value="8258" onchange="calculate()" oninput="calculate()"/>
</td>
</tr>
<tr>
<td>
Federal tax table<br/>
<textarea id="tax_table_1" onchange="calculate()" oninput="calculate()">     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" onchange="calculate()" oninput="calculate()">      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 class="output">
  <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 class="privacy_policy">Privacy policy: All calculations are client-side; no figures are sent to any server.</p>
</body>
</html>
Commit	Line	Data
0993d859 SW	1	<!DOCTYPE html>
	2	<html>
	3	<head>
	4	<script src="tax.js"></script>
d0678fe5 SW	5	<script src="tax_ui.js"></script>
	6	<style>
	7	td { padding: .5em; vertical-align: top}
	8	textarea { height: 12em; }
	9	input { width: 7em }
7a5e093a SW	10	.output { padding: 1em; background-color: #eee; border: thin solid #888; width: max-content; }
7a5e093a SW	11	.privacy_policy { margin-top: 5em; }
d0678fe5	12	</style>
0993d859	13	</head>
d0678fe5 SW	14	<body onload="calculate()">
d0678fe5 SW	15	<h1>Inverse income tax tool</h1>
151ede0f	16	<p>What before-tax salary is needed to provide a specified after-tax salary?</p>
d0678fe5 SW	17
	18	<form>
	19	<table>
	20	<tr>
	21	<td>
86fe1a72	22	Federal deductible<br/><input id="deductible_1" value="24000" onchange="calculate()" oninput="calculate()"/>
d0678fe5 SW	23	</td>
d0678fe5 SW	24	<td>
86fe1a72	25	State deductible<br/><input id="deductible_2" value="8258" onchange="calculate()" oninput="calculate()"/>
d0678fe5 SW	26	</td>
	27	</tr>
	28	<tr>
	29	<td>
	30	Federal tax table<br/>
86fe1a72	31	<textarea id="tax_table_1" onchange="calculate()" oninput="calculate()"> 0 10
d0678fe5 SW	32	18651 15
	33	75901 25
	34	153101 28
	35	233351 33
	36	416701 35
	37	470001 39.6</textarea>
	38	</td>
	39	<td>
	40	State tax table<br/>
86fe1a72	41	<textarea id="tax_table_2" onchange="calculate()" oninput="calculate()"> 0 1
d0678fe5 SW	42	16030 2
	43	38002 4
	44	59978 6
	45	83258 8
	46	105224 9.3
	47	537500 10.3
	48	644998 11.3
	49	1000000 12.3
	50	1074996 13.3</textarea>
	51	<br/>(Initial table is California's)
	52	</td>
	53	</tr>
	54	<tr>
	55	<td colspan="2">
	56	Desired after-tax salary</br>
	57	<input id="after_tax" value="100000" onchange="calculate()" oninput="calculate()">
	58	</td></tr>
	59	</table>
	60	</form>
	61
7a5e093a SW	62	<p class="output">
	63	<strong><span id="before_tax"></span> before tax</strong>
	64	- <span id="tax_1"></span> federal tax
	65	- <span id="tax_2"></span> state tax
	66	= <span id="after_tax_verification"></span> after tax.
	67	</p>
d0678fe5	68
7a5e093a	69	<p class="privacy_policy">Privacy policy: All calculations are client-side; no figures are sent to any server.</p>
0993d859 SW	70	</body>
0993d859 SW	71	</html>