feat: add splash screen and error handling for URLs

dev-AshishRanjan · dev-AshishRanjan · commit 3324e239d6d8 · 2024-02-26T12:46:22.000+05:30
diff --git a/src/app/error.html b/src/app/error.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="icon" href="../assets/icons/icon_32.png" />
+    <meta http-equiv="Content-Security-Policy" content="script-src 'self'" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link
+      href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;900&family=Poppins:wght@300;400;700&family=Roboto+Mono&family=Ubuntu:wght@300;500;700&display=swap"
+      rel="stylesheet"
+    />
+    <link rel="stylesheet" href="./css/index.css" />
+    <title>Proxy Manager | Error</title>
+  </head>
+  <body>
+    <!-- <h1>Error During URL Load</h1> -->
+    <h2>This service uses <span>Internet Connection</span></h2>
+    <h2>Possible Reasons for Connection drop :</h2>
+    <ol>
+      <li>Usage of Incorrect Proxy</li>
+      <li>No Internet Connection</li>
+      <li>No Proxy used</li>
+    </ol>
+    <!-- <div class="spinner"></div> -->
+  </body>
+</html>
diff --git a/src/index.js b/src/index.js
@@ -77,9 +77,11 @@ const createWindow = () => {
 };
 // create dynamic window
 const createDynamicWindow = (file) => {
+  createSplashScreen();
   dynamicWindow = new BrowserWindow({
     width: isDev ? 1000 : 550,
     height: 600,
+    show: false,
     webPreferences: {
       preload: path.join(__dirname, "preload.js"),
       nodeIntegration: true,
@@ -98,6 +100,19 @@ const createDynamicWindow = (file) => {
   if (isDev) {
     dynamicWindow.webContents.openDevTools();
   }
+
+  dynamicWindow.once("ready-to-show", () => {
+    // dynamicWindow.show();
+    // if (splashScreen) {
+    //   splashScreen.close();
+    // }
+    setTimeout(() => {
+      dynamicWindow.show();
+      if (splashScreen) {
+        splashScreen.close();
+      }
+    }, 500);
+  });
 };
 
 function createSplashScreen() {
@@ -110,6 +125,7 @@ function createSplashScreen() {
     webPreferences: {
       nodeIntegration: true,
     },
+    icon: path.join(__dirname, "./assets/icons/icon_512.png"),
     roundedCorners: true,
     transparent: true, // Set the window to be transparent
   });
@@ -122,9 +138,11 @@ function createSplashScreen() {
 }
 
 const createURLWindow = (file) => {
+  createSplashScreen();
   dynamicWindow = new BrowserWindow({
     width: isDev ? 1000 : 550,
     height: 600,
+    show: false,
     webPreferences: {
       preload: path.join(__dirname, "preload.js"),
       nodeIntegration: true,
@@ -140,9 +158,26 @@ const createURLWindow = (file) => {
   dynamicWindow.setIcon(path.join(__dirname, "./assets/icons/icon_512.png"));
   // and load the index.html of the app.
   dynamicWindow.loadURL("https://aethernex.vercel.app");
+  // did-fail-load
+  dynamicWindow.webContents.on(
+    "did-fail-load",
+    (event, errorCode, errorDescription, validatedURL, isMainFrame) => {
+      // Load a local HTML file if URL loading fails
+      dynamicWindow.loadFile(path.join(__dirname, "./app/error.html"));
+      // console.log({event,errorCode,errorDescription,validatedURL,isMainFrame});
+    }
+  );
   if (isDev) {
     dynamicWindow.webContents.openDevTools();
   }
+  dynamicWindow.once("ready-to-show", () => {
+    setTimeout(() => {
+      dynamicWindow.show();
+      if (splashScreen) {
+        splashScreen.close();
+      }
+    }, 500);
+  });
 };
 
 function showNotification({ title, body }) {
