From 1f6d8b7bc112a3b50a33264e13fa2243eaf65b0f Mon Sep 17 00:00:00 2001
From: Ryan Cao <70191398+ryanccn@users.noreply.github.com>
Date: Sun, 9 Jul 2023 16:12:30 +0800
Subject: [PATCH] feat: add splash window theming

---
 src/main/mainWindow.ts               | 21 +++++++++++++++++----
 src/main/splash.ts                   | 11 ++++++++++-
 src/renderer/components/Settings.tsx |  1 +
 src/renderer/index.ts                |  1 +
 src/renderer/themedSplash.ts         | 26 ++++++++++++++++++++++++++
 src/shared/settings.d.ts             |  4 ++++
 6 files changed, 59 insertions(+), 5 deletions(-)
 create mode 100644 src/renderer/themedSplash.ts

diff --git a/src/main/mainWindow.ts b/src/main/mainWindow.ts
index 65f2c469..b42e8a01 100644
--- a/src/main/mainWindow.ts
+++ b/src/main/mainWindow.ts
@@ -4,7 +4,15 @@
  * Copyright (c) 2023 Vendicated and Vencord contributors
  */
 
-import { app, BrowserWindow, BrowserWindowConstructorOptions, Menu, MenuItemConstructorOptions, Tray } from "electron";
+import {
+    app,
+    BrowserWindow,
+    BrowserWindowConstructorOptions,
+    Menu,
+    MenuItemConstructorOptions,
+    nativeTheme,
+    Tray
+} from "electron";
 import { join } from "path";
 import { IpcEvents } from "shared/IpcEvents";
 import { isTruthy } from "shared/utils/guards";
@@ -274,17 +282,22 @@ function createMainWindow() {
         },
         icon: ICON_PATH,
         frame: VencordSettings.store.frameless !== true,
-        ...(Settings.store.transparencyOption !== "none"
+        ...(Settings.store.transparencyOption && Settings.store.transparencyOption !== "none"
             ? {
                   backgroundColor: "#00000000",
                   backgroundMaterial: Settings.store.transparencyOption,
                   transparent: true
               }
             : {
+                  backgroundColor: Settings.store.splashTheming
+                      ? Settings.store.splashBackground
+                      : nativeTheme.shouldUseDarkColors
+                      ? "#313338"
+                      : "#ffffff",
                   transparent: false
               }),
         ...(Settings.store.staticTitle ? { title: "Vencord" } : {}),
-        ...(VencordSettings.store.macosTranslucency
+        ...((VencordSettings.store.macosTranslucency as boolean)
             ? {
                   vibrancy: "sidebar",
                   backgroundColor: "#ffffff00"
@@ -332,7 +345,7 @@ function createMainWindow() {
 const runVencordMain = once(() => require(join(VENCORD_FILES_DIR, "vencordDesktopMain.js")));
 
 export async function createWindows() {
-    const splash = createSplashWindow();
+    const splash = await createSplashWindow();
 
     await ensureVencordFiles();
     runVencordMain();
diff --git a/src/main/splash.ts b/src/main/splash.ts
index 728c6883..f613d533 100644
--- a/src/main/splash.ts
+++ b/src/main/splash.ts
@@ -9,10 +9,19 @@ import { join } from "path";
 import { SplashProps } from "shared/browserWinProperties";
 import { VIEW_DIR } from "shared/paths";
 
-export function createSplashWindow() {
+import { Settings } from "./settings";
+
+export async function createSplashWindow() {
     const splash = new BrowserWindow(SplashProps);
 
     splash.loadFile(join(VIEW_DIR, "splash.html"));
 
+    if (Settings.store.splashTheming) {
+        if (Settings.store.splashColor)
+            splash.webContents.insertCSS(`body { --fg: ${Settings.store.splashColor} !important }`);
+        if (Settings.store.splashBackground)
+            splash.webContents.insertCSS(`body { --bg: ${Settings.store.splashBackground} !important }`);
+    }
+
     return splash;
 }
diff --git a/src/renderer/components/Settings.tsx b/src/renderer/components/Settings.tsx
index b5d8c3d7..cc6295ee 100644
--- a/src/renderer/components/Settings.tsx
+++ b/src/renderer/components/Settings.tsx
@@ -33,6 +33,7 @@ export default function SettingsUi() {
             "Disable minimum window size",
             "Allows you to make the window as small as your heart desires"
         ],
+        ["splashTheming", "Splash theming", "Adapt the splash window colors to your custom theme", false],
         [
             "openLinksWithElectron",
             "Open Links in app (experimental)",
diff --git a/src/renderer/index.ts b/src/renderer/index.ts
index dc0cf10c..dbe9c065 100644
--- a/src/renderer/index.ts
+++ b/src/renderer/index.ts
@@ -7,6 +7,7 @@
 import "./fixes";
 import "./appBadge";
 import "./patches";
+import "./themedSplash";
 
 console.log("read if cute :3");
 
diff --git a/src/renderer/themedSplash.ts b/src/renderer/themedSplash.ts
new file mode 100644
index 00000000..6170a9e0
--- /dev/null
+++ b/src/renderer/themedSplash.ts
@@ -0,0 +1,26 @@
+/*
+ * SPDX-License-Identifier: GPL-3.0
+ * Vencord Desktop, a desktop app aiming to give you a snappier Discord Experience
+ * Copyright (c) 2023 Vendicated and Vencord contributors
+ */
+
+import { Settings } from "./settings";
+
+window.addEventListener("load", () => {
+    const bodyStyles = document.body.computedStyleMap();
+
+    const color = bodyStyles.get("--text-normal");
+    const backgroundColor = bodyStyles.get("--background-primary");
+
+    if (color instanceof CSSUnparsedValue && typeof color[0] === "string" && CSS.supports("color", color[0])) {
+        Settings.store.splashColor = color[0];
+    }
+
+    if (
+        backgroundColor instanceof CSSUnparsedValue &&
+        typeof backgroundColor[0] === "string" &&
+        CSS.supports("background-color", backgroundColor[0])
+    ) {
+        Settings.store.splashBackground = backgroundColor[0];
+    }
+});
diff --git a/src/shared/settings.d.ts b/src/shared/settings.d.ts
index 2844b6b2..2fb37c3a 100644
--- a/src/shared/settings.d.ts
+++ b/src/shared/settings.d.ts
@@ -23,4 +23,8 @@ export interface Settings {
     appBadge?: boolean;
 
     firstLaunch?: boolean;
+
+    splashTheming?: boolean;
+    splashColor?: string;
+    splashBackground?: string;
 }