Implement folder selection button

Ryan4253 · Jan 3, 2024 · 8a095de · 8a095de
1 parent e3ef4c7
commit 8a095de
Show file tree

Hide file tree

Showing 3 changed files with 52 additions and 40 deletions.
diff --git a/App/src/App.css b/App/src/App.css
@@ -2,17 +2,6 @@
   text-align: center;
 }
 
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
 .App-header {
   background-color: #282c34;
   min-height: 100vh;
@@ -22,19 +11,4 @@
   justify-content: center;
   font-size: calc(10px + 2vmin);
   color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-
+}
diff --git a/App/src/App.tsx b/App/src/App.tsx
@@ -8,9 +8,32 @@ import ToggleButtonGroup from '@mui/material/ToggleButtonGroup';
 import ToggleButton from '@mui/material/ToggleButton';
 import Tooltip from '@mui/material/Tooltip';
 import HelpIcon from '@mui/icons-material/Help';
+import { IpcRendererEvent } from 'electron';
 
 const { ipcRenderer } = window.require('electron');
 
+function SelectSugoiFolderButton() {
+	const [sugoiDirectory, selectSugoiDirectory] = useState('');
+
+	const setSugoiDirectory = () => {
+		ipcRenderer.send('setSugoiDirectory');
+		ipcRenderer.once('sugoiDirectoryResult', (event: IpcRendererEvent, result: string) => {
+		  	if (result && result.length > 0) {
+				selectSugoiDirectory(result);
+		  	}
+		});
+	};
+
+	return (
+		<div>
+		  	<Button variant="contained" onClick={setSugoiDirectory}>
+				Select Sugoi Folder
+		  	</Button>
+		  	{sugoiDirectory && <p>Sugoi Folder: {sugoiDirectory}</p>}
+		</div>
+	);
+}
+
 function BatchSizeSlider() {
   	const marks = [
 		{value: 2},
@@ -112,15 +135,15 @@ function TranslatorSelection() {
 		{translator === "Batch" && <BatchSizeSlider />}
 		{translator === "Online" && <TimeoutSlider />}
 		</Box>
-		);
+	);
 }
 
 function OutputFormatSelection(){
 	const [format, setFormat] = React.useState("LineByLine");
 
 	const updateFormat = (event: React.MouseEvent<HTMLElement, MouseEvent>, newFormat: any) => {
 		if(newFormat === null){
-		return;
+			return;
 		}
 
 		setFormat(newFormat);
@@ -160,6 +183,7 @@ function App() {
 	return (
 		<div className="App">
 		<header className="App-header">
+			<SelectSugoiFolderButton />
 			<TranslatorSelection />
 			<OutputFormatSelection />
 			<TranslationButton />

diff --git a/App/src/main.ts b/App/src/main.ts
@@ -1,13 +1,26 @@
 // Modules to control application life and create native browser window
-import { app, BrowserWindow, ipcMain, IpcMainEvent } from 'electron'
+import { app, BrowserWindow, ipcMain, IpcMainEvent, dialog } from 'electron'
 import * as path from 'path'
 import * as url from 'url'
 
+let mainWindow : BrowserWindow | null;
+
 const runIPC = () => {
-	let translator = 'Online'
-	let batch_size = 64;
-	let format = 'LineByLine'
+	let translator = 'Online';
+	let batchSize = 64;
+	let format = 'LineByLine';
 	let timeout = 315;
+	let sugoiDirectory = 'C://';
+
+	ipcMain.on('setSugoiDirectory', async (event: IpcMainEvent) => {
+		const result = await dialog.showOpenDialog(mainWindow!, {
+		  properties: ['openDirectory'],
+		});
+
+		sugoiDirectory = result.filePaths[0];
+		console.log(sugoiDirectory)
+		event.reply('sugoiDirectoryResult', sugoiDirectory);
+	});
 
 	ipcMain.on('setFormat', (event: IpcMainEvent, value: string) => {
 		console.log('Format received in main process:', value);
@@ -16,7 +29,7 @@ const runIPC = () => {
 
 	ipcMain.on('setBatchSize', (event: IpcMainEvent, value: number) => {
 		console.log('Slider value received in main process:', value);
-		batch_size = value;
+		batchSize = value;
 	});
 
 	ipcMain.on('setTranslator', (event: IpcMainEvent, value: string) => {
@@ -33,8 +46,7 @@ const runIPC = () => {
 		const executablePath = path.join(__dirname, '..', '..', 'Backend', 'Backend.exe');
 
 		const { spawn } = require('child_process');
-		console.log(batch_size);
-		const child = spawn(executablePath, ['--TimeoutWait', timeout, '--BatchSize', batch_size, '--SugoiDirectory', 'C:\\Users\\ryanl\\Documents\\Apps\\Sugoi-Translator-Toolkit-6.0', translator, format, 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\Correction\\Names.csv', 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\Correction\\Corrections.csv', 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\sources\\stuff.txt']);
+		const child = spawn(executablePath, ['--TimeoutWait', timeout, '--BatchSize', batchSize, '--SugoiDirectory', sugoiDirectory, translator, format, 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\Correction\\Names.csv', 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\Correction\\Corrections.csv', 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\sources\\stuff.txt']);
 		//, 'C:\\Users\\ryanl\\Desktop\\tenshi-translator\\sources\\test.txt'
 
 		child.stdout.setEncoding('utf8');
@@ -49,8 +61,6 @@ const runIPC = () => {
 	});	
 }
 
-let mainWindow : BrowserWindow | null;
-
 function createWindow() {
 	const startUrl = process.env.DEV 
 					? 'http://localhost:3000'
@@ -81,10 +91,14 @@ app.whenReady().then(() => {
 	runIPC();
 
 	app.on('activate', function () {
-		if (BrowserWindow.getAllWindows().length === 0) createWindow()
+		if (BrowserWindow.getAllWindows().length === 0) {
+			createWindow();
+		}
 	})
 }).catch((e) => console.log(e));
 
 app.on('window-all-closed', function () {
-  	if (process.platform !== 'darwin') app.quit()
+  	if (process.platform !== 'darwin') {
+		app.quit();
+	}
 })