feat(WindowState,Toolbar,Headers): customWindow titles & icons, toolb…

…ar for mac updated, mini player toggle mainwindow hide state, minimize Windows fixed
Venipa · Aug 6, 2022 · fd5f0b3 · fd5f0b3
1 parent 691f184
commit fd5f0b3
Show file tree

Hide file tree

Showing 9 changed files with 218 additions and 121 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ytmdesktop2",
-  "version": "0.8.3",
+  "version": "0.8.4",
   "private": false,
   "author": "Venipa <admin@venipa.net>",
   "scripts": {

diff --git a/public/index.html b/public/index.html
@@ -5,7 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="/favicon.ico">
-    <title>YouTube Music - Settings</title>
+    <title>YouTube Music</title>
   </head>
   <body>
     <noscript>

diff --git a/src/app/main.ts b/src/app/main.ts
@@ -28,7 +28,7 @@ import {
 } from "./utils/serviceCollection";
 import { createApiView, createView } from "./utils/view";
 import { rootWindowInjectUtils } from "./utils/webContentUtils";
-import { createAppWindow } from "./utils/windowUtils";
+import { appIconPath, createAppWindow } from "./utils/windowUtils";
 
 function parseScriptPath(p: string) {
   return path.resolve(__dirname, p);
@@ -72,7 +72,7 @@ export default async function () {
       minWidth: 800,
       minHeight: 480,
       autoHideMenuBar: true,
-      icon: path.resolve(__static, "favicon.ico"),
+      icon: appIconPath,
       backgroundColor: "#000000",
       center: true,
       closable: true,
@@ -154,25 +154,20 @@ export default async function () {
         });
       }
     );
-    const toolbarView = await createApiView(
-      process.platform === "darwin"
-        ? "/youtube/toolbar-mac"
-        : "/youtube/toolbar",
-      (view) => {
-        win.addBrowserView(view);
-        win.setTopBrowserView(view);
-        const [width] = win.getSize();
-        view.setBounds({
-          height: 40,
-          width,
-          x: 0,
-          y: 0,
-        });
-        view.setBackgroundColor("transparent");
-        view.setAutoResize({ width: true });
-        if (isDevelopment) view.webContents.openDevTools({ mode: "detach" });
-      }
-    );
+    const toolbarView = await createApiView("/youtube/toolbar", (view) => {
+      win.addBrowserView(view);
+      win.setTopBrowserView(view);
+      const [width] = win.getSize();
+      view.setBounds({
+        height: 40,
+        width,
+        x: 0,
+        y: 0,
+      });
+      view.setBackgroundColor("transparent");
+      view.setAutoResize({ width: true });
+      if (isDevelopment) view.webContents.openDevTools({ mode: "detach" });
+    });
     serverMain.on("app.loadEnd", () => {
       win.removeBrowserView(loadingView);
       win.setTopBrowserView(toolbarView);
@@ -312,11 +307,11 @@ export default async function () {
 
   serverMain.on("app.minimize", (ev) => {
     const window = BrowserWindow.fromWebContents(ev.sender);
-    if (window && window.minimizable) window.minimize();
+    if (window && window.isMinimizable()) window.minimize();
   });
   serverMain.on("app.maximize", (ev) => {
     const window = BrowserWindow.fromWebContents(ev.sender);
-    if (window && window.maximizable)
+    if (window && window.isMaximizable())
       window.isMaximized() ? window.unmaximize() : window.maximize();
   });
   let forcedQuit = false;

diff --git a/src/app/plugins/appProvider.plugin.ts b/src/app/plugins/appProvider.plugin.ts
@@ -69,6 +69,10 @@ export default class AppProvider extends BaseProvider implements AfterInit {
         settingsWindow = await createAppWindow({
           parent: this.windowContext.main,
         });
+        settingsWindow.setMinimizable(true);
+        settingsWindow.on("close", () => {
+          this.windowContext.main.show();
+        });
         this.windowContext.views.settingsWindow = settingsWindow as any;
       } else {
         settingsWindow.show();

diff --git a/src/app/plugins/miniPlayerProvider.plugin.ts b/src/app/plugins/miniPlayerProvider.plugin.ts
@@ -22,7 +22,7 @@ export default class MiniPlayerProvider extends BaseProvider implements AfterIni
       .miniPlayerWindow as any as BrowserWindow;
     if (!mpWindow || mpWindow.isDestroyed()) {
       mpWindow = await createAppWindow({
-        parent: this.windowContext.main,
+        // parent: this.windowContext.main, 
         path: "/miniplayer",
         minWidth: 340,
         minHeight: 340,
@@ -31,7 +31,12 @@ export default class MiniPlayerProvider extends BaseProvider implements AfterIni
         height: 340,
         width: 540
       });
+      mpWindow.setMinimizable(true);
       this.windowContext.views.miniPlayerWindow = mpWindow as any;
+      this.windowContext.main.hide();
+      mpWindow.on("close", () => {
+        this.windowContext.main.show();
+      });
       mpId = mpWindow.id;
     } else {
       mpId = mpWindow.id;

diff --git a/src/app/utils/windowUtils.ts b/src/app/utils/windowUtils.ts
@@ -17,6 +17,7 @@ const log = logger.child({ label: "main" });
 export function parseScriptPath(p: string) {
   return path.resolve(__dirname, p);
 }
+export const appIconPath = path.resolve(__static, "favicon.ico");
 export async function createAppWindow(appOptions?: Partial<WindowOptions>) {
   // eslint-disable-next-line prefer-const
   let { parent, path, minHeight, minWidth, maxHeight, maxWidth, height, width, top } = appOptions ?? {};
@@ -32,9 +33,10 @@ export async function createAppWindow(appOptions?: Partial<WindowOptions>) {
     minimizable: false,
     backgroundColor: "#000000",
     fullscreenable: !maxWidth && !maxWidth,
+    icon: appIconPath,
     frame: false,
     parent,
-    modal: top === true,
+    modal: parent && top === true,
     darkTheme: true,
     webPreferences: {
       // Use pluginOptions.nodeIntegration, leave this alone