Play button

- Fixed #2
- Play button done
- Notifications when an error occurs in main process
- Moved launcher info request to renderer
- Few deps updated
- zIndex changes
- VersionSelector dialog moved to mantine's modal

index.js

@@ -24,6 +24,10 @@ async function createWindow() {
         title: "SE3 Launcher",
     });
 
+    process.on("uncaughtException", (ex) => {
+        mainWindow.webContents.send("uncaught_exception", ex);
+    });
+
     require("@electron/remote/main").enable(mainWindow.webContents);
     if (isDev) {
         mainWindow.setMenuBarVisibility(false); // dev tools
@@ -50,4 +54,4 @@ app.whenReady().then(() => {
 
 app.on("window-all-closed", function () {
     if (process.platform !== "darwin") app.quit();
-});
+});

main/RendererBridge.js

@@ -64,7 +64,6 @@ const RendererBridge = () => {
     ExportAsync("get_installed_versions", GetInstalledVersions);
     ExportAsync("uninstall_version", UninstallVersion);
     Export("run_version", RunVersion);
-    ExportAsync("get_launcher_info", SE3Api.GetLauncherInfo);
 };
 
 module.exports = RendererBridge;

main/SE3Api.js

@@ -41,19 +41,6 @@ const GetVersions = async () => {
     }
 };
 
-/**
- * Gets launcher info (markdown)
- * 
- * @returns {String} markdown launcher info
- */
-const GetLauncherInfo = async () => {
-    return (
-        await axios.get(se3ApiSettings.GetLauncherInfo(), {
-            transformResponse: [],
-        })
-    ).data;
-};
-
 /**
  * Gets link to version's zip file
  * 
@@ -71,6 +58,5 @@ const GetVersionZipFile = async(versionTag) => {
 
 module.exports = {
     GetVersions,
-    GetLauncherInfo,
     GetVersionZipFile
 };

package.json

@@ -1,7 +1,7 @@
 {
     "name": "se3-launcher",
     "description": "Launcher for Space Eternity 3",
-    "version": "3.0.0-alpha.1",
+    "version": "3.0.0-alpha.2",
     "private": true,
     "homepage": "./",
     "main": "index.js",
@@ -13,7 +13,7 @@
     "devDependencies": {
         "concurrently": "^7.2.1",
         "cross-env": "^7.0.3",
-        "electron": "^19.0.3",
+        "electron": "^19.0.4",
         "electron-builder": "^23.0.3",
         "react": "^17.0.2",
         "react-dom": "^17.0.2",
@@ -57,7 +57,7 @@
         "axios": "^0.27.2",
         "decompress": "^4.2.1",
         "electron-is": "^3.0.0",
-        "electron-store": "^8.0.1",
+        "electron-store": "^8.0.2",
         "github-markdown-css": "^5.1.0",
         "lodash": "^4.17.21",
         "react-markdown": "^8.0.3",

preload.js

@@ -8,7 +8,7 @@ window.addEventListener("DOMContentLoaded", () => {
     // Open external links in browser
     document.querySelector("body").addEventListener("click", (event) => {
         if (event.target.tagName.toLowerCase() === "a") {
-            if (!['https:', 'http:'].includes(new URL(event.target.href).protocol)) return;
+            if (!["https:", "http:"].includes(new URL(event.target.href).protocol)) return;
             const absoluteUrl = new RegExp("^(?:[a-z]+:)?//", "i");
             event.preventDefault();
             if (!absoluteUrl.test(event.target.href)) return;
@@ -74,8 +74,8 @@ const InstallVersion = (settings) => {
     return {
         Cancel: () => {
             ipcRenderer.invoke("installer_cancel", id);
-        }
-    }
+        },
+    };
 };
 
 const deleteWorker = (id) => {
@@ -106,21 +106,21 @@ ipcRenderer.on("installer_error", (event, id, err) => {
     deleteWorker(id);
 });
 
-const IsVersionInstalled = async(versionTag) => {
+const IsVersionInstalled = async (versionTag) => {
     return await ipcRenderer.invoke("is_version_installed", versionTag);
 };
 
-const GetInstalledVersions = async() => {
+const GetInstalledVersions = async () => {
     return await ipcRenderer.invoke("get_installed_versions");
 };
 
-const UninstallVersion = async(versionTag) => {
+const UninstallVersion = async (versionTag) => {
     return await ipcRenderer.invoke("uninstall_version", versionTag);
-}
+};
 
-const RunVersion = async(versionTag) => {
+const RunVersion = async (versionTag) => {
     return await ipcRenderer.invoke("run_version", versionTag);
-}
+};
 
 contextBridge.exposeInMainWorld("se3Api", {
     GetVersions,
@@ -129,5 +129,35 @@ contextBridge.exposeInMainWorld("se3Api", {
     IsVersionInstalled,
     GetInstalledVersions,
     UninstallVersion,
-    RunVersion
+    RunVersion,
 });
+
+// I was thinking about making a less spaghetti code library for this shit (Main < --- > Preload < --- > Renderer)
+(() => {
+    let listeners = {};
+
+    const callListener = (name, ...args) => {
+        if (!(name in listeners) || !Array.isArray(listeners[name])) return;
+        for (const callback of listeners[name]) {
+            callback(...args);
+        }
+    }
+
+    contextBridge.exposeInMainWorld("listeners", {
+        add: (name, callback) => {
+            if (!(name in listeners) || !Array.isArray(listeners[name])) listeners[name] = [];
+            listeners[name].push(callback);
+        },
+        remove: (name) => {
+            if (!(name in listeners) || !Array.isArray(listeners[name])) return;
+            listeners[name] = [];
+        },
+        test: (ex) => {
+            callListener("uncaught_exception", ex);
+        }
+    });
+
+    ipcRenderer.on("uncaught_exception", (event, err) => {
+        callListener("uncaught_exception", err);
+    });
+})();

src/App.js

@@ -2,36 +2,90 @@ import styles from "./styles/App.module.css";
 import "github-markdown-css/github-markdown-dark.css";
 import { useEffect, useState } from "react";
 import VersionSelector from "./VersionSelector";
-import { GetInstalledVersions, GetVersions, InstallVersion, UninstallVersion } from "./SE3Api/versionsApi";
+import { GetInstalledVersions, GetVersions, InstallVersion, IsVersionInstalled, UninstallVersion } from "./SE3Api/versionsApi";
 import { GetLauncherInfo } from "./SE3Api/launcherApi";
 import HomePage from "./HomePage";
 import { showNotification, updateNotification } from "@mantine/notifications";
-import { Container, Tabs } from "@mantine/core";
+import { Container, Tabs, Text } from "@mantine/core";
 import { useModals } from "@mantine/modals";
 import remarkGfm from "remark-gfm";
 import ReactMarkdown from "react-markdown";
 import { humanFileSize } from "./utils";
 import { throttle } from "lodash";
 import InstalledVersion from "./InstalledVersion";
 
+let versions = {};
+
 export default function App() {
     const [activeTab, setActiveTab] = useState(0);
     const [versionsSelectorVersions, setVersionsSelectorVersions] = useState([]);
     const [versionSelectorShown, setVersionSelectorShown] = useState(false);
     const [launcherText, setLauncherText] = useState("Failed to load launcher info");
     const [installedVersions, setInstalledVersions] = useState([]);
+    const [playButtonText, setPlayButtonText] = useState("Play");
     const modals = useModals();
 
+    const updateInstalledVersions = async () => {
+        const installedVersions = await GetInstalledVersions();
+        setInstalledVersions(installedVersions);
+
+        if (await IsVersionInstalled(versions.latest)) setPlayButtonText("Play");
+        else if (installedVersions.length > 0) setPlayButtonText("Update");
+        else setPlayButtonText("Install");
+    };
+
     useEffect(() => {
         (async () => {
-            setLauncherText(await GetLauncherInfo());
-            setInstalledVersions(await GetInstalledVersions());
+            try {
+                setLauncherText(await GetLauncherInfo());
+            }
+            catch (ex) {
+
+            }
+
+            versions = await GetVersions();
+            if (!versions) {
+                showNotification({
+                    title: "Failed to get versions. Check your internet connection.",
+                    color: "red",
+                    autoClose: true,
+                    disallowClose: false
+                })
+            }
+            updateInstalledVersions();
         })();
     }, []);
 
-    const updateInstalledVersions = async () => {
-        setInstalledVersions(await GetInstalledVersions());
-    };
+    useEffect(() => {
+        window.listeners.add("uncaught_exception", (err) => {
+            showNotification({
+                color: "red",
+                title: "Error ocurred in main process.",
+                message: (
+                    <div>
+                        <code>{`${err}`}</code>
+                        <br />
+                        <br />
+                        If the error keeps appearing, please report it on{" "}
+                        <Text variant="link" component="a" href="https://github.com/Space-Eternity-3/SE3-Launcher/issues">
+                            Github
+                        </Text>{" "}
+                        or{" "}
+                        <Text variant="link" component="a" href="https://discord.gg/e4ppBTRKhg">
+                            our discord server
+                        </Text>
+                        .
+                    </div>
+                ),
+                disallowClose: false,
+                autoClose: true,
+            });
+        });
+
+        return () => {
+            window.listeners.remove("uncaught_exception");
+        };
+    }, []);
 
     const VersionSelectorVersions = async () => {
         const versions = await GetVersions();
@@ -74,6 +128,7 @@ export default function App() {
                     color: "orange",
                 },
                 centered: true,
+                zIndex: 999,
             });
         };
 
@@ -144,6 +199,7 @@ export default function App() {
                     autoClose: true,
                     disallowClose: false,
                     loading: false,
+                    color: "red"
                 });
                 updateInstalledVersions();
             },
@@ -191,9 +247,15 @@ export default function App() {
                 color: "red",
             },
             centered: true,
+            zIndex: 999,
         });
     };
 
+    const openVersionSelector = () => {
+        setActiveTab(1);
+        showVersionSelector();
+    }
+
     return (
         <Container>
             <Tabs
@@ -204,7 +266,7 @@ export default function App() {
                 }}
             >
                 <Tabs.Tab label="Home">
-                    <HomePage />
+                    <HomePage openVersionSelector={openVersionSelector} versions={versions} playButtonText={playButtonText} />
                 </Tabs.Tab>
                 <Tabs.Tab label="Versions">
                     <div className={styles.versionsContainer}>

src/HomePage.js

@@ -1,6 +1,7 @@
+import { IsVersionInstalled, RunVersion } from "./SE3Api/versionsApi";
 import styles from "./styles/HomePage.module.css";
 
-export default function HomePage() {
+export default function HomePage({ playButtonText, versions, openVersionSelector }) {
     return (
         <div style={{
             position: "absolute",
@@ -14,7 +15,10 @@ export default function HomePage() {
                 <div className={styles.content}>Space Eternity 3</div>
             </div>
             <div className={styles.playContainer}>
-                <button className={styles.playButton}>Play</button>
+                <button onClick={async() => {
+                    if (await IsVersionInstalled(versions.latest)) RunVersion(versions.latest);
+                    else openVersionSelector();
+                }} className={styles.playButton}>{`${playButtonText}`}</button>
             </div>
         </div>
     );