+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="UTF-8">
+<script>
+var suppress_beforeunload = false;
+
+function taint() {
+ // activate buttons "apply", "revert"
+ Array.from(document.getElementsByClassName('enable_on_change')).forEach((el) => {
+ el.disabled = false;
+ el.addEventListener('click', function(e) {
+ suppress_beforeunload = true;
+ });
+ });
+ // deactivate "disable_on_change" span contents
+ function recursive_span_disable(el) {
+ old_nodes = Array.from(el.childNodes);
+ el.innerHTML = '';
+ old_nodes.forEach((node) => {
+ if (node.tagName == 'SPAN') {
+ recursive_span_disable(node);
+ el.appendChild(node);
+ } else if (node.tagName == 'INPUT') {
+ node.disabled = true;
+ el.appendChild(node);
+ } else if (node.tagName == 'A') {
+ const del = document.createElement('del');
+ del.textContent = node.textContent;
+ el.appendChild(del);
+ } else {
+ el.appendChild(node);
+ };
+ });
+ }
+ Array.from(document.getElementsByClassName('disable_on_change')).forEach((el) => {
+ recursive_span_disable(el);
+ });
+ // try to catch user closing or reloading window
+ window.addEventListener('beforeunload', function(e) {
+ if (!suppress_beforeunload) {
+ e.preventDefault();
+ e.returnValue = true;
+ }
+ });
+ // remove oninput handlers no longer needed (since we only ever go one way)
+ Array.from(document.querySelectorAll('*')
+ ).filter(el => (el.oninput !== null)
+ ).forEach(el => el.oninput = null);
+}
+
+</script>
+<style>
+html {
+ scroll-padding-top: 2em;
+}
+body {
+ background: #ffffff;
+ font-family: sans-serif;
+ text-align: left;
+ margin: 0;
+ padding: 0;
+}
+#header {
+ background: #ffffff;
+ position: sticky;
+ top: 0;
+ padding-left: 0.5em;
+ padding-bottom: 0.25em;
+ border-bottom: 1px solid black;
+}
+table.alternating > tbody > tr:nth-child(odd) {
+ background-color: #dcdcdc;
+}
+table.alternating > tbody > tr:nth-child(even) {
+ background: #ffffff;
+}
+td {
+ vertical-align: top;
+}
+.critical {
+ background: #ff6666 !important;
+}
+td.amount {
+ text-align: right;
+}
+td.amount,
+td.currency {
+ font-family: monospace;
+ font-size: 1.25em;
+}
+table.alternating.critical > tbody > tr:nth-child(even) {
+ background-color: #ff8a8a;
+}
+td.balance.amount {
+ width: 10em;
+}
+td.balance.currency {
+ width: 3em;
+}
+td.direct_target {
+ font-weight: bold;
+}
+</style>
+</head>
+<body>
+<div id="header">
+ <form action="" method="POST">
+ <span class="disable_on_change">
+ ledger <a href="/ledger_structured">structured</a>
+ / <a href="/ledger_raw">raw</a>
+ · <a href="/balance">balance</a>
+ · <input type="submit"name="file_load" value="reload" />
+ </span>
+ </form>
+</div>
+<form action="/edit_raw/4" method="POST">
+<span class="disable_on_change">
+<a href="/blocks/3">prev</a>
+<del>next</del>
+</span>
+<input class="enable_on_change"
+ type="submit"
+ name="apply"
+ value="apply"
+ disabled
+ />
+<input class="enable_on_change"
+ type="submit"
+ name="revert"
+ value="revert"
+ disabled
+ />
+<span class="disable_on_change">
+<a href="/edit_structured/4">switch to structured</a>
+·
+<a href="/balance?up_incl=4">balance after</a>
+·
+<a href="/ledger_raw/#block_4">in ledger</a>
+</span>
+<hr />
+<div class="critical">
+ block-wide errors:
+ date < previous date
+ – and:
+</div>
+<hr />
+
+<textarea name="raw_lines"
+ cols=100
+ rows=7
+ oninput="taint()"
+ >
+2001-01-01 test
+ foo:x 10 €
+ foo:x 1 USD
+ bar:x:y -10 €
+ bar:z -1 USD
+
+</textarea>
+</form>
+<table class="alternating critical">
+ <tr>
+ <th>account</th>
+ <th>before</th>
+ <th>diff</th>
+ <th>after</th>
+ </tr>
+ <tr>
+ <td>bar:</td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">1</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">-1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-9</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">-1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td>bar:x:</td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">€</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td class="direct_target">bar:x:y</td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">€</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td class="direct_target">bar:z</td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">-1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td>foo:</td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">20</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+ <tr>
+ <td class="direct_target">foo:x</td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">0</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ <td>
+ <table>
+ <tr>
+ <td class="balance amount">10</td>
+ <td class="balance currency">€</td>
+ </tr>
+ <tr>
+ <td class="balance amount">1</td>
+ <td class="balance currency">USD</td>
+ </tr>
+ </table>
+ </td>
+ </tr>
+</table>
+</body>
+</html>