peach-workspace/peach-web/static/js/network_detail.js

/*

behavioural layer for the `network_detail.html.tera` template,
corresponding to the web route `/settings/network/wifi?<ssid>`

 - intercept button clicks for connect, disconnect and forget
 - perform json api call
 - update the dom

methods:

 PEACH_NETWORK.connect();
 PEACH_NETWORK.disconnect();
 PEACH_NETWORK.forget();

*/

var PEACH_NETWORK = {};

// catch click of 'Connect' button (form) and make POST request
PEACH_NETWORK.connect = function() {
    document.addEventListener('DOMContentLoaded', function() {
        var connectWifi = document.getElementById('connectWifi');
        if (connectWifi) {
            connectWifi.addEventListener('click', function(e) {
                // prevent form submission (default behavior)
                e.preventDefault();
                // retrieve ssid value and append to form data object
                var ssid = document.getElementById('connectSsid').value;
                // create key:value pair
                var ssidData = { ssid: ssid };
                // perform json serialization
                var jsonData = JSON.stringify(ssidData);
                // write in-progress status message to ui
                PEACH.flashMsg("info", "Connecting to access point...");
                // send add_wifi POST request
                fetch("/api/v1/network/wifi/connect", {
                    method: "post",
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    body: jsonData
                })
                .then( (response) => {
                    return response.json()
                })
                .then( (jsonData) => {
                    // write json response message to ui
                    PEACH.flashMsg(jsonData.status, jsonData.msg);
                })
            }, false);
        };
    });
}

// catch click of 'Disconnect' button and make POST request
PEACH_NETWORK.disconnect = function() {
    document.addEventListener('DOMContentLoaded', function() {
        var disconnectWifi = document.getElementById('disconnectWifi');
        if (disconnectWifi) {
            disconnectWifi.addEventListener('click', function(e) {
                // prevent form submission (default behavior)
                e.preventDefault();
                // retrieve ssid value and append to form data object
                var ssid = document.getElementById('disconnectSsid').value;
                // create key:value pair
                var ssidData = { ssid: ssid };
                // perform json serialization
                var jsonData = JSON.stringify(ssidData);
                // write in-progress status message to ui
                PEACH.flashMsg("info", "Disconnecting from access point...");
                // send disconnect_wifi POST request
                fetch("/api/v1/network/wifi/disconnect", {
                    method: "post",
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    body: jsonData
                })
                .then( (response) => {
                    return response.json()
                })
                .then( (jsonData) => {
                    // write json response message to ui
                    PEACH.flashMsg(jsonData.status, jsonData.msg);
                })
            }, false);
        };
    });
}

// catch click of 'Forget' button (form) and make POST request
PEACH_NETWORK.forget = function() {
    document.addEventListener('DOMContentLoaded', function() {
        var forgetWifi = document.getElementById('forgetWifi');
        if (forgetWifi) {
            forgetWifi.addEventListener('click', function(e) {
                // prevent form submission (default behavior)
                e.preventDefault();
                // retrieve ssid value
                var ssid = document.getElementById('forgetSsid').value;
                // create key:value pair
                var ssidData = { ssid: ssid };
                // perform json serialization
                var jsonData = JSON.stringify(ssidData);
                // write in-progress status message to ui
                PEACH.flashMsg("info", "Removing credentials for access point...");
                // send forget_ap POST request
                fetch("/api/v1/network/wifi/forget", {
                    method: "post",
                    headers: {
                        'Content-Type': 'application/json',
                    },
                    body: jsonData
                })
                .then( (response) => {
                    return response.json()
                })
                .then( (jsonData) => {
                    // write json response message to ui
                    PEACH.flashMsg(jsonData.status, jsonData.msg);
                })
            }, false);
        };
    });
}

var detailInstance = PEACH_NETWORK;
detailInstance.connect();
detailInstance.disconnect();
detailInstance.forget();