Add Platform Styles

build.mjs

@@ -39,7 +39,11 @@ function makeConfig(ext, name) {
 const exts = fs.readdirSync("./src");
 
 const config = exts
-  .map((x) => [makeConfig(x, "index"), makeConfig(x, "node")])
+  .map((x) => [
+    makeConfig(x, "index"),
+    makeConfig(x, "node"),
+    makeConfig(x, "host")
+  ])
   .flat()
   .filter((c) => c !== null);
 

package.json

@@ -1,5 +1,5 @@
 {
-  "name": "sample-extension",
+  "name": "@cynosphere/moonlight-extensions",
   "version": "1.0.0",
   "main": "dist/index.js",
   "scripts": {

src/platformStyles/host.ts

@@ -0,0 +1,21 @@
+import { BrowserWindowConstructorOptions } from "electron";
+import { PlatformStyle } from "./types";
+
+moonlightHost.events.on(
+  "window-options",
+  (options: BrowserWindowConstructorOptions) => {
+    const style =
+      moonlightHost.getConfigOption<PlatformStyle>("platformStyles", "style") ??
+      "default";
+    const useFrame = style === "linux";
+
+    const isPopout =
+      options.center && options.width === 300 && options.height === 350;
+
+    if (!isPopout) {
+      if (style !== "default") {
+        options.frame = useFrame;
+      }
+    }
+  }
+);

src/platformStyles/index.ts

@@ -0,0 +1,74 @@
+import { ExtensionWebpackModule, Patch } from "@moonlight-mod/types";
+import { PlatformStyle, PlatformUtils } from "./types";
+
+export const patches: Patch[] = [
+  {
+    find: /switch\((.{1,2})\){case (.{1,2})\.PlatformTypes\.WINDOWS:/g,
+    replace: {
+      match: /switch\((.{1,2})\){case (.{1,2})\.PlatformTypes\.WINDOWS:/,
+      replacement: (_, platformType, platformUtils) =>
+        `${platformType}=require("platformStyles_helper").platformBorders(${platformUtils});switch(${platformType}){case ${platformUtils}.PlatformTypes.WINDOWS:`
+    }
+  },
+  {
+    find: '" platform-overlay"',
+    replace: {
+      match: /(.)="platform-web"\),/,
+      replacement: (orig, className) =>
+        `${orig}(${className}=require("platformStyles_helper").platformClass()??${className}),`
+    }
+  },
+  {
+    find: ".ensureIsInPosition=",
+    replace: {
+      match:
+        /(.{1,2})=.{1,2}!==(.{1,2})\.PlatformTypes\.WEB&&this\.inPopout\?22:0;/,
+      replacement: (_, pipOffset, platformUtil) =>
+        `${pipOffset}=require("platformStyles_helper").platformBorders(${platformUtil})!==${platformUtil}.PlatformTypes.WEB&&this.inPopout?22:0;`
+    }
+  }
+];
+
+export const webpackModules: Record<string, ExtensionWebpackModule> = {
+  helper: {
+    run: function (module, exports, require) {
+      const style =
+        moonlight.getConfigOption<PlatformStyle>("platformStyles", "style") ??
+        "default";
+
+      function platformBorders(platformUtils: PlatformUtils) {
+        switch (style) {
+          case "win":
+            return platformUtils.PlatformTypes.WINDOWS;
+          case "osx":
+            return platformUtils.PlatformTypes.OSX;
+          case "linux":
+            return platformUtils.PlatformTypes.LINUX;
+          case "web":
+            return platformUtils.PlatformTypes.WEB;
+          default:
+            return platformUtils.getPlatform();
+        }
+      }
+      function platformClass() {
+        switch (style) {
+          case "win":
+            return "platform-win";
+          case "osx":
+            return "platform-osx";
+          case "linux":
+            return "platform-linux";
+          case "web":
+            return "platform-web";
+          default:
+            // there's an OR in the patch which will apply the system class if unset
+            return null;
+        }
+      }
+      module.exports = {
+        platformBorders,
+        platformClass
+      };
+    }
+  }
+};

src/platformStyles/manifest.json

@@ -0,0 +1,16 @@
+{
+  "id": "platformStyles",
+  "meta": {
+    "name": "Platform Styles",
+    "tagline": "Change the window border apperance to another operating system's style.",
+    "authors": ["Cynosphere", "adryd"]
+  },
+  "settings": {
+    "style": {
+      "displayName": "Style (linux for system border)",
+      "type": "select",
+      "default": "default",
+      "options": ["default", "win", "osx", "linux", "web"]
+    }
+  }
+}

src/platformStyles/types.ts

@@ -0,0 +1,25 @@
+export type PlatformStyle = "win" | "osx" | "linux" | "web" | "default";
+
+type PlatformTypes = {
+  WINDOWS: "WINDOWS";
+  OSX: "OSX";
+  LINUX: "LINUX";
+  WEB: "WEB";
+};
+
+export type PlatformUtils = {
+  PlatformTypes: PlatformTypes;
+  isPlatformEmbedded: () => boolean;
+  isWindows: () => boolean;
+  isMac: () => boolean;
+  isLinux: () => boolean;
+  isDesktop: () => boolean;
+  isWeb: () => boolean;
+  isAndroidChrome: () => boolean;
+  isAndroidWeb: () => boolean;
+  isAndroid: () => boolean;
+  isIOS: () => boolean;
+  getPlatform: () => PlatformTypes;
+  getPlatformName: () => string;
+  getOS: () => string;
+};