74 lines
1.9 KiB
HTML
74 lines
1.9 KiB
HTML
|
<!DOCTYPE html>
|
||
|
<html>
|
||
|
<head>
|
||
|
<meta charset="UTF-8">
|
||
|
</head>
|
||
|
<body>
|
||
|
|
||
|
<div id="config-area">
|
||
|
Surcharge: <input type="number" min="0" value="2" id="surcharge-percent">%
|
||
|
<br>
|
||
|
Debt rate: <input type="number" min="0" value="5" id="debt-percent">% p.a.
|
||
|
<br>
|
||
|
Reward rate: <input type="number" min="0" value="0" id="reward-percent">%
|
||
|
<br>
|
||
|
Debt compounding period: <input type="number" min="1" value="1" id="compounding-period"> Day(s)
|
||
|
<br>
|
||
|
Interest free days: <input type="number" min="1" value="30" id="interest-free-days"> Day(s)
|
||
|
</div>
|
||
|
|
||
|
<hr>
|
||
|
|
||
|
<div id="output" style="white-space:pre;">
|
||
|
</div>
|
||
|
|
||
|
<script type="text/javascript">
|
||
|
function $(query) {
|
||
|
return document.querySelector(query);
|
||
|
}
|
||
|
|
||
|
function output(sz) {
|
||
|
$("#output").textContent = sz;
|
||
|
}
|
||
|
|
||
|
function recalculate() {
|
||
|
var S = + $("#surcharge-percent").value;
|
||
|
var D = + $("#debt-percent").value;
|
||
|
var R = + $("#reward-percent").value;
|
||
|
var T = + $("#compounding-period").value;
|
||
|
var P = + $("#interest-free-days").value;
|
||
|
|
||
|
// @ref http://money.stackexchange.com/questions/72654/what-credit-card-surcharge-rate-should-i-accept
|
||
|
|
||
|
var lhs = (1 + (S - R)/100); // net expense of the surcharge minus the rewards
|
||
|
var rhs = (1 + ((T/365)*D/100)) ** P; // interest that you would pay otherwise
|
||
|
|
||
|
var ret = "DECISION: ";
|
||
|
if (lhs < rhs) {
|
||
|
ret += "Better to use CREDIT.";
|
||
|
} else if (lhs > rhs) {
|
||
|
ret += "Better to use DEBIT.";
|
||
|
} else {
|
||
|
ret += "No difference.";
|
||
|
}
|
||
|
ret += "\n\n";
|
||
|
ret += "Net expense of (surcharge minus rewards): " + lhs + "\n";
|
||
|
ret += "Interest that you would pay otherwise: " + rhs + "\n";
|
||
|
|
||
|
output(ret);
|
||
|
}
|
||
|
|
||
|
function setup() {
|
||
|
var items = document.querySelectorAll("#config-area input");
|
||
|
for (var i = 0; i < items.length; ++i) {
|
||
|
items[i].addEventListener('change', recalculate);
|
||
|
items[i].addEventListener('keyup', recalculate);
|
||
|
}
|
||
|
recalculate();
|
||
|
}
|
||
|
|
||
|
setup();
|
||
|
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|