Bug fixes

app/utils/map.util.js

@@ -1,7 +1,8 @@
 const csv = require("fast-csv");
 const fs = require("fs");
 const path = require("path");
-const { steps } = require("../config/map.conf");
+const map_conf = require("../config/map.conf");
+const logger = require("./logger.util");
 
 async function addMap(filename, meta, throttle, motor) {
     var total = "";
@@ -24,7 +25,7 @@ async function addMap(filename, meta, throttle, motor) {
         const current_values = Object.values(motor["0"]);
         const brake_values = Object.values(motor["1"]);
         
-        for (let i = 0; i <= steps; i++) {
+        for (let i = 0; i <= map_conf.steps; i++) {
             map[i] = [current_values[i], brake_values[i], throttle_values[i]];
         }
     }
@@ -146,25 +147,33 @@ async function parseMapJson(filename, mode) {
 
 async function getAvailableMaps() {
     // path in app_conf
-    var files = fs.readdirSync("app/storage");
     var available_maps = {};
 
-    for (const file of files) {
+    try {
-        if (path.extname(file) == ".csv") {
+        var files = fs.readdirSync("app/storage");
-            available_maps[file] = {};
     
-            try {
+        for (const file of files) {
-                let meta = await parseMap(file, 1);
+            if (path.extname(file) == ".csv") {
+                available_maps[file] = {};
     
-                if (meta && meta.length) {
+                try {
-                    for (const m of meta) {
+                    let meta = await parseMap(file, 1);
-                        available_maps[file][m.slice(0, m.indexOf(":")).toLowerCase()] = m.slice(m.indexOf(":") + 1)
+    
+                    if (meta && meta.length) {
+                        for (const m of meta) {
+                            available_maps[file][m.slice(0, m.indexOf(":")).toLowerCase()] = m.slice(m.indexOf(":") + 1)
+                        }
                     }
+                } catch (error) {
+                    throw new Error(error);
                 }
-            } catch (error) {
-                throw new Error(error);
             }
         }
+    } catch (error) {
+        if (error.code === "ENOENT") {
+            logger.info("No storage directory found. Creating directory.");
+            fs.mkdirSync("app/storage");
+        }
     }
 
     return available_maps;

app/views/error.ejs

@@ -21,7 +21,10 @@
     <div class="control_div" style="display: flex; flex-direction: row; justify-content: space-between;">
         <label style="font-size: 200%;">CRTelemetry SQLite3</label>
         <div style="display: flex;align-items: center;">
-            <label id="logout" style="cursor: pointer;"><span>&#129092; </span>Logout</label>
+            <label id="add" style="cursor: pointer; margin-right: 10px;"><span>&#43; </span>Add</label>
+            <label id="upload" style="cursor: pointer; margin-left: 10px; margin-right: 10px;"><span>&#129093;
+                </span>Upload</label>
+            <label id="logout" style="cursor: pointer; margin-left: 10px;"><span>&#129092; </span>Logout</label>
         </div>
     </div>
     <div class="main_div">

src/javascript/add.js

@@ -9,6 +9,77 @@ const map_description = document.getElementById("map_description");
 
 var changes = 0;
 
+function setEventListeners(element, cb) {
+    element.onmouseenter = async function () {
+        this.style.backgroundColor = "blue";
+    };
+    element.onmouseleave = async function () {
+        this.style.backgroundColor = "";
+    };
+    element.onmousedown = async function () {
+        this.style.backgroundColor = "red";
+    };
+    element.ondblclick = async function () {
+        cb();
+        this.style.backgroundColor = "blue";
+    };
+}
+
+setEventListeners(commit, async () => {
+    if (changes) {
+        let req_body = {};
+
+        req_body["meta"] = {};
+        req_body["throttle"] = {};
+        req_body["motor"] = { 0: {}, 1: {} };
+
+        if (map_name.style.backgroundColor == "blue") {
+            req_body["meta"]["name"] = map_name.value;
+        }
+        if (map_id.style.backgroundColor == "blue") {
+            req_body["meta"]["id"] = map_id.value;
+        }
+        if (map_description.style.backgroundColor == "blue") {
+            req_body["meta"]["description"] = map_description.value;
+        }
+
+        for (let i = 1; i < throttle_table.rows[1].cells.length; i++) {
+            let e = throttle_table.rows[1].cells[i].firstChild;
+            req_body["throttle"][i - 1] = (e.value ? e.value : e.placeholder);
+        }
+
+        for (let i = 1; i < motor_table.rows[1].cells.length; i++) {
+            let e = motor_table.rows[1].cells[i].firstChild;
+            req_body["motor"][0][i - 1] = (e.value ? e.value : e.placeholder);
+        }
+
+        for (let i = 1; i < motor_table.rows[2].cells.length; i++) {
+            let e = motor_table.rows[2].cells[i].firstChild;
+            req_body["motor"][1][i - 1] = (e.value ? e.value : e.placeholder);
+        }
+
+        try {
+            const response = await fetch("/app/add", {
+                method: "POST",
+                body: JSON.stringify(req_body),
+                headers: {
+                    "Content-Type": "application/json",
+                }
+            });
+            if (!response.ok) {
+                throw new Error(`Response status: ${response.status}`);
+            } else {
+                window.location.href = "/app";
+            }
+        } catch (error) {
+            alert(`Add unsuccessful. ${error.message}`);
+            console.error(error.message);
+        }
+    } else {
+        alert("Nothing to commit.");
+    }
+});
+
 (function () {
     let data = [];
 
@@ -305,76 +376,3 @@ var changes = 0;
         }
     }
 })();
-
-
-
-function setEventListeners(element, cb) {
-    element.onmouseenter = async function () {
-        this.style.backgroundColor = "blue";
-    };
-    element.onmouseleave = async function () {
-        this.style.backgroundColor = "";
-    };
-    element.onmousedown = async function () {
-        this.style.backgroundColor = "red";
-    };
-    element.ondblclick = async function () {
-        cb();
-        this.style.backgroundColor = "blue";
-    };
-}
-
-setEventListeners(commit, async () => {
-    if (changes) {
-        let req_body = {};
-
-        req_body["meta"] = {};
-        req_body["throttle"] = {};
-        req_body["motor"] = { 0: {}, 1: {} };
-
-        if (map_name.style.backgroundColor == "blue") {
-            req_body["meta"]["name"] = map_name.value;
-        }
-        if (map_id.style.backgroundColor == "blue") {
-            req_body["meta"]["id"] = map_id.value;
-        }
-        if (map_description.style.backgroundColor == "blue") {
-            req_body["meta"]["description"] = map_description.value;
-        }
-
-        for (let i = 1; i < throttle_table.rows[1].cells.length; i++) {
-            let e = throttle_table.rows[1].cells[i].firstChild;
-            req_body["throttle"][i - 1] = (e.value ? e.value : e.placeholder);
-        }
-
-        for (let i = 1; i < motor_table.rows[1].cells.length; i++) {
-            let e = motor_table.rows[1].cells[i].firstChild;
-            req_body["motor"][0][i - 1] = (e.value ? e.value : e.placeholder);
-        }
-
-        for (let i = 1; i < motor_table.rows[2].cells.length; i++) {
-            let e = motor_table.rows[2].cells[i].firstChild;
-            req_body["motor"][1][i - 1] = (e.value ? e.value : e.placeholder);
-        }
-
-        try {
-            const response = await fetch("/app/add", {
-                method: "POST",
-                body: JSON.stringify(req_body),
-                headers: {
-                    "Content-Type": "application/json",
-                }
-            });
-            if (!response.ok) {
-                throw new Error(`Response status: ${response.status}`);
-            } else {
-                window.location.href = "/app";
-            }
-        } catch (error) {
-            alert(`Add unsuccessful. ${error.message}`);
-            console.error(error.message);
-        }
-    } else {
-        alert("Nothing to commit.");
-    }
-});

src/javascript/edit.js

@@ -11,7 +11,107 @@ const map_description = document.getElementById("map_description");
 
 var changes = 0;
 
+function setEventListeners(element, cb) {
+    element.onmouseenter = async function () {
+        this.style.backgroundColor = "blue";
+    };
+    element.onmouseleave = async function () {
+        this.style.backgroundColor = "";
+    };
+    element.onmousedown = async function () {
+        this.style.backgroundColor = "red";
+    };
+    element.ondblclick = async function () {
+        cb();
+        this.style.backgroundColor = "blue";
+    };
+}
+
+setEventListeners(remove, async () => {
+    const map_filename = (new URLSearchParams(window.location.search)).get("element");
+
+    try {
+        const response = await fetch(`/app/remove?element=${map_filename}`, {
+            method: "DELETE"
+        });
+        if (!response.ok) {
+            throw new Error(`Response status: ${response.status}`);
+        } else {
+            window.location.href = "/app";
+        }
+    } catch (error) {
+        alert(`Remove unsuccessful. ${error.message}`);
+        console.error(error.message);
+    }
+});
+
+setEventListeners(commit, async () => {
+    if (changes) {
+        const map_filename = (new URLSearchParams(window.location.search)).get("element");
+        let req_body = {};
+
+        req_body["meta"] = {};
+        req_body["throttle"] = {};
+        req_body["motor"] = { 0: {}, 1: {} };
+
+        if (map_name.style.backgroundColor == "blue") {
+            req_body["meta"]["name"] = map_name.value;
+        }
+        if (map_id.style.backgroundColor == "blue") {
+            req_body["meta"]["id"] = map_id.value;
+        }
+        if (map_description.style.backgroundColor == "blue") {
+            req_body["meta"]["description"] = map_description.value;
+        }
+
+        for (let i = 1; i < throttle_table.rows[1].cells.length; i++) {
+            if (throttle_table.rows[1].cells[i].style.backgroundColor == "blue") {
+                req_body["throttle"][i - 1] = throttle_table.rows[1].cells[i].firstChild.value;
+            }
+        }
+
+        for (let i = 1; i < motor_table.rows[1].cells.length; i++) {
+            if (motor_table.rows[1].cells[i].style.backgroundColor == "blue") {
+                req_body["motor"][0][i - 1] = motor_table.rows[1].cells[i].firstChild.value;
+            }
+        }
+
+        for (let i = 1; i < motor_table.rows[2].cells.length; i++) {
+            if (motor_table.rows[2].cells[i].style.backgroundColor == "blue") {
+                req_body["motor"][1][i - 1] = motor_table.rows[2].cells[i].firstChild.value;
+            }
+        }
+
+        try {
+            const response = await fetch(`/app/edit?element=${map_filename}`, {
+                method: "POST",
+                body: JSON.stringify(req_body),
+                headers: {
+                    "Content-Type": "application/json",
+                }
+            });
+            if (!response.ok) {
+                throw new Error(`Response status: ${response.status}`);
+            } else {
+                window.location.href = "/app";
+            }
+        } catch (error) {
+            alert(`Edit unsuccessful. ${error.message}`);
+            console.error(error.message);
+        }
+    } else {
+        alert("Nothing to commit.");
+    }
+});
+
+setEventListeners(download, () => {
+    const map_filename = (new URLSearchParams(window.location.search)).get("element");
+
+    window.location.href = `/app/download?element=${map_filename}`;
+});
+
 var parsed_map = JSON.parse(map);
+
 (function () {
     let data = [];
 
@@ -323,104 +423,3 @@ var parsed_map = JSON.parse(map);
         }
     }
 })();
-
-
-
-function setEventListeners(element, cb) {
-    element.onmouseenter = async function () {
-        this.style.backgroundColor = "blue";
-    };
-    element.onmouseleave = async function () {
-        this.style.backgroundColor = "";
-    };
-    element.onmousedown = async function () {
-        this.style.backgroundColor = "red";
-    };
-    element.ondblclick = async function () {
-        cb();
-        this.style.backgroundColor = "blue";
-    };
-}
-
-setEventListeners(remove, async () => {
-    const map_filename = (new URLSearchParams(window.location.search)).get("element");
-
-    try {
-        const response = await fetch(`/app/remove?element=${map_filename}`, {
-            method: "DELETE"
-        });
-        if (!response.ok) {
-            throw new Error(`Response status: ${response.status}`);
-        } else {
-            window.location.href = "/app";
-        }
-    } catch (error) {
-        alert(`Remove unsuccessful. ${error.message}`);
-        console.error(error.message);
-    }
-});
-
-setEventListeners(commit, async () => {
-    if (changes) {
-        const map_filename = (new URLSearchParams(window.location.search)).get("element");
-        let req_body = {};
-
-        req_body["meta"] = {};
-        req_body["throttle"] = {};
-        req_body["motor"] = { 0: {}, 1: {} };
-
-        if (map_name.style.backgroundColor == "blue") {
-            req_body["meta"]["name"] = map_name.value;
-        }
-        if (map_id.style.backgroundColor == "blue") {
-            req_body["meta"]["id"] = map_id.value;
-        }
-        if (map_description.style.backgroundColor == "blue") {
-            req_body["meta"]["description"] = map_description.value;
-        }
-
-        for (let i = 1; i < throttle_table.rows[1].cells.length; i++) {
-            if (throttle_table.rows[1].cells[i].style.backgroundColor == "blue") {
-                req_body["throttle"][i - 1] = throttle_table.rows[1].cells[i].firstChild.value;
-            }
-        }
-
-        for (let i = 1; i < motor_table.rows[1].cells.length; i++) {
-            if (motor_table.rows[1].cells[i].style.backgroundColor == "blue") {
-                req_body["motor"][0][i - 1] = motor_table.rows[1].cells[i].firstChild.value;
-            }
-        }
-
-        for (let i = 1; i < motor_table.rows[2].cells.length; i++) {
-            if (motor_table.rows[2].cells[i].style.backgroundColor == "blue") {
-                req_body["motor"][1][i - 1] = motor_table.rows[2].cells[i].firstChild.value;
-            }
-        }
-
-        try {
-            const response = await fetch(`/app/edit?element=${map_filename}`, {
-                method: "POST",
-                body: JSON.stringify(req_body),
-                headers: {
-                    "Content-Type": "application/json",
-                }
-            });
-            if (!response.ok) {
-                throw new Error(`Response status: ${response.status}`);
-            } else {
-                window.location.href = "/app";
-            }
-        } catch (error) {
-            alert(`Edit unsuccessful. ${error.message}`);
-            console.error(error.message);
-        }
-    } else {
-        alert("Nothing to commit.");
-    }
-});
-
-setEventListeners(download, () => {
-    const map_filename = (new URLSearchParams(window.location.search)).get("element");
-
-    window.location.href = `/app/download?element=${map_filename}`;
-});

src/javascript/error.js

@@ -1,15 +1,48 @@
+const upload = document.getElementById("upload");
 const logout = document.getElementById("logout");
 
-logout.onmouseenter = async function () {
+function setEventListeners(element, cb) {
-    this.style.backgroundColor = "blue";
+    element.onmouseenter = async function () {
-};
+        this.style.backgroundColor = "blue";
-logout.onmouseleave = async function () {
+    };
-    this.style.backgroundColor = "";
+    element.onmouseleave = async function () {
-};
+        this.style.backgroundColor = "";
-logout.onmousedown = async function () {
+    };
-    this.style.backgroundColor = "red";
+    element.onmousedown = async function () {
-};
+        this.style.backgroundColor = "red";
-logout.ondblclick = async function () {
+    };
-    this.style.backgroundColor = "blue";
+    element.ondblclick = async function () {
+        this.style.backgroundColor = "blue";
+        cb();
+    };
+}
+
+setEventListeners(add, () => {
+    window.location.href = "/app/add";
+});
+
+setEventListeners(upload, async () => {
+    const input = document.getElementById("file_input");
+    const upload = (file) => {
+        const formData = new FormData();
+        formData.append('file', file);
+
+        fetch('/app/upload', {
+            method: 'POST',
+            body: formData
+        }).then((response) => {
+            if (!response.ok) {
+                alert(`Upload unsuccessful. ${response.status}`);
+            } else {
+                location.reload();
+            }
+        });
+    }
+    const onSelectFile = () => upload(input.files[0]);
+    input.addEventListener('change', onSelectFile, false);
+    input.click();
+});
+
+setEventListeners(logout, () => {
     window.location.href = `${window.location.protocol}//logout@${window.location.host}/`;
-};
+});

src/javascript/index.js

@@ -3,8 +3,6 @@ const upload = document.getElementById("upload");
 const logout = document.getElementById("logout");
 const add = document.getElementById("add");
 
-const sql_rows = sql_table.rows;
-
 function setEventListeners(element, cb) {
     element.onmouseenter = async function () {
         this.style.backgroundColor = "blue";
@@ -51,6 +49,8 @@ setEventListeners(logout, () => {
     window.location.href = `${window.location.protocol}//logout@${window.location.host}/`;
 });
 
+const sql_rows = sql_table.rows;
+
 for (let i = 1; i < sql_rows.length; i++) {
     setEventListeners(sql_rows[i], () => {
         window.location.href = `/app/edit?element=${sql_rows[i].cells[0].innerText}`;