all repos — piggy @ d8748d219af2eb8f80b1589a04f72614d5638b86

Dead simple finance manager in Go, HTML and JS.

static/js/records-edit.js (view raw)

  1document.addEventListener('DOMContentLoaded', function () {
  2    handleID();
  3
  4    document.getElementById('save').addEventListener('click', submit);
  5    
  6    if (id === 0) {
  7        document.getElementById('delete').style.display = "none";
  8    } else {
  9        document.getElementById('delete').addEventListener('click', remove);
 10    }
 11});
 12
 13let id;
 14
 15async function handleID() {
 16    id = getQueryStringID();
 17    const record = id === 0 ? null : await getRecord(id);
 18    document.getElementById("main-container").appendChild(loadRecord(record));
 19}
 20
 21function loadRecord(record) {
 22    const div = document.createElement("div");
 23    div.setAttribute("data-type", "record");
 24    div.setAttribute("data-id", id);
 25    div.classList.add("record");
 26
 27    // record.type
 28    div.appendChild(newInputText("Type", record?.type, "record-type"));
 29
 30    // record.description
 31    div.appendChild(newInputText("Description", record?.description, "record-description"));
 32
 33    // record.done
 34    div.appendChild(newInputCheckbox("Done", record?.done, "record-done"));
 35
 36    // record.entries
 37    div.appendChild(loadEntries(record?.entries ?? [null], "record-entries"));
 38
 39    return div;
 40}
 41
 42function loadEntries(entries, name) {
 43    const div = document.createElement("div")
 44    div.className = name;
 45    for (const entry of entries) {
 46        div.appendChild(loadEntry(entry));
 47    }
 48    return div;
 49}
 50
 51function loadEntry(entry) {
 52    const div = document.createElement("div");
 53    div.setAttribute("data-type", "entry");
 54    div.setAttribute("data-id", entry?.id ?? 0);
 55    div.classList.add("entry");
 56
 57    // entry.bookmaker_id
 58    div.appendChild(newInputText("Bookmaker ID", entry?.bookmaker_id, "entry-bookmaker_id"))
 59
 60    // entry.account_id
 61    div.appendChild(newInputText("Account ID", entry?.account_id, "entry-account_id"))
 62
 63    // entry.amount
 64    div.appendChild(newInputText("Amount", entry?.amount, "entry-amount"))
 65
 66    // entry.refund
 67    div.appendChild(newInputText("Refund", entry?.refund, "entry-refund"))
 68
 69    // entry.bonus
 70    div.appendChild(newInputText("Bonus", entry?.bonus, "entry-bonus"))
 71
 72    // entry.commission
 73    div.appendChild(newInputText("Commission", entry?.commission, "entry-commission"))
 74
 75    // entry.sub_entries
 76    div.appendChild(loadSubEntries(entry?.sub_entries ?? [null], "entry-subentries"));
 77
 78    return div;
 79}
 80
 81function loadSubEntries(subEntries, name) {
 82    const div = document.createElement("div")
 83    div.className = name;
 84    for (const subEntry of subEntries) {
 85        div.appendChild(loadSubEntry(subEntry));
 86    }
 87    return div;
 88}
 89
 90function loadSubEntry(subEntry) {
 91    const div = document.createElement("div");
 92    div.setAttribute("data-type", "subentry");
 93    div.setAttribute("data-id", subEntry?.id ?? 0);
 94    div.classList.add("subentry");
 95
 96    // subentry.description
 97    div.appendChild(newInputText("Description", subEntry?.description, "subentry-description"));
 98    
 99    // subentry.odds
100    div.appendChild(newInputText("Odds", subEntry?.odds, "subentry-odds"))
101    
102    // subentry.won
103    div.appendChild(newInputCheckbox("Won", subEntry?.won, "subentry-won"));
104    
105    // subentry.date
106    div.appendChild(newInputText("Date", subEntry?.date, "subentry-date"));
107
108    return div;
109}
110
111function getInputValueFromNode(node, name) {
112    const element = node.getElementsByClassName(name)[0];
113    return element.type === "checkbox" ? element.checked : element.value;
114}
115
116function buildRecordObject() {
117    const node = document.getElementsByClassName("record")[0];
118    return {
119        id: +node.getAttribute("data-id"),
120        type: getInputValueFromNode(node, "record-type"),
121        description: getInputValueFromNode(node, "record-description"),
122        done: getInputValueFromNode(node, "record-done"),
123        entries: buildEntriesObject(node.getElementsByClassName("record-entries")[0]),
124    }
125}
126
127function buildEntriesObject(entriesNode) {
128    const entriesNodes = entriesNode.getElementsByClassName("entry");
129    
130    const result = [];
131    for (const node of entriesNodes) {
132        result.push({
133            id: +node.getAttribute("data-id"),
134            bookmaker_id: +getInputValueFromNode(node, "entry-bookmaker_id"),
135            account_id: +getInputValueFromNode(node, "entry-account_id"),
136            amount: +getInputValueFromNode(node, "entry-amount"),
137            sub_entries: buildSubEntriesObject(node.getElementsByClassName("entry-subentries")[0]),
138        });
139    }
140    return result;
141}
142
143function buildSubEntriesObject(subEntriesNode) {
144    const subEntriesNodes = subEntriesNode.getElementsByClassName("subentry");
145    
146    const result = [];
147    for (const node of subEntriesNodes) {
148        result.push({
149            id: +node.getAttribute("data-id"),
150            description: getInputValueFromNode(node, "subentry-description"),
151            odds: +getInputValueFromNode(node, "subentry-odds"),
152            won: getInputValueFromNode(node, "subentry-won"),
153            date: getInputValueFromNode(node, "subentry-date"),
154        });
155    }
156    return result;
157}
158
159async function submit() {
160    if (await saveRecord(buildRecordObject())) {
161        location.href = "/records"
162    }
163}
164
165async function remove() {
166    if (await myConfirm(deleteRecord, id)) {
167        location.href = "/records"
168    }
169}