From 4e7667e277e89a96dce027b9eb853a93513afde4 Mon Sep 17 00:00:00 2001
From: Sakamoto Shiina <68018796+ShiinaSakamoto@users.noreply.github.com>
Date: Tue, 30 Jul 2024 05:31:00 +0900
Subject: [PATCH] [Update/Prepare] Prepare for window transparency feature.

---
 src-tauri/Cargo.toml                      |  2 +-
 src-tauri/tauri.conf.json                 | 27 +++++++++++++----------
 src-ui/utils/root.css                     |  3 +++
 src-ui/windows/main_window/MainWindow.jsx |  4 +++-
 4 files changed, 22 insertions(+), 14 deletions(-)

diff --git a/src-tauri/Cargo.toml b/src-tauri/Cargo.toml
index 2d697c06..03bc654d 100644
--- a/src-tauri/Cargo.toml
+++ b/src-tauri/Cargo.toml
@@ -11,7 +11,7 @@ edition = "2021"
 tauri-build = { version = "1", features = [] }
 
 [dependencies]
-tauri = { version = "1", features = [ "window-set-always-on-top", "window-create", "window-close", "shell-sidecar", "shell-open", "devtools"] }
+tauri = { version = "1", features = [ "window-set-decorations", "window-set-always-on-top", "window-create", "window-close", "shell-sidecar", "shell-open", "devtools"] }
 serde = { version = "1", features = ["derive"] }
 serde_json = "1"
 
diff --git a/src-tauri/tauri.conf.json b/src-tauri/tauri.conf.json
index a51bffd9..67a66e08 100644
--- a/src-tauri/tauri.conf.json
+++ b/src-tauri/tauri.conf.json
@@ -15,25 +15,28 @@
       "window": {
         "create": true,
         "close": true,
-        "setAlwaysOnTop": true
-      },
-      "shell": {
+        "setAlwaysOnTop": true,
+        "setDecorations": true
+    },
+    "shell": {
         "all": false,
         "open": true,
         "sidecar": true,
         "scope": [
-          {
-            "name": "bin/test", "sidecar": true,"args": true
-          }
+            {
+                "name": "bin/test", "sidecar": true,"args": true
+            }
         ]
-      }
-    },
-    "windows": [
-      {
+    }
+},
+"windows": [
+    {
         "title": "VRCT",
         "width": 870,
-        "height": 654
-      }
+        "height": 654,
+        "transparent": true,
+        "decorations": false
+    }
     ],
     "security": {
       "csp": null
diff --git a/src-ui/utils/root.css b/src-ui/utils/root.css
index 1cc2a409..f9c0344a 100644
--- a/src-ui/utils/root.css
+++ b/src-ui/utils/root.css
@@ -32,6 +32,9 @@ html, body {
 
 #root {
     height: 100%;
+
+    /* For controlling a whole window transparency */
+    opacity: 1;
 }
 
 /* SVG内のすべての要素にfillを適用 (colorの調整をcssでするため) */
diff --git a/src-ui/windows/main_window/MainWindow.jsx b/src-ui/windows/main_window/MainWindow.jsx
index 887bcde7..5d570bbb 100644
--- a/src-ui/windows/main_window/MainWindow.jsx
+++ b/src-ui/windows/main_window/MainWindow.jsx
@@ -1,6 +1,6 @@
+import { getCurrent } from "@tauri-apps/api/window";
 import { useEffect, useRef } from "react";
 import styles from "./MainWindow.module.scss";
-
 import { SidebarSection } from "./sidebar_section/SidebarSection";
 import { MainSection } from "./main_section/MainSection";
 import { useStartPython } from "@logics/useStartPython";
@@ -8,8 +8,10 @@ import { useStartPython } from "@logics/useStartPython";
 export const MainWindow = () => {
     const { asyncStartPython } = useStartPython();
     const hasRunRef = useRef(false);
+    const main_window = getCurrent();
 
     useEffect(() => {
+        main_window.setDecorations(true);
         if (!hasRunRef.current) {
             asyncStartPython();
         }