Updated Double Upscayl

main/commands.js

@@ -4,9 +4,9 @@ const commands = {
   UPSCAYL: "Upscale the Image",
   UPSCAYL_DONE: "Upscaling Done",
   UPSCAYL_PROGRESS: "Send Progress from Main to Renderer",
-  SHARPEN: "Sharpen the Image First",
-  SHARPEN_PROGRESS: "Send Sharpening Progress from Main to Renderer",
-  SHARPEN_DONE: "Sharpening Done",
+  DOUBLE_UPSCAYL: "Double Upscale the Image",
+  DOUBLE_UPSCAYL_DONE: "Double Upscaling Done",
+  DOUBLE_UPSCAYL_PROGRESS: "Send Double Upscayl Progress from Main to Renderer",
 };
 
 module.exports = commands;

main/index.js

@@ -105,46 +105,36 @@ ipcMain.handle(commands.SELECT_FOLDER, async (event, message) => {
   }
 });
 
-ipcMain.on(commands.SHARPEN, async (event, payload) => {
+ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => {
   const model = payload.model;
-  const scale = payload.scaleFactor;
   let inputDir = payload.imagePath.match(/(.*)[\/\\]/)[1] || "";
-  const platform = getPlatform();
-
-  let outputDir = platform === "win" ? ".\\sharpened" : "./sharpened";
-  if (!fs.existsSync(outputDir)) {
-    fs.mkdirSync(outputDir);
-  }
+  let outputDir = payload.outputPath;
+  console.log(outputDir);
 
   // COPY IMAGE TO TMP FOLDER
+  const platform = getPlatform();
   const fullfileName =
     platform === "win"
       ? payload.imagePath.split("\\").slice(-1)[0]
       : 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 inputFile = inputDir + "/" + fullfileName;
-  const copiedInputFile = outputDir + "/" + fullfileName;
-  const sharpenedFile = platform === "win" ? outputDir + "\\" + fileName + "_sharpen" + fileExt : outputDir + "/" + fileName + "_sharpen" + fileExt;
-  const outFile =
-    inputDir + "/" + fileName + "_upscayl_" + scale + "x_" + model + fileExt;
-  fs.copyFile(inputFile, copiedInputFile, (err) => {
-    if (err) throw err;
-  });
-
-  let sharpen = spawn(
-    execPath("realsr"),
+  // UPSCALE
+  let upscayl = spawn(
+    execPath("realesrgan"),
     [
       "-i",
-      copiedInputFile,
+      inputDir + "/" + fullfileName,
       "-o",
-      sharpenedFile,
+      outFile,
       "-s",
       4,
-      "-x",
       "-m",
-      modelsPath + "/models-DF2K",
+      modelsPath,
+      "-n",
+      model,
     ],
     {
       cwd: null,
@@ -153,65 +143,77 @@ ipcMain.on(commands.SHARPEN, async (event, payload) => {
   );
 
   let failed = false;
-  sharpen.stderr.on("data", (data) => {
-    console.log(data.toString());
+  // TAKE UPSCAYL OUTPUT
+  upscayl.stderr.on("data", (data) => {
+    // CONVERT DATA TO STRING
     data = data.toString();
-    mainWindow.webContents.send(commands.SHARPEN_PROGRESS, data.toString());
+    // PRINT TO CONSOLE
+    console.log(data);
+    // SEND UPSCAYL PROGRESS TO RENDERER
+    mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_PROGRESS, data);
+    // IF PROGRESS HAS ERROR, UPSCAYL FAILED
     if (data.includes("invalid gpu") || data.includes("failed")) {
       failed = true;
-      sharpen.kill("SIGKILL");
-      return;
     }
   });
-  sharpen.on("close", (_) => {
-    if (failed !== true) {
-      console.log("Done sharpening: ", outFile);
-      mainWindow.webContents.send(commands.SHARPEN_DONE, outFile);
-      let upscayl = spawn(
+
+  // IF ERROR
+  upscayl.on("error", (data) => {
+    data.toString();
+    // SEND UPSCAYL PROGRESS TO RENDERER
+    mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_PROGRESS, data);
+    // SET FAILED TO TRUE
+    failed = true;
+    return;
+  });
+
+  // ON UPSCAYL DONE
+  upscayl.on("close", (code) => {
+    // IF NOT FAILED
+    if (!failed) {
+      // UPSCALE
+      let upscayl2 = spawn(
         execPath("realesrgan"),
-        [
-          "-i",
-          sharpenedFile,
-          "-o",
-          outFile,
-          "-s",
-          scale === 2 ? 4 : scale,
-          "-m",
-          modelsPath,
-          "-n",
-          model,
-        ],
+        ["-i", outFile, "-o", outFile, "-s", 4, "-m", modelsPath, "-n", model],
         {
           cwd: null,
           detached: false,
         }
       );
-      let failed = false;
-      upscayl.stderr.on("data", (data) => {
-        console.log(
-          "🚀 => upscayl.stderr.on => stderr.toString()",
-          data.toString()
-        );
+
+      let failed2 = false;
+      // TAKE UPSCAYL OUTPUT
+      upscayl2.stderr.on("data", (data) => {
+        // CONVERT DATA TO STRING
         data = data.toString();
-        mainWindow.webContents.send(commands.UPSCAYL_PROGRESS, data.toString());
+        // PRINT TO CONSOLE
+        console.log(data);
+        // SEND UPSCAYL PROGRESS TO RENDERER
+        mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_PROGRESS, data);
+        // IF PROGRESS HAS ERROR, UPSCAYL FAILED
         if (data.includes("invalid gpu") || data.includes("failed")) {
-          failed = true;
+          failed2 = true;
         }
       });
-      upscayl.on("error", (data) => {
-        mainWindow.webContents.send(commands.UPSCAYL_PROGRESS, data.toString());
-        failed = true;
+
+      // IF ERROR
+      upscayl2.on("error", (data) => {
+        data.toString();
+        // SEND UPSCAYL PROGRESS TO RENDERER
+        mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_PROGRESS, data);
+        // SET FAILED TO TRUE
+        failed2 = true;
         return;
       });
-      // Send done comamnd when
-      upscayl.on("close", (code) => {
-        if (failed !== true) {
+
+      upscayl2.on("close", (code) => {
+        if (!failed2) {
           console.log("Done upscaling");
-          mainWindow.webContents.send(commands.UPSCAYL_DONE, outFile);
+          mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_DONE, outFile);
         }
-      })
+      });
     }
-  })
+  });
 });
 
 ipcMain.on(commands.UPSCAYL, async (event, payload) => {
@@ -227,7 +229,7 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
     platform === "win"
       ? payload.imagePath.split("\\").slice(-1)[0]
       : payload.imagePath.split("/").slice(-1)[0];
-  console.log(fullfileName)
+  console.log(fullfileName);
   const fileName = parse(fullfileName).name;
   const fileExt = parse(fullfileName).ext;
   const outFile =

main/utils.js

@@ -0,0 +1,25 @@
+const { spawn } = require("child_process");
+const { execPath } = require("./binaries");
+/**
+ *
+ * @param {*} inputFile
+ * @param {*} outFile
+ * @param {*} modelsPath
+ * @param {*} model
+ * @returns
+ */
+function upscaylImage(inputFile, outFile, modelsPath, model) {
+  // UPSCALE
+  let upscayl = spawn(
+    execPath("realesrgan"),
+    ["-i", inputFile, "-o", outFile, "-s", 4, "-m", modelsPath, "-n", model],
+    {
+      cwd: null,
+      detached: false,
+    }
+  );
+
+  return upscayl;
+}
+
+module.exports = { upscaylImage };

renderer/components/LeftPaneSteps.jsx

@@ -49,22 +49,24 @@ function LeftPaneSteps(props) {
             <p className="mb-2 text-sm text-neutral-400">
               Select Upscaling Type
             </p>
-            <div className="mb-2 flex items-center gap-1">
-              <input
-                type="checkbox"
-                className="h-4 w-4 cursor-pointer appearance-none rounded-sm bg-neutral-500 transition duration-200 checked:bg-green-400 focus:outline-none focus-visible:border focus-visible:border-green-400"
-                onChange={(e) => {
-                  props.setSharpen(e.target.checked);
-                }}
-              />
-              <p
-                className={`inline-block text-sm font-medium ${
-                  props.sharpen ? "text-green-400" : "text-neutral-500"
-                }`}
-              >
-                Sharpen Image
-              </p>
-            </div>
+            {props.model !== "models-DF2K" && (
+              <div className="mb-2 flex items-center gap-1">
+                <input
+                  type="checkbox"
+                  className="h-4 w-4 cursor-pointer appearance-none rounded-sm bg-neutral-500 transition duration-200 checked:bg-green-400 focus:outline-none focus-visible:border focus-visible:border-green-400"
+                  onChange={(e) => {
+                    props.setDoubleUpscayl(e.target.checked);
+                  }}
+                />
+                <p
+                  className={`inline-block text-sm font-medium ${
+                    props.doubleUpscayl ? "text-green-400" : "text-neutral-500"
+                  }`}
+                >
+                  Double Upscayl
+                </p>
+              </div>
+            )}
             <select
               name="select-model"
               onDrop={(e) => props.handleDrop(e)}
@@ -73,6 +75,7 @@ function LeftPaneSteps(props) {
             >
               <option value="realesrgan-x4plus">General Photo</option>
               <option value="realesrgan-x4plus-anime">Digital Art</option>
+              <option value="models-DF2K">Sharpen Image</option>
             </select>
           </div>
 
@@ -129,8 +132,7 @@ function LeftPaneSteps(props) {
             >
               <option value="realesrgan-x4plus">General Photo</option>
               <option value="realesrgan-x4plus-anime">Digital Art</option>
-              <option value="models-DF2K">Sharpen</option>
-              <option value="models-DF2K_JPEG">Sharpen JPEG</option>
+              <option value="models-DF2K">Sharpen Image</option>
             </select>
           </div>
 

renderer/components/ProgressBar.jsx

@@ -8,18 +8,11 @@ function ProgressBar(props) {
     <div className="absolute flex h-full w-full flex-col items-center justify-center bg-black/50 backdrop-blur-lg">
       <div className="flex flex-col items-center gap-2">
         <Image src={Animated} />
-        <p className="font-bold text-neutral-50">
-          {props.sharpening ? props.sharpeningProgress : props.progress}
+        <p className="font-bold text-neutral-50">{props.progress}</p>
+
+        <p className="text-sm font-medium text-neutral-200">
+          Doing the Upscayl magic...
         </p>
-        {props.sharpening ? (
-          <p className="text-sm font-medium text-neutral-200">
-            Sharpening your Image...
-          </p>
-        ) : (
-          <p className="text-sm font-medium text-neutral-200">
-            Doing the Upscayl magic...
-          </p>
-        )}
       </div>
     </div>
   );

renderer/pages/index.jsx

@@ -21,10 +21,7 @@ const Home = () => {
   const [loaded, setLoaded] = useState(false);
   const [version, setVersion] = useState("");
   const [batchMode, setBatchMode] = useState(false);
-  const [sharpen, setSharpen] = useState(false);
-  const [sharpening, setSharpening] = useState(false);
-  const [sharpenedImagePath, setSharpenedImagePath] = useState("");
-  const [sharpeningProgress, setSharpeningProgress] = useState("");
+  const [doubleUpscayl, setDoubleUpscayl] = useState(false);
 
   const resetImagePaths = () => {
     setProgress("");
@@ -64,9 +61,9 @@ const Home = () => {
       handleErrors(data);
     });
 
-    window.electron.on(commands.SHARPEN_PROGRESS, (_, data) => {
+    window.electron.on(commands.DOUBLE_UPSCAYL_PROGRESS, (_, data) => {
       if (data.length > 0 && data.length < 10) {
-        setSharpeningProgress(data);
+        setProgress(data);
       }
       handleErrors(data);
     });
@@ -75,8 +72,8 @@ const Home = () => {
       setProgress("");
       setUpscaledImagePath(data);
     });
-    window.electron.on(commands.SHARPEN_DONE, (_, data) => {
-      setSharpenedImagePath(data);
+    window.electron.on(commands.DOUBLE_UPSCAYL_DONE, (_, data) => {
+      setUpscaledImagePath(data);
     });
   }, []);
 
@@ -167,24 +164,23 @@ const Home = () => {
     setUpscaledImagePath("");
     if (imagePath !== "") {
       setProgress("Hold on...");
+      if (model === "models-DF2K") {
+        setDoubleUpscayl(false);
+      }
 
-      if (sharpen) {
-        setSharpening(true);
-        const sharpenResponse = await window.electron.send(commands.SHARPEN, {
-          scaleFactor,
+      if (doubleUpscayl) {
+        await window.electron.send(commands.DOUBLE_UPSCAYL, {
           imagePath,
           outputPath,
           model,
         });
-        console.log("🚀 => upscaylHandler => sharpenResponse", sharpenResponse);
-      }
-      else {
+      } else {
         await window.electron.send(commands.UPSCAYL, {
           scaleFactor,
           imagePath,
           outputPath,
           model,
-        })
+        });
       }
     } else {
       alert("Please select an image to upscale");
@@ -212,8 +208,9 @@ const Home = () => {
           setBatchMode={setBatchMode}
           imagePath={imagePath}
           outputPath={outputPath}
-          sharpen={sharpen}
-          setSharpen={setSharpen}
+          doubleUpscayl={doubleUpscayl}
+          setDoubleUpscayl={setDoubleUpscayl}
+          model={model}
         />
 
         <Footer />
@@ -229,11 +226,7 @@ const Home = () => {
         onPaste={(e) => handlePaste(e)}
       >
         {progress.length > 0 && upscaledImagePath.length === 0 && (
-          <ProgressBar
-            progress={progress}
-            sharpeningProgress={sharpeningProgress}
-            sharpening={sharpening}
-          />
+          <ProgressBar progress={progress} />
         )}
 
         {imagePath.length === 0 ? (