diff --git a/electron/index.ts b/electron/index.ts index 7ec83b3..caaeabc 100644 --- a/electron/index.ts +++ b/electron/index.ts @@ -120,6 +120,8 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => { const model = payload.model; let inputDir = payload.imagePath.match(/(.*)[\/\\]/)[1] || ""; let outputDir = payload.outputPath; + const gpuId = payload.gpuId; + const saveImageAs = payload.saveImageAs; // COPY IMAGE TO TMP FOLDER const platform = getPlatform(); @@ -129,7 +131,8 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => { : payload.imagePath.split("/").slice(-1)[0]; const fileName = parse(fullfileName).name; const fileExt = parse(fullfileName).ext; - const outFile = outputDir + "/" + fileName + "_upscayl_8x_" + model + fileExt; + const outFile = + outputDir + "/" + fileName + "_upscayl_8x_" + model + "." + saveImageAs; // UPSCALE let upscayl = spawn( @@ -145,6 +148,9 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => { modelsPath, "-n", model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, ], { cwd: undefined, @@ -163,7 +169,10 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => { "-m", modelsPath, "-n", - model + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs ); let failed = false; @@ -198,7 +207,21 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => { // UPSCALE let upscayl2 = spawn( execPath("realesrgan"), - ["-i", outFile, "-o", outFile, "-s", 4, "-m", modelsPath, "-n", model], + [ + "-i", + outFile, + "-o", + outFile, + "-s", + 4, + "-m", + modelsPath, + "-n", + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, + ], { cwd: undefined, detached: false, @@ -244,6 +267,8 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => { ipcMain.on(commands.UPSCAYL, async (event, payload) => { const model = payload.model; const scale = payload.scaleFactor; + const gpuId = payload.gpuId; + const saveImageAs = payload.saveImageAs; let inputDir = payload.imagePath.match(/(.*)[\/\\]/)[1] || ""; let outputDir = payload.outputPath; @@ -261,8 +286,17 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => { scale + "x_" + model + - fileExt - : outputDir + "/" + fileName + "_upscayl_" + scale + "x_" + model + fileExt; + "." + + saveImageAs + : outputDir + + "/" + + fileName + + "_upscayl_" + + scale + + "x_" + + model + + "." + + saveImageAs; // UPSCALE if (fs.existsSync(outFile)) { @@ -285,6 +319,9 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => { modelsPath, "-n", model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, ], { cwd: undefined, @@ -302,7 +339,10 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => { "-m", modelsPath, "-n", - model + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs ); break; case "models-DF2K": @@ -318,6 +358,9 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => { "-x", "-m", modelsPath + "/" + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, ], { cwd: undefined, @@ -334,7 +377,10 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => { scale, "-x", "-m", - modelsPath + "/" + model + modelsPath + "/" + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs ); break; } @@ -368,6 +414,143 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => { } }); +//------------------------Upscayl Folder-----------------------------// +ipcMain.on(commands.FOLDER_UPSCAYL, async (event, payload) => { + // GET THE MODEL + const model = payload.model; + const gpuId = payload.gpuId; + const saveImageAs = payload.saveImageAs; + + // GET THE IMAGE DIRECTORY + let inputDir = payload.batchFolderPath; + console.log("🚀 => file: index.ts => line 471 => inputDir", inputDir); + + // GET THE OUTPUT DIRECTORY + let outputDir = model.includes("models-DF2K") + ? payload.outputPath + "_sharpened" + : payload.outputPath; + console.log("🚀 => file: index.ts => line 474 => outputDir", outputDir); + + if (!fs.existsSync(outputDir)) { + fs.mkdirSync(outputDir, { recursive: true }); + } + // UPSCALE + let upscayl: ChildProcessWithoutNullStreams | null = null; + switch (model) { + default: + upscayl = spawn( + execPath("realesrgan"), + [ + "-i", + inputDir, + "-o", + outputDir, + "-s", + 4, + "-m", + modelsPath, + "-n", + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, + ], + { + cwd: undefined, + detached: false, + } + ); + console.log( + "🆙 COMMAND:", + "-i", + inputDir, + "-o", + outputDir, + "-s", + 4, + "-m", + modelsPath, + "-n", + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs + ); + break; + case "models-DF2K": + upscayl = spawn( + execPath("realsr"), + [ + "-i", + inputDir, + "-o", + outputDir, + "-s", + 4, + "-x", + "-m", + modelsPath + "/" + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, + ], + { + cwd: undefined, + detached: false, + } + ); + console.log( + "🆙 COMMAND:", + "-i", + inputDir, + "-o", + outputDir, + "-s", + 4, + "-x", + "-m", + modelsPath + "/" + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs + ); + break; + } + + let failed = false; + upscayl?.stderr.on("data", (data) => { + console.log( + "🚀 => upscayl.stderr.on => stderr.toString()", + data.toString() + ); + data = data.toString(); + mainWindow.webContents.send( + commands.FOLDER_UPSCAYL_PROGRESS, + data.toString() + ); + if (data.includes("invalid gpu") || data.includes("failed")) { + failed = true; + } + }); + + upscayl?.on("error", (data) => { + mainWindow.webContents.send( + commands.FOLDER_UPSCAYL_PROGRESS, + data.toString() + ); + failed = true; + return; + }); + + // Send done comamnd when + upscayl?.on("close", (code) => { + if (failed !== true) { + console.log("Done upscaling"); + mainWindow.webContents.send(commands.FOLDER_UPSCAYL_DONE, outputDir); + } + }); +}); + //------------------------Video Upscayl-----------------------------// ipcMain.on(commands.UPSCAYL_VIDEO, async (event, payload) => { // Extract the model @@ -475,129 +658,6 @@ ipcMain.on(commands.UPSCAYL_VIDEO, async (event, payload) => { }); }); -//------------------------Upscayl Folder-----------------------------// -ipcMain.on(commands.FOLDER_UPSCAYL, async (event, payload) => { - // GET THE MODEL - const model = payload.model; - - // GET THE IMAGE DIRECTORY - let inputDir = payload.batchFolderPath; - console.log("🚀 => file: index.ts => line 471 => inputDir", inputDir); - - // GET THE OUTPUT DIRECTORY - let outputDir = model.includes("models-DF2K") - ? payload.outputPath + "_sharpened" - : payload.outputPath; - console.log("🚀 => file: index.ts => line 474 => outputDir", outputDir); - - if (!fs.existsSync(outputDir)) { - fs.mkdirSync(outputDir, { recursive: true }); - } - // UPSCALE - let upscayl: ChildProcessWithoutNullStreams | null = null; - switch (model) { - default: - upscayl = spawn( - execPath("realesrgan"), - [ - "-i", - inputDir, - "-o", - outputDir, - "-s", - 4, - "-m", - modelsPath, - "-n", - model, - ], - { - cwd: undefined, - detached: false, - } - ); - console.log( - "🆙 COMMAND:", - "-i", - inputDir, - "-o", - outputDir, - "-s", - 4, - "-m", - modelsPath, - "-n", - model - ); - break; - case "models-DF2K": - upscayl = spawn( - execPath("realsr"), - [ - "-i", - inputDir, - "-o", - outputDir, - "-s", - 4, - "-x", - "-m", - modelsPath + "/" + model, - ], - { - cwd: undefined, - detached: false, - } - ); - console.log( - "🆙 COMMAND:", - "-i", - inputDir, - "-o", - outputDir, - "-s", - 4, - "-x", - "-m", - modelsPath + "/" + model - ); - break; - } - - let failed = false; - upscayl?.stderr.on("data", (data) => { - console.log( - "🚀 => upscayl.stderr.on => stderr.toString()", - data.toString() - ); - data = data.toString(); - mainWindow.webContents.send( - commands.FOLDER_UPSCAYL_PROGRESS, - data.toString() - ); - if (data.includes("invalid gpu") || data.includes("failed")) { - failed = true; - } - }); - - upscayl?.on("error", (data) => { - mainWindow.webContents.send( - commands.FOLDER_UPSCAYL_PROGRESS, - data.toString() - ); - failed = true; - return; - }); - - // Send done comamnd when - upscayl?.on("close", (code) => { - if (failed !== true) { - console.log("Done upscaling"); - mainWindow.webContents.send(commands.FOLDER_UPSCAYL_DONE, outputDir); - } - }); -}); - //------------------------Auto-Update Code-----------------------------// // ! AUTO UPDATE STUFF autoUpdater.on("update-available", ({ releaseNotes, releaseName }) => { diff --git a/main/index.js b/main/index.js index 26f0e52..6a21b73 100644 --- a/main/index.js +++ b/main/index.js @@ -112,6 +112,8 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a const model = payload.model; let inputDir = payload.imagePath.match(/(.*)[\/\\]/)[1] || ""; let outputDir = payload.outputPath; + const gpuId = payload.gpuId; + const saveImageAs = payload.saveImageAs; // COPY IMAGE TO TMP FOLDER const platform = (0, getPlatform_1.default)(); const fullfileName = platform === "win" @@ -119,7 +121,7 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a : payload.imagePath.split("/").slice(-1)[0]; const fileName = (0, path_1.parse)(fullfileName).name; const fileExt = (0, path_1.parse)(fullfileName).ext; - const outFile = outputDir + "/" + fileName + "_upscayl_8x_" + model + fileExt; + const outFile = outputDir + "/" + fileName + "_upscayl_8x_" + model + "." + saveImageAs; // UPSCALE let upscayl = (0, child_process_1.spawn)((0, binaries_1.execPath)("realesrgan"), [ "-i", @@ -132,11 +134,14 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a binaries_1.modelsPath, "-n", model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, ], { cwd: undefined, detached: false, }); - console.log("🆙 COMMAND:", "-i", inputDir + "/" + fullfileName, "-o", outFile, "-s", 4, "-m", binaries_1.modelsPath, "-n", model); + console.log("🆙 COMMAND:", "-i", inputDir + "/" + fullfileName, "-o", outFile, "-s", 4, "-m", binaries_1.modelsPath, "-n", model, gpuId ? `-g ${gpuId}` : "", "-f", saveImageAs); let failed = false; // TAKE UPSCAYL OUTPUT upscayl.stderr.on("data", (data) => { @@ -165,7 +170,21 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a // IF NOT FAILED if (!failed) { // UPSCALE - let upscayl2 = (0, child_process_1.spawn)((0, binaries_1.execPath)("realesrgan"), ["-i", outFile, "-o", outFile, "-s", 4, "-m", binaries_1.modelsPath, "-n", model], { + let upscayl2 = (0, child_process_1.spawn)((0, binaries_1.execPath)("realesrgan"), [ + "-i", + outFile, + "-o", + outFile, + "-s", + 4, + "-m", + binaries_1.modelsPath, + "-n", + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, + ], { cwd: undefined, detached: false, }); @@ -205,6 +224,8 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter(void 0, void 0, void 0, function* () { const model = payload.model; const scale = payload.scaleFactor; + const gpuId = payload.gpuId; + const saveImageAs = payload.saveImageAs; let inputDir = payload.imagePath.match(/(.*)[\/\\]/)[1] || ""; let outputDir = payload.outputPath; // COPY IMAGE TO TMP FOLDER @@ -220,8 +241,17 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter( scale + "x_" + model + - fileExt - : outputDir + "/" + fileName + "_upscayl_" + scale + "x_" + model + fileExt; + "." + + saveImageAs + : outputDir + + "/" + + fileName + + "_upscayl_" + + scale + + "x_" + + model + + "." + + saveImageAs; // UPSCALE if (fs_1.default.existsSync(outFile)) { // If already upscayled, just output that file @@ -242,11 +272,14 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter( binaries_1.modelsPath, "-n", model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, ], { cwd: undefined, detached: false, }); - console.log("🆙 COMMAND: ", "-i", inputDir + "/" + fullfileName, "-o", outFile, "-s", scale === 2 ? 4 : scale, "-m", binaries_1.modelsPath, "-n", model); + console.log("🆙 COMMAND: ", "-i", inputDir + "/" + fullfileName, "-o", outFile, "-s", scale === 2 ? 4 : scale, "-m", binaries_1.modelsPath, "-n", model, gpuId ? `-g ${gpuId}` : "", "-f", saveImageAs); break; case "models-DF2K": upscayl = (0, child_process_1.spawn)((0, binaries_1.execPath)("realsr"), [ @@ -259,11 +292,14 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter( "-x", "-m", binaries_1.modelsPath + "/" + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, ], { cwd: undefined, detached: false, }); - console.log("🆙 COMMAND: ", "-i", inputDir + "/" + fullfileName, "-o", outFile, "-s", scale, "-x", "-m", binaries_1.modelsPath + "/" + model); + console.log("🆙 COMMAND: ", "-i", inputDir + "/" + fullfileName, "-o", outFile, "-s", scale, "-x", "-m", binaries_1.modelsPath + "/" + model, gpuId ? `-g ${gpuId}` : "", "-f", saveImageAs); break; } let failed = false; @@ -289,6 +325,90 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter( }); } })); +//------------------------Upscayl Folder-----------------------------// +electron_1.ipcMain.on(commands_1.default.FOLDER_UPSCAYL, (event, payload) => __awaiter(void 0, void 0, void 0, function* () { + // GET THE MODEL + const model = payload.model; + const gpuId = payload.gpuId; + const saveImageAs = payload.saveImageAs; + // GET THE IMAGE DIRECTORY + let inputDir = payload.batchFolderPath; + console.log("🚀 => file: index.ts => line 471 => inputDir", inputDir); + // GET THE OUTPUT DIRECTORY + let outputDir = model.includes("models-DF2K") + ? payload.outputPath + "_sharpened" + : payload.outputPath; + console.log("🚀 => file: index.ts => line 474 => outputDir", outputDir); + if (!fs_1.default.existsSync(outputDir)) { + fs_1.default.mkdirSync(outputDir, { recursive: true }); + } + // UPSCALE + let upscayl = null; + switch (model) { + default: + upscayl = (0, child_process_1.spawn)((0, binaries_1.execPath)("realesrgan"), [ + "-i", + inputDir, + "-o", + outputDir, + "-s", + 4, + "-m", + binaries_1.modelsPath, + "-n", + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, + ], { + cwd: undefined, + detached: false, + }); + console.log("🆙 COMMAND:", "-i", inputDir, "-o", outputDir, "-s", 4, "-m", binaries_1.modelsPath, "-n", model, gpuId ? `-g ${gpuId}` : "", "-f", saveImageAs); + break; + case "models-DF2K": + upscayl = (0, child_process_1.spawn)((0, binaries_1.execPath)("realsr"), [ + "-i", + inputDir, + "-o", + outputDir, + "-s", + 4, + "-x", + "-m", + binaries_1.modelsPath + "/" + model, + gpuId ? `-g ${gpuId}` : "", + "-f", + saveImageAs, + ], { + cwd: undefined, + detached: false, + }); + console.log("🆙 COMMAND:", "-i", inputDir, "-o", outputDir, "-s", 4, "-x", "-m", binaries_1.modelsPath + "/" + model, gpuId ? `-g ${gpuId}` : "", "-f", saveImageAs); + break; + } + let failed = false; + upscayl === null || upscayl === void 0 ? void 0 : upscayl.stderr.on("data", (data) => { + console.log("🚀 => upscayl.stderr.on => stderr.toString()", data.toString()); + data = data.toString(); + mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_PROGRESS, data.toString()); + if (data.includes("invalid gpu") || data.includes("failed")) { + failed = true; + } + }); + upscayl === null || upscayl === void 0 ? void 0 : upscayl.on("error", (data) => { + mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_PROGRESS, data.toString()); + failed = true; + return; + }); + // Send done comamnd when + upscayl === null || upscayl === void 0 ? void 0 : upscayl.on("close", (code) => { + if (failed !== true) { + console.log("Done upscaling"); + mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_DONE, outputDir); + } + }); +})); //------------------------Video Upscayl-----------------------------// electron_1.ipcMain.on(commands_1.default.UPSCAYL_VIDEO, (event, payload) => __awaiter(void 0, void 0, void 0, function* () { // Extract the model @@ -360,82 +480,6 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL_VIDEO, (event, payload) => __aw } }); })); -//------------------------Upscayl Folder-----------------------------// -electron_1.ipcMain.on(commands_1.default.FOLDER_UPSCAYL, (event, payload) => __awaiter(void 0, void 0, void 0, function* () { - // GET THE MODEL - const model = payload.model; - // GET THE IMAGE DIRECTORY - let inputDir = payload.batchFolderPath; - console.log("🚀 => file: index.ts => line 471 => inputDir", inputDir); - // GET THE OUTPUT DIRECTORY - let outputDir = model.includes("models-DF2K") - ? payload.outputPath + "_sharpened" - : payload.outputPath; - console.log("🚀 => file: index.ts => line 474 => outputDir", outputDir); - if (!fs_1.default.existsSync(outputDir)) { - fs_1.default.mkdirSync(outputDir, { recursive: true }); - } - // UPSCALE - let upscayl = null; - switch (model) { - default: - upscayl = (0, child_process_1.spawn)((0, binaries_1.execPath)("realesrgan"), [ - "-i", - inputDir, - "-o", - outputDir, - "-s", - 4, - "-m", - binaries_1.modelsPath, - "-n", - model, - ], { - cwd: undefined, - detached: false, - }); - console.log("🆙 COMMAND:", "-i", inputDir, "-o", outputDir, "-s", 4, "-m", binaries_1.modelsPath, "-n", model); - break; - case "models-DF2K": - upscayl = (0, child_process_1.spawn)((0, binaries_1.execPath)("realsr"), [ - "-i", - inputDir, - "-o", - outputDir, - "-s", - 4, - "-x", - "-m", - binaries_1.modelsPath + "/" + model, - ], { - cwd: undefined, - detached: false, - }); - console.log("🆙 COMMAND:", "-i", inputDir, "-o", outputDir, "-s", 4, "-x", "-m", binaries_1.modelsPath + "/" + model); - break; - } - let failed = false; - upscayl === null || upscayl === void 0 ? void 0 : upscayl.stderr.on("data", (data) => { - console.log("🚀 => upscayl.stderr.on => stderr.toString()", data.toString()); - data = data.toString(); - mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_PROGRESS, data.toString()); - if (data.includes("invalid gpu") || data.includes("failed")) { - failed = true; - } - }); - upscayl === null || upscayl === void 0 ? void 0 : upscayl.on("error", (data) => { - mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_PROGRESS, data.toString()); - failed = true; - return; - }); - // Send done comamnd when - upscayl === null || upscayl === void 0 ? void 0 : upscayl.on("close", (code) => { - if (failed !== true) { - console.log("Done upscaling"); - mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_DONE, outputDir); - } - }); -})); //------------------------Auto-Update Code-----------------------------// // ! AUTO UPDATE STUFF electron_updater_1.autoUpdater.on("update-available", ({ releaseNotes, releaseName }) => { diff --git a/renderer/components/ImageOptions.tsx b/renderer/components/ImageOptions.tsx index 4a2bfc4..c56322a 100644 --- a/renderer/components/ImageOptions.tsx +++ b/renderer/components/ImageOptions.tsx @@ -1,16 +1,50 @@ import React from "react"; -const ImageOptions = () => { +const ImageOptions = ({ + zoomAmount, + setZoomAmount, +}: { + zoomAmount: number; + setZoomAmount: (arg: any) => void; +}) => { + const handleZoom = (direction: number) => { + console.log(zoomAmount + direction * 25); + if (direction === 0) { + setZoomAmount(""); + } else { + setZoomAmount("zoom-125"); + } + }; + return ( -
+
Show/Hide Image Settings
-
- +
+ +
+

Zoom:

+ + + +
+
+

Position:

+ + + + +
diff --git a/renderer/components/LeftPaneImageSteps.tsx b/renderer/components/LeftPaneImageSteps.tsx index 6207365..29189eb 100644 --- a/renderer/components/LeftPaneImageSteps.tsx +++ b/renderer/components/LeftPaneImageSteps.tsx @@ -20,6 +20,10 @@ interface IProps { model: string; isVideo: boolean; setIsVideo: (arg: boolean) => void; + saveImageAs: string; + setSaveImageAs: (arg: string) => void; + gpuId: string; + setGpuId: (arg: string) => void; } function LeftPaneImageSteps({ @@ -39,10 +43,11 @@ function LeftPaneImageSteps({ model, isVideo, setIsVideo, + gpuId, + setGpuId, + saveImageAs, + setSaveImageAs, }: IProps) { - const [saveImageAs, setSaveImageAs] = useState("png"); - const [gpuId, setGpuId] = useState("0"); - useEffect(() => { themeChange(false); if (!localStorage.getItem("saveImageAs")) { @@ -94,35 +99,35 @@ function LeftPaneImageSteps({ ]; const availableThemes = [ - "light", - "dark", - "cupcake", - "bumblebee", - "emerald", - "corporate", - "synthwave", - "retro", - "cyberpunk", - "valentine", - "halloween", - "garden", - "forest", - "aqua", - "lofi", - "pastel", - "fantasy", - "wireframe", - "black", - "luxury", - "dracula", - "cmyk", - "autumn", - "business", - "acid", - "lemonade", - "night", - "coffee", - "winter", + { label: "light", value: "light" }, + { label: "dark", value: "dark" }, + { label: "cupcake", value: "cupcake" }, + { label: "bumblebee", value: "bumblebee" }, + { label: "emerald", value: "emerald" }, + { label: "corporate", value: "corporate" }, + { label: "synthwave", value: "synthwave" }, + { label: "retro", value: "retro" }, + { label: "cyberpunk", value: "cyberpunk" }, + { label: "valentine", value: "valentine" }, + { label: "halloween", value: "halloween" }, + { label: "garden", value: "garden" }, + { label: "forest", value: "forest" }, + { label: "aqua", value: "aqua" }, + { label: "lofi", value: "lofi" }, + { label: "pastel", value: "pastel" }, + { label: "fantasy", value: "fantasy" }, + { label: "wireframe", value: "wireframe" }, + { label: "black", value: "black" }, + { label: "luxury", value: "luxury" }, + { label: "dracula", value: "dracula" }, + { label: "cmyk", value: "cmyk" }, + { label: "autumn", value: "autumn" }, + { label: "business", value: "business" }, + { label: "acid", value: "acid" }, + { label: "lemonade", value: "lemonade" }, + { label: "night", value: "night" }, + { label: "coffee", value: "coffee" }, + { label: "winter", value: "winter" }, ]; return ( @@ -253,8 +258,8 @@ function LeftPaneImageSteps({ {availableThemes.map((theme) => { return ( - ); })} @@ -263,7 +268,7 @@ function LeftPaneImageSteps({

GPU ID:

{ + // STATES const [imagePath, SetImagePath] = useState(""); const [upscaledImagePath, setUpscaledImagePath] = useState(""); const [outputPath, setOutputPath] = useState(""); @@ -31,20 +32,11 @@ const Home = () => { const [videoPath, setVideoPath] = useState(""); const [upscaledVideoPath, setUpscaledVideoPath] = useState(""); const [doubleUpscaylCounter, setDoubleUpscaylCounter] = useState(0); + const [gpuId, setGpuId] = useState(""); + const [saveImageAs, setSaveImageAs] = useState("png"); + const [zoomAmount, setZoomAmount] = useState(""); - const resetImagePaths = () => { - setProgress(""); - - SetImagePath(""); - setUpscaledImagePath(""); - - setBatchFolderPath(""); - setUpscaledBatchFolderPath(""); - - setVideoPath(""); - setUpscaledVideoPath(""); - }; - + // EFFECTS useEffect(() => { setLoaded(true); @@ -73,6 +65,7 @@ const Home = () => { } }; + // UPSCAYL PROGRESS window.electron.on(commands.UPSCAYL_PROGRESS, (_, data) => { console.log( "🚀 => file: index.jsx => line 61 => window.electron.on => data", @@ -84,12 +77,16 @@ const Home = () => { } handleErrors(data); }); + + // FOLDER UPSCAYL PROGRESS window.electron.on(commands.FOLDER_UPSCAYL_PROGRESS, (_, data) => { if (data.length > 0 && data.length < 10) { setProgress(data); } handleErrors(data); }); + + // DOUBLE UPSCAYL PROGRESS window.electron.on(commands.DOUBLE_UPSCAYL_PROGRESS, (_, data) => { if (data.length > 0 && data.length < 10) { if (data === "0.00%") { @@ -99,6 +96,8 @@ const Home = () => { } handleErrors(data); }); + + // VIDEO UPSCAYL PROGRESS window.electron.on(commands.UPSCAYL_VIDEO_PROGRESS, (_, data) => { if (data.length > 0 && data.length < 10) { setProgress(data); @@ -106,19 +105,26 @@ const Home = () => { handleErrors(data); }); + // UPSCAYL DONE window.electron.on(commands.UPSCAYL_DONE, (_, data) => { setProgress(""); setUpscaledImagePath(data); }); + + // FOLDER UPSCAYL DONE window.electron.on(commands.FOLDER_UPSCAYL_DONE, (_, data) => { setProgress(""); setUpscaledBatchFolderPath(data); }); + + // DOUBLE UPSCAYL DONE window.electron.on(commands.DOUBLE_UPSCAYL_DONE, (_, data) => { setProgress(""); setDoubleUpscaylCounter(0); setUpscaledImagePath(data); }); + + // VIDEO UPSCAYL DONE window.electron.on(commands.UPSCAYL_VIDEO_DONE, (_, data) => { setProgress(""); setUpscaledVideoPath(data); @@ -165,6 +171,20 @@ const Home = () => { } }, [imagePath, videoPath]); + const resetImagePaths = () => { + setProgress(""); + + SetImagePath(""); + setUpscaledImagePath(""); + + setBatchFolderPath(""); + setUpscaledBatchFolderPath(""); + + setVideoPath(""); + setUpscaledVideoPath(""); + }; + + // HANDLERS const selectVideoHandler = async () => { resetImagePaths(); @@ -207,6 +227,7 @@ const Home = () => { } }; + // DRAG AND DROP HANDLERS const handleDragEnter = (e) => { e.preventDefault(); console.log("drag enter"); @@ -219,13 +240,11 @@ const Home = () => { e.preventDefault(); console.log("drag over"); }; + const openFolderHandler = (e) => { window.electron.send(commands.OPEN_FOLDER, upscaledBatchFolderPath); }; - const allowedFileTypes = ["png", "jpg", "jpeg", "webp"]; - const allowedVideoFileTypes = ["webm", "mp4", "mkv"]; - const handleDrop = (e) => { e.preventDefault(); resetImagePaths(); @@ -302,6 +321,8 @@ const Home = () => { imagePath, outputPath, model, + gpuId: gpuId.length === 0 ? null : gpuId, + saveImageAs, }); } else if (batchMode) { setDoubleUpscayl(false); @@ -310,6 +331,8 @@ const Home = () => { batchFolderPath, outputPath, model, + gpuId: gpuId.length === 0 ? null : gpuId, + saveImageAs, }); } else { await window.electron.send(commands.UPSCAYL, { @@ -317,6 +340,8 @@ const Home = () => { imagePath, outputPath, model, + gpuId: gpuId.length === 0 ? null : gpuId, + saveImageAs, }); } } else if (isVideo && videoPath !== "") { @@ -325,12 +350,17 @@ const Home = () => { videoPath, outputPath, model, + gpuId: gpuId.length === 0 ? null : gpuId, + saveImageAs, }); } else { alert(`Please select ${isVideo ? "a video" : "an image"} to upscale`); } }; + const allowedFileTypes = ["png", "jpg", "jpeg", "webp"]; + const allowedVideoFileTypes = ["webm", "mp4", "mkv"]; + return (
@@ -397,6 +427,10 @@ const Home = () => { model={model} isVideo={isVideo} setIsVideo={setIsVideo} + gpuId={gpuId} + setGpuId={setGpuId} + saveImageAs={saveImageAs} + setSaveImageAs={setSaveImageAs} /> )}