Fixed titlebar

JackHumphries9 · May 16, 2021 · 0196046 · 0196046
1 parent 62de428
commit 0196046
Show file tree

Hide file tree

Showing 6 changed files with 9 additions and 195 deletions.
diff --git a/.gitignore b/.gitignore
@@ -2,4 +2,5 @@ node_modules
 .vscode
 .DS_Store
 dist
-build
+build
+package-lock.json
diff --git a/craco.config.js b/craco.config.js
diff --git a/package.json b/package.json
@@ -3,7 +3,7 @@
 	"version": "1.0.0",
 	"private": true,
 	"license": "GPL-3.0-only",
-	"main": "build/electron.js",
+	"main": "src/electron.js",
 	"author": "Jack Humphries <[email protected]>",
 	"homepage": "./build/",
 	"description": "Group all of your socials into one window!",
@@ -19,7 +19,7 @@
 		"react-scripts": "^4.0.3"
 	},
 	"scripts": {
-		"start": "react-scripts start",
+		"react": "react-scripts start",
 		"react-build": "react-scripts build",
 		"electron": "electron .",
 		"electron-pack": "electron-builder --dir",

diff --git a/src/components/TitlebarMac.js b/src/components/TitlebarMac.js
@@ -22,190 +22,9 @@ export default function Titlebar() {
 		};
 	});
 
-	useEffect(() => {
-		function focus() {
-			setFocused(true);
-		}
-
-		window.addEventListener("focus", focus);
-
-		return (_) => {
-			window.removeEventListener("focus", focus);
-		};
-	});
-
-	useEffect(() => {
-		function blur() {
-			setFocused(false);
-		}
-
-		window.addEventListener("blur", blur);
-
-		return (_) => {
-			window.removeEventListener("blur", blur);
-		};
-	});
-
 	return (
 		<header id="titlebarMac" className={isMaximized ? `maximizedMac` : ``}>
-			<div id="drag-region">
-				<div id="window-controlsMac">
-					<div
-						className="buttonMac"
-						id="close-buttonMac"
-						onClick={() => {
-							socially.winControls.close();
-						}}
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							width="20"
-							height="32"
-							viewBox="0 0 20 32"
-							fill="none"
-						>
-							<circle
-								cx="11"
-								cy="11"
-								r="6"
-								fill={isFocused ? "#FF6058" : "#454545"}
-							/>
-							<line
-								className="control-iconsMac"
-								x1="8.35355"
-								y1="8"
-								x2="14"
-								y2="13.6464"
-								stroke="#595959"
-								strokeWidth="0.8"
-								strokeLinecap="round"
-							/>
-							<line
-								className="control-iconsMac"
-								x1="8"
-								y1="13.6464"
-								x2="13.6464"
-								y2="8"
-								stroke="#595959"
-								strokeWidth="0.8"
-								strokeLinecap="round"
-							/>
-						</svg>
-					</div>
-					<div
-						className="buttonMac"
-						onClick={() => {
-							socially.winControls.minimize();
-						}}
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							width="20"
-							height="32"
-							viewBox="0 0 20 32"
-							fill="none"
-						>
-							<circle
-								cx="11"
-								cy="11"
-								r="6"
-								fill={isFocused ? "#FFBD2E" : "#454545"}
-							/>
-							<line
-								className="control-iconsMac"
-								x1="8"
-								y1="10.75"
-								x2="14"
-								y2="10.75"
-								stroke="#595959"
-								strokeWidth="1"
-								strokeLinecap="round"
-							/>
-						</svg>
-					</div>
-					<div
-						className="buttonMac"
-						id="max-buttonMac"
-						onClick={() => {
-							setMaximized(true);
-							socially.winControls.maximize();
-						}}
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							width="20"
-							height="32"
-							viewBox="0 0 20 32"
-							fill="none"
-						>
-							<circle
-								cx="11"
-								cy="11"
-								r="6"
-								fill={isFocused ? "#29CA41" : "#454545"}
-							/>
-							<line
-								className="control-iconsMac"
-								x1="8.25"
-								y1="10.75"
-								x2="13.75"
-								y2="10.75"
-								stroke="#333333"
-								strokeWidth="0.5"
-								strokeLinecap="round"
-							/>
-							<line
-								className="control-iconsMac"
-								x1="10.75"
-								y1="13.75"
-								x2="10.75"
-								y2="8.25"
-								stroke="#333333"
-								strokeWidth="0.5"
-								strokeLinecap="round"
-							/>
-						</svg>
-					</div>
-					<div
-						className="buttonMac"
-						id="restore-buttonMac"
-						onClick={() => {
-							setMaximized(false);
-							socially.winControls.restore();
-						}}
-					>
-						<svg
-							xmlns="http://www.w3.org/2000/svg"
-							width="20"
-							height="32"
-							viewBox="0 0 20 32"
-							fill="none"
-						>
-							<circle cx="11" cy="11" r="6" fill="#29CA41" />
-							<line
-								className="control-iconsMac"
-								x1="8.25"
-								y1="10.75"
-								x2="13.75"
-								y2="10.75"
-								stroke="#333333"
-								strokeWidth="0.5"
-								strokeLinecap="round"
-							/>
-							<line
-								className="control-iconsMac"
-								x1="10.75"
-								y1="13.75"
-								x2="10.75"
-								y2="8.25"
-								stroke="#333333"
-								strokeWidth="0.5"
-								strokeLinecap="round"
-							/>
-						</svg>
-					</div>
-				</div>
-			</div>
+			<div id="drag-region"></div>
 		</header>
 	);
 }
diff --git a/src/electron.js b/src/electron.js
@@ -2,20 +2,18 @@
 const { app, BrowserWindow, shell, Menu } = require("electron");
 const config = require("electron-json-config");
 const path = require("path");
-require("@electron/remote/main").initialize();
 // Keep a global reference of the window object, if you don't, the window will
 // be closed automatically when the JavaScript object is garbage collected.
 let mainWindow;
-let isDev = false;
+let isDev = true;
 
 function createWindow() {
 	// Create the browser window.
 	mainWindow = new BrowserWindow({
 		width: 800,
 		height: 675,
 		toolbar: false,
-		"skip-taskbar": true,
-		"auto-hide-menu-bar": true,
+		titleBarStyle: "hiddenInset",
 		frame: config.get("titlebar") === "native" ? true : false,
 		minWidth: 800,
 		minHeight: 600,

diff --git a/src/preload.js b/src/preload.js
@@ -4,6 +4,8 @@ const os = require("os");
 
 console.log("Config file located at: " + config.file());
 
+// TODO: Rewrite this file using IPC rather than remote
+
 contextBridge.exposeInMainWorld("socially", {
 	winControls: {
 		close() {