AutoUpdate Display

programmingKyle · programmingKyle · commit 316c980461ca · 2024-02-26T21:25:14.000-05:00
- On launch the new app will be download and an overlay will be visible
- If user clicks quit the application will close (need to make sure downloaded files are deleted)... unfortunately  I can't find a way to ask the user if they want to download the files first... I'll look into a way of giving the user a notificiation for an update
diff --git a/src/autoUpdater.js b/src/autoUpdater.js
@@ -1,3 +1,22 @@
+const updateOverlay_el = document.getElementById('updateOverlay');
+const startUpdateButton_el = document.getElementById('startUpdateButton');
+const quitUpdateButton_el = document.getElementById('quitUpdateButton');
+const updateControlDiv_el = document.getElementById('updateControlDiv');
+
 api.autoUpdaterCallback((status) => {
     console.log(status);
+    if (status === 'Update Available'){
+        updateOverlay_el.style.display = 'flex';
+    }
+    if (status === 'Update Downloaded'){
+        updateControlDiv_el.style.display = 'grid';
+    }
+});
+
+startUpdateButton_el.addEventListener('click', () => {
+    api.restartAndUpdate();
+});
+
+quitUpdateButton_el.addEventListener('click', () => {
+    api.closeApp();
 });
diff --git a/src/index.html b/src/index.html
@@ -7,6 +7,19 @@
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
   </head>
   <body>
+    <div id="updateOverlay" class="overlay" style="display: none;">
+      <div class="stop-container" style="text-align: center;">
+        <div style="display: grid">
+          <h2>Update Available!</h2>
+        </div>
+        <div id="updateControlDiv" style="display: none; grid-template-columns: 1fr 1fr; grid-gap: 5px;">
+          <button id="startUpdateButton" class="input-button">Update</button>
+          <button id="quitUpdateButton" class="input-button">Quit</button>
+        </div>
+      </div>
+    </div>
+
+
     <div id="loopbackOverlay" class="overlay" style="display: none;">
       <div class="loopback-container" style="text-align: center;">
         <div style="display: grid">
diff --git a/src/index.js b/src/index.js
@@ -52,7 +52,7 @@ const createWindow = () => {
         owner: 'programmingKyle',
         repo: 'zerocraft-sync',
       });
-      autoUpdater.checkForUpdates();
+      autoUpdater.checkForUpdatesAndNotify();
     }
   });
 };
@@ -89,7 +89,11 @@ autoUpdater.on('update-not-available', () => {
 
 autoUpdater.on('update-downloaded', () => {
   mainWindow.webContents.send('auto-updater-callback', 'Update Downloaded');
-  ensureSafeQuitAndInstall()
+  //ensureSafeQuitAndInstall();
+});
+
+ipcMain.handle('restart-and-update', () => {
+  ensureSafeQuitAndInstall();
 });
 
 function ensureSafeQuitAndInstall() {
diff --git a/src/preload.js b/src/preload.js
@@ -27,4 +27,6 @@ contextBridge.exposeInMainWorld('api', {
             callback(status);
         });
     },
+
+    restartAndUpdate: () => ipcRenderer.invoke('restart-and-update'),
 });
