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