99 lines
3.4 KiB
HTML
99 lines
3.4 KiB
HTML
<html style="height: calc(100% - 4em);">
|
|
<header>
|
|
<nolink rel="stylesheet" href="https://cdn.jsdelivr.net/npm/water.css@2/out/light.css">
|
|
<script>
|
|
function http(method, remote, callback, body) {
|
|
var xmlhttp = new XMLHttpRequest();
|
|
xmlhttp.onreadystatechange = function() {
|
|
if (xmlhttp.readyState == XMLHttpRequest.DONE) {
|
|
callback(xmlhttp.responseText, xmlhttp.status)
|
|
}
|
|
};
|
|
xmlhttp.open(method, remote, true);
|
|
if (typeof body == "undefined") {
|
|
body = null
|
|
}
|
|
xmlhttp.send(body);
|
|
}
|
|
function callback(responseBody, responseStatus) {
|
|
}
|
|
function draw(form) {
|
|
path = "/api/bal"
|
|
query = "?x=y"
|
|
Array.from(form.elements).forEach((input) => {
|
|
query += "&" + input.name + "=" + input.value;
|
|
if (input.name == "mode") {
|
|
path = "/api/" + input.value;
|
|
}
|
|
});
|
|
console.log(path, query);
|
|
document.getElementById("graph").src = window.origin + path + query
|
|
}
|
|
function init() {
|
|
const zeroPad = (num, places) => String(num).padStart(places, '0')
|
|
var d = new Date()
|
|
d.setMonth(d.getMonth()-6)
|
|
document.getElementsByName("zoomStart")[0].value = `${d.getFullYear()}-${zeroPad(d.getMonth(), 2)}`
|
|
}
|
|
</script>
|
|
</header>
|
|
<body style="height: 100%;" onload="init();">
|
|
<div id="grapher" style="width: 100%; height: 100%; display: flex; flex-direction: column;">
|
|
<form onsubmit="draw(this); return false;" style="display: flex; flex-direction: row; flex-wrap: wrap; gap: 1em;">
|
|
<span>
|
|
<label for="mode">mode</label>
|
|
<input name="mode" type="text" value="bal"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="likeName">likeName</label>
|
|
<input name="likeName" type="text" value="Bel:AssetAccount"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="chart">chart</label>
|
|
<input name="chart" type="text" value="stack"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="predictionMonths">predictionMonths</label>
|
|
<input name="predictionMonths" type="text" value="120"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="bpi">bpi</label>
|
|
<input name="bpi" type="text" value="true"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="zoomStart">zoomStart</label>
|
|
<input name="zoomStart" type="text" value="YYYY-MM"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="prediction">prediction</label>
|
|
<input name="prediction" type="text" value="interest=Bel:AssetAccount:Cash \$ 0.02&prediction=contributions=Bel:AssetAccount:Bonds $ 1916&prediction=interest=Bel:AssetAccount:Monthly \$ 0.03&prediction=contributions=Bel:AssetAccount:Monthly $ 3500"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="predictFixedGrowth">predictFixedGrowth</label>
|
|
<input name="predictFixedGrowth" type="text" value="VBTLX=0.02&predictFixedGrowth=GLD=0.02&predictFixedGrowth=FXAIX=0.03&predictFixedGrowth=FSPSX=0.03"/>
|
|
</span>
|
|
|
|
<span>
|
|
<label for="whatIf">whatIf</label>
|
|
<input name="whatIf" type="text" value="Bel:AssetAccount:Cash $ -.10000"/>
|
|
</span>
|
|
|
|
<span>
|
|
<input type="submit"/>
|
|
</span>
|
|
</form>
|
|
<iframe id="graph" style="flex-grow: 1;">
|
|
</iframe>
|
|
</div>
|
|
</body>
|
|
<footer>
|
|
</footer>
|
|
</html>
|