Add: Backend functionality for resizing.

lMortimerl · Jun 16, 2024 · 1fd8557 · 1fd8557
1 parent 4e65903
commit 1fd8557
Show file tree

Hide file tree

Showing 2 changed files with 75 additions and 55 deletions.
diff --git a/src/main/channels/compression.ts b/src/main/channels/compression.ts
@@ -16,6 +16,9 @@ export default async function handleCompression(
 	) as AvailableFormats;
 	const replaceOriginal = store.get('replaceOriginal');
 	const { files }: { files: string[] } = args[0];
+	const resize = store.get('resize');
+	const targetX = store.get('resizeTargetX');
+	const targetY = store.get('resizeTargetY');
 	let processedFiles = 0;
 
 	files.map(async (filePath: string) => {
@@ -27,8 +30,12 @@ export default async function handleCompression(
 			.replace(oldFileExtension, `-tinyfied${newFileExtension}`);
 		const newFilePath = path.join(path.dirname(filePath), newFilename);
 		const options = store.get(`${targetFormat}Options`);
-		sharp(image)
+		const sObj = sharp(image)
 			[targetFormat](options)
+		if (resize) {
+			sObj.resize(targetX, targetY);
+		}
+		sObj
 			.toBuffer()
 			.then((buffer) => {
 				fs.writeFileSync(

diff --git a/src/renderer/screens/settingsscreen.tsx b/src/renderer/screens/settingsscreen.tsx
@@ -75,63 +75,76 @@ export default function SettingsScreen() {
 
 	return (
 		<article>
-			<FormControl fullWidth>
-				<InputLabel id="label-target-format">Target Format</InputLabel>
-				<Select
-					value={targetFormat}
-					fullWidth
-					labelId="label-target-format"
-					id="target-format"
-					label="Target Format"
-					onChange={handleTargetFormatChange}
-				>
-					{formats.map((value) => {
-						return (
-							<MenuItem value={value} key={value}>
-								{value}
-							</MenuItem>
-						);
-					})}
-				</Select>
-			</FormControl>
-			<FormControlLabel
-				control={
-					<Checkbox
-						onChange={handleReplaceOriginalChange}
-						checked={replaceOriginal}
-					/>
-				}
-				label="Replace Original?"
-			/>
-			<FormControlLabel
-				control={
-					<Checkbox
-						onChange={handleEnableResizeChange}
-						checked={enableResize}
-					/>
-				}
-				label="Enable resizing?"
-			/>
-			<Grid container spacing={2}>
-				<Grid item xs={6}>
+			<Grid container spacing={4}>
+				<Grid item xs={12}>
 					<FormControl fullWidth>
-						<InputLabel>Size X</InputLabel>
-							<Input
-								name="resizeTargetX"
-								onChange={handleResizeTargetX}
-								value={`${resizeTargetX}`}
-							/>
+						<InputLabel id="label-target-format">Target Format</InputLabel>
+						<Select
+							value={targetFormat}
+							fullWidth
+							labelId="label-target-format"
+							id="target-format"
+							label="Target Format"
+							onChange={handleTargetFormatChange}
+						>
+							{formats.map((value) => {
+								return (
+									<MenuItem value={value} key={value}>
+										{value}
+									</MenuItem>
+								);
+							})}
+						</Select>
 					</FormControl>
 				</Grid>
-				<Grid item xs={6}>
-					<FormControl fullWidth>
-						<InputLabel>Size Y</InputLabel>
-						<Input
-							name="resizeTargetY"
-							onChange={handleResizeTargetY}
-							value={`${resizeTargetY}`}
-						/>
-					</FormControl>
+				<Grid item xs={12}>
+					<Grid container spacing={2}>
+						<Grid item xs={6}>
+							<FormControlLabel control={
+								<Checkbox
+									onChange={handleReplaceOriginalChange}
+									checked={replaceOriginal}
+								/>
+							}
+								label="Replace Original?"
+							/>
+						</Grid>
+						<Grid item xs={6}>
+							<FormControlLabel
+								control={
+									<Checkbox
+										onChange={handleEnableResizeChange}
+										checked={enableResize}
+									/>
+								}
+								label="Enable resizing?"
+							/>
+						</Grid>
+					</Grid>
+				</Grid>
+				<Grid item xs={12} sx={{ paddingTop: "12", display: (enableResize ? "block" : "none") }}>
+					<Grid container spacing={2}>
+						<Grid item xs={6}>
+							<FormControl fullWidth>
+								<InputLabel>Size X</InputLabel>
+								<Input
+									name="resizeTargetX"
+									onChange={handleResizeTargetX}
+									value={`${resizeTargetX}`}
+								/>
+							</FormControl>
+						</Grid>
+						<Grid item xs={6}>
+							<FormControl fullWidth>
+								<InputLabel>Size Y</InputLabel>
+								<Input
+									name="resizeTargetY"
+									onChange={handleResizeTargetY}
+									value={`${resizeTargetY}`}
+								/>
+							</FormControl>
+						</Grid>
+					</Grid>
 				</Grid>
 			</Grid>
 			<Divider sx={{ mt: '8px', mb: '12px' }} />