Add manual firmware update button

Author: 1RandomDev

main/app.js

@@ -72,6 +72,9 @@ app.whenReady().then(() => {
         appSettings = {...appSettings, ...settings};
         saveSettings();
     });
+    ipcMain.handle('settings:updateFirmware', (event, updatePath) => {
+        return deviceController.updateFirmware(updatePath);
+    });
 
     ipcMain.handle('wifiSetup:connect', (event, credentials) => {
         return deviceController.setupWifi(credentials);

main/device-controller.js

@@ -124,7 +124,7 @@ module.exports.getInfo = async () => {
         return {};
     }
 
-    const settings = {};
+    const settings = { ipAddress: deviceAddress };
 
     try {
         let res = await axios.get(`http://${deviceAddress}:8080/getmachinetype`);
@@ -350,15 +350,34 @@ module.exports.getProgress = async () => {
 
 module.exports.control = async (action) => {
     if(!connected) {
-        console.error('Sending control message faild: Not connected');
+        console.error('Sending control message failed: Not connected');
         return;
     }
 
     try {
         await axios.get(`http://${deviceAddress}:8080/cnc/data?action=${action}`);
         if(action == 'stop') await this.executeGcode('M108\nM112 N0\nM9 S0 N0\n');
     } catch(err) {
-        console.error('Sending control message faild:', err);
+        console.error('Sending control message failed:', err);
     }
     return;
 };
+
+module.exports.updateFirmware = async (updatePath) => {
+    if(!connected) {
+        console.error('Firmware update failed: Not connected');
+        return false;
+    }
+
+    try {
+        const form = new FormData();
+        form.append('file', fs.createReadStream(updatePath), 'update.bin');
+
+        const res = await axios.post(`http://${deviceAddress}:8080/upgrade`, form);
+        console.log(res.data);
+        return res.data == 'OK';
+    } catch(err) {
+        console.error('Firmware update failed:', err);
+        return false;
+    }
+}

main/preload.js

@@ -11,6 +11,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
   scanDevices: () => ipcRenderer.invoke('deviceMenu:discover'),
   getSettings: () => ipcRenderer.invoke('settings:get'),
   saveSettings: (settings) => ipcRenderer.invoke('settings:save', settings),
+  updateFirmware: (updatePath) => ipcRenderer.invoke('settings:updateFirmware', updatePath),
   uploadGcode: (path, type) => ipcRenderer.invoke('control:uploadGcode', path, type),
   moveLaser: (direction) => ipcRenderer.invoke('control:moveLaser', direction),
   setLaserDot: (active) => ipcRenderer.invoke('control:setLaserDot', active),

renderer/assets/js/settings.js

@@ -14,6 +14,18 @@ settingsContainer.addEventListener('change', event => {
         settingsContainer.querySelector('[name="crossOffsetY"]').disabled = value == '1';
     }
 });
+document.getElementById('updateButton').addEventListener('click', async event => {
+    let input = document.createElement('input');
+    input.type = 'file';
+    input.accept = '.bin';
+    input.onchange = () => {
+        toastr.success('The device will restart after the update has been completed.', 'Started firmware update');
+        event.target.innerText = 'Uploading...';
+        event.target.disabled = true;
+        window.electronAPI.updateFirmware(input.files[0].path);
+    };
+    input.click();
+});
 
 (async () => {
     const deviceInfo = await window.electronAPI.getDeviceInfo();

renderer/settings.html

@@ -73,13 +73,16 @@ <h3>Device info</h3>
             <label for="firmwareVersion">Firmware version</label>
             <span class="info" name="firmwareVersion"></span>
         </div>
-        <button id="updateButton" class="defaultButton">Check for updates</button>
+        <button id="updateButton" class="defaultButton">Manual Update</button>
 
         <label for="serialNumber">Serial number</label>
         <span class="info" name="serialNumber"></span>
 
         <label for="macAddress">MAC address</label>
         <span class="info" name="macAddress"></span>
+
+        <label for="ipAddress">IP address</label>
+        <span class="info" name="ipAddress"></span>
     </div>
 
     <script src="assets/js/jquery.min.js"></script>