From 7b67559589ca6313bd80af1632ce05f635f15162 Mon Sep 17 00:00:00 2001 From: Lino Schmidt Date: Wed, 22 Jun 2022 20:10:26 +0200 Subject: [PATCH] New Top Bar design --- src/components/openFolder.ts | 7 ++-- src/components/paths.ts | 12 +----- src/components/platform.ts | 15 ++++++++ src/components/settings.ts | 27 +++++++------- src/components/ui/menu.tsx | 2 +- src/index.css | 72 +++++++++++++++--------------------- src/index.ts | 14 ++++--- 7 files changed, 72 insertions(+), 77 deletions(-) create mode 100644 src/components/platform.ts diff --git a/src/components/openFolder.ts b/src/components/openFolder.ts index dc76c38..c971ccb 100644 --- a/src/components/openFolder.ts +++ b/src/components/openFolder.ts @@ -1,16 +1,17 @@ import {spawn} from 'child_process'; import logger from './logger'; +import { Platform, platform } from './platform'; export default function openFolder(path:string) { - if (process.platform === 'darwin') { + if (platform === Platform.Mac) { spawn('open', [path]).on('error', (err) => { logger.errorMSG(err.message); }); - } else if (process.platform === 'win32') { + } else if (platform === Platform.Windows) { spawn('explorer', [path]).on('error', (err) => { logger.errorMSG(err.message); }); - } else if (process.platform === 'linux') { + } else if (platform === Platform.Linux) { spawn('xdg-open', [path]).on('error', (err) => { logger.errorMSG(err.message); }); diff --git a/src/components/paths.ts b/src/components/paths.ts index 254c2e5..d01dbdd 100644 --- a/src/components/paths.ts +++ b/src/components/paths.ts @@ -1,5 +1,6 @@ import path from 'path'; import {app} from '@electron/remote'; +import { platformFolder, platform, Platform } from './platform'; export const dataPath = app.getPath('userData'); export const appPath = app.getAppPath().replace("app.asar", ""); @@ -7,18 +8,9 @@ export const SettingPath = path.join(dataPath, "settings.xml"); export const defaultOutputPath = path.join(app.getPath('videos'), "StickExporterTX"); -let platformFolder = ""; -if(process.platform === "win32") { - platformFolder = "windows"; -} else if(process.platform === "darwin") { - platformFolder = "darwin"; -} else if(process.platform === "linux") { - platformFolder = "linux"; -} - export function platformCharacter() { let platformCharacterTEMP = "/"; - if (process.platform === "win32") { + if (platform === Platform.Windows) { platformCharacterTEMP = "\\"; } return platformCharacterTEMP; diff --git a/src/components/platform.ts b/src/components/platform.ts new file mode 100644 index 0000000..c3ee7dd --- /dev/null +++ b/src/components/platform.ts @@ -0,0 +1,15 @@ +const enum Platform { + Windows = 'win32', + Mac = 'darwin', + Linux = 'linux' +} + +const platform = process.platform; + +const platformFolder = platform === Platform.Windows ? 'windows' : platform === Platform.Mac ? 'darwin' : 'linux'; + +export { + platform, + Platform, + platformFolder +} \ No newline at end of file diff --git a/src/components/settings.ts b/src/components/settings.ts index 016cf95..e301578 100644 --- a/src/components/settings.ts +++ b/src/components/settings.ts @@ -16,13 +16,14 @@ const defaultSettings = { output: defaultOutputPath } -let loadedSuccessfully = true; -const settingList = await fetch(SettingPath).then(function(response){ +let loadedSuccessfully = false; +const settingList = await fetch(SettingPath).then(function(response) { return response.text(); -}).then(function(data){ +}).then(function(data) { const parser = new DOMParser(); const xmlDoc = parser.parseFromString(data, 'text/xml'); + loadedSuccessfully = true; return { fps: parseInt(getXMLChild(xmlDoc, "fps")), width: parseInt(getXMLChild(xmlDoc, "width")), @@ -31,23 +32,12 @@ const settingList = await fetch(SettingPath).then(function(response){ log: (getXMLChild(xmlDoc, "log") === "None")? "":getXMLChild(xmlDoc, "log"), output: getXMLChild(xmlDoc, "output") } - }).catch(function(error) { logger.warning("Could not load settings: " + error.toString() + "\n Creating new settings file..."); - loadedSuccessfully = false; return defaultSettings; }); if(!loadedSuccessfully) updateSettings({}); -function settingListLoadDefault() { - updateSettings({ - fps:defaultSettings.fps, - width:defaultSettings.width, - stickDistance:defaultSettings.stickDistance, - stickMode2:defaultSettings.stickMode2 - }); -} - function updateSettings(optiones:{fps?:number, width?:number, stickDistance?:number, stickMode2?:boolean, log?:string, output?:string}) { if(optiones.fps === undefined) { optiones.fps = settingList.fps; @@ -95,6 +85,15 @@ function updateSettings(optiones:{fps?:number, width?:number, stickDistance?:num }); } +function settingListLoadDefault() { + updateSettings({ + fps:defaultSettings.fps, + width:defaultSettings.width, + stickDistance:defaultSettings.stickDistance, + stickMode2:defaultSettings.stickMode2 + }); +} + export { updateSettings, settingListLoadDefault, diff --git a/src/components/ui/menu.tsx b/src/components/ui/menu.tsx index e4c95c6..8838c90 100644 --- a/src/components/ui/menu.tsx +++ b/src/components/ui/menu.tsx @@ -44,7 +44,7 @@ function Menu({side}:{side:Side}) { return (
-

{(side == Side.Main)? "StickExporterTX" : "Settings"}

+

{(side == Side.Main)? "StickExporterTX" : "Settings"}

{blenderLoading? : } diff --git a/src/index.css b/src/index.css index b192160..94d62be 100644 --- a/src/index.css +++ b/src/index.css @@ -20,13 +20,15 @@ header { display: flex; justify-content: flex-end; align-items: center; - padding: 20px 25px; + padding: 0px 5px; + padding-right: 142px; background-color: #0d131e; - height: 20px; + height: 31px; color: #9DA8B9; margin-bottom: 25px; + -webkit-app-region: drag; } -header h1 { +header h4 { margin-right: auto; display: flex; width: auto; @@ -34,23 +36,27 @@ header h1 { .back-button { cursor: pointer; - padding: 10px; + -webkit-app-region: no-drag; + padding: 6px 10px; + height: 100%; background-color: #2196F3; color: white; border: none; - border-radius: 20px; - display: flex; + border-radius: 15px; font-size: large; } .back-button:hover { - transform: scale(1.05); - text-decoration: none; + background-color: #0b6ab9; + transform: scale(1); } #stopRender { background-color: #e1334e; } +#stopRender:hover { + background-color: red; +} #content { padding-left: 25px; @@ -59,64 +65,44 @@ header h1 { #settings-button { cursor: pointer; + -webkit-app-region: no-drag; background-color: #2196F3; border-radius: 50%; - width: 45px; - height: 45px; + width: 30px; + height: 30px; align-items: center; border: none; outline: none; } #settings-button svg { - width: 35px; - height: 35px; + height: 24px; fill: white; - margin-left: 5px; - margin-top: 5px; + margin-left: 3px; + margin-top: 3px; } #settings-button:hover { - transform: scale(1.05); -} - -#update-available { - cursor: pointer; - background-color: #21f3ad; - border-radius: 20%; - width: 45px; - height: 45px; - align-items: center; - border: none; - outline: none; - margin-right: 15px; -} -#update-available svg { - width: 35px; - height: 35px; - fill: white; - margin-left: 5px; - margin-top: 5px; -} -#update-available:hover { - transform: scale(1.05); + background-color: #0b6ab9; + transform: scale(1); } #blender-info { margin-right: auto; + display: flex; + align-items: center; } #blender-info p { - margin-top: 5px; - margin-bottom: 0; + padding-left: 5px; } #blender-icon { - width: 25px; - height: 25px; + width: 20px; + height: 20px; align-items: center; margin-left: auto; margin-right: auto; } #blender-icon svg { - width: 25px; - height: 25px; + width: 20px; + height: 20px; fill: white; } #blender-loading-icon { diff --git a/src/index.ts b/src/index.ts index 9c5baca..e902a68 100644 --- a/src/index.ts +++ b/src/index.ts @@ -3,6 +3,7 @@ import {initialize as remoteInitialize, enable as remoteEnable} from '@electron/ import path from 'path'; import { autoUpdater } from "electron-updater"; import logger from 'electron-log'; +import { Platform, platform } from './components/platform'; logger.transports.console.format = "{h}:{i}:{s} {text}"; logger.transports.file.getFile(); @@ -63,20 +64,21 @@ const createWindow = () => { webPreferences: { nodeIntegration: true, contextIsolation: false, + }, + titleBarStyle: 'hidden', + titleBarOverlay: { + color: '#0d131e', + symbolColor: '#74b1be' } }); - // remove the menu bar when in production. - if(process.env.NODE_ENV === 'production') mainWindow.setMenu(null); + mainWindow.setMenu(null); remoteInitialize(); remoteEnable(mainWindow.webContents); // load the index.html of the app. mainWindow.loadFile(path.join(__dirname, 'index.html')); - - // Open the DevTools when in development mode. - if(process.env.NODE_ENV === 'development') mainWindow.webContents.openDevTools(); }; // This method will be called when Electron has finished @@ -88,7 +90,7 @@ app.on('ready', createWindow); // for applications and their menu bar to stay active until the user quits // explicitly with Cmd + Q. app.on('window-all-closed', () => { - if (process.platform !== 'darwin') { + if (platform !== Platform.Mac) { app.quit(); } });