First workspace commit

2021-08-06 13:58:40 -04:00
parent 87435932dc
commit d8803e9974
251 changed files with 22022 additions and 0 deletions
--- a/peach-web/static/js/network_modify.js
+++ b/peach-web/static/js/network_modify.js
@ -0,0 +1,92 @@
+/*
+
+behavioural layer for the `network_modify.html.tera` template
+
+ - intercept button click for modify (form submission of credentials)
+ - perform json api call
+ - update the dom
+
+methods:
+
+ PEACH_NETWORK.modify();
+ PEACH_NETWORK.flashMsg(status, msg);
+
+*/
+
+var PEACH_NETWORK = {};
+
+// catch click of 'Save' button and make POST request
+PEACH_NETWORK.modify = function() {
+    document.addEventListener('DOMContentLoaded', function() {
+        document.body.addEventListener('submit', function(e) {
+            // prevent redirect on button press (default behavior)
+            e.preventDefault();
+            // capture form data
+            var formElement = document.querySelector("form");
+            // create form data object from the wifiModify form element
+            var formData = new FormData(formElement);
+            var object = {};
+            // assign ssid and pass from form
+            formData.forEach(function(value, key){
+                object[key] = value;
+            });
+            // perform json serialization
+            var jsonData = JSON.stringify(object);
+            // write in-progress status message to ui
+            PEACH_NETWORK.flashMsg("info", "Updating WiFi password...");
+            // send new_password POST request
+            fetch("/api/v1/network/wifi/modify", {
+                method: "post",
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: jsonData
+            })
+            .then( (response) => {
+                return response.json()
+            })
+            .then( (jsonData) => {
+                // write json response message to ui
+                PEACH_NETWORK.flashMsg(jsonData.status, jsonData.msg);
+            })
+        }, false);
+    });
+}
+
+// display a message by appending a paragraph element
+PEACH_NETWORK.flashMsg = function(status, msg) {
+    // set the class of the element according to status
+    var elementClass;
+    if (status === "success") {
+        elementClass = "capsule center-text flash-message font-success";
+    } else if (status === "info") {
+        elementClass = "capsule center-text flash-message font-info";
+    } else {
+        elementClass = "capsule center-text flash-message font-failure";
+    };
+
+    var flashElement = document.getElementById("flashMsg");
+    // if flashElement exists, update the class & text
+    if (flashElement) {
+        flashElement.className = elementClass;
+        flashElement.innerText = msg;
+    // if flashElement does not exist, create it, set id, class, text & append
+    } else {
+        // create new div for flash message
+        var flashDiv = document.createElement("DIV");
+        // set div attributes
+        flashDiv.id = "flashMsg";
+        flashDiv.className = elementClass;
+        // add json response message to flash message div
+        var flashMsg = document.createTextNode(msg);
+        flashDiv.appendChild(flashMsg);
+        // insert the flash message div below the button div
+        var buttonDiv = document.getElementById("buttonDiv");
+        // flashDiv will be added to the end since buttonDiv is the last
+        // child within the parent element (card-container div)
+        buttonDiv.parentNode.insertBefore(flashDiv, buttonDiv.nextSibling);
+    }
+}
+
+var modifyInstance = PEACH_NETWORK;
+modifyInstance.modify();