rolled back some changes

2025-01-31 04:03:51 +01:00 · 2022-08-29 19:11:59 +05:30 · 2022-08-29 19:11:59 +05:30 · 2b1d45a2af
commit 2b1d45a2af
parent fbdc3f7bfa
3 changed files with 84 additions and 143 deletions
--- a/main/commands.js
+++ b/main/commands.js
@ -1,8 +1,7 @@
 const commands = {
  SELECT_FILE: "Select a File",
-  SELECT_OUTPUT: "Save as",
-  SET_FILE: "Set file",
-  REPLACE_ORIGINAL: "Replace original",
+  SELECT_FOLDER: "Select a Folder",
+  FILE_EXISTING: "File exists",
  UPSCAYL: "Upscale the Image",
  UPSCAYL_DONE: "Upscaling Done",
  UPSCAYL_PROGRESS: "Send Progress from Main to Renderer",
--- a/main/index.js
+++ b/main/index.js
@ -4,7 +4,6 @@ const { format } = require("url");
 const { spawn } = require("child_process");
 const fs = require("fs");
 const sizeOf = require("image-size");
-const path = require('path');
 const { autoUpdater } = require("electron-updater");
 const { getPlatform } = require("./getPlatform");

@ -22,7 +21,6 @@ const {
 const isDev = require("electron-is-dev");
 const prepareNext = require("electron-next");
 const commands = require("./commands");
-const tmpPath = path.join(app.getPath("userData"), "\\tmp\\");

 // Prepare the renderer once the app is ready
 let mainWindow;
@ -73,16 +71,6 @@ app.on("ready", async () => {
 // Quit the app once all windows are closed
 app.on("window-all-closed", app.quit);

-// Fix file:// + ? by registering a new protocol
-app.whenReady().then(() => {
-  const { protocol } = require("electron");
-  protocol.registerFileProtocol('local', (request, callback) => {
-    const pathname = decodeURIComponent(request.url.replace('local://', ''));
-    const parts = pathname.split('?');
-    callback(parts[0]);
-  });
-});
-
 // ! DONT FORGET TO RESTART THE APP WHEN YOU CHANGE CODE HERE

 ipcMain.handle(commands.SELECT_FILE, async () => {
@ -95,49 +83,21 @@ ipcMain.handle(commands.SELECT_FILE, async () => {
    return "cancelled";
  } else {
    console.log(filePaths[0]);
-    // CREATE original copy
-    if(!fs.existsSync(tmpPath)) {
-      fs.mkdirSync(tmpPath);
-    }
-    fs.copyFileSync(filePaths[0], path.join(tmpPath, "original" + parse(filePaths[0]).ext));
+    // CREATE input AND upscaled FOLDER
    return filePaths[0];
  }
 });

-ipcMain.handle(commands.SET_FILE, async (event, payload) => {
-  const original = payload.original;
-  const fileExt = parse(original).ext;
-  // CREATE original copy
-  if(!fs.existsSync(tmpPath)) {
-    fs.mkdirSync(tmpPath);
-  }
-  fs.copyFileSync(original, path.join(tmpPath, "original" + fileExt));
-
-})
-
-ipcMain.handle(commands.SELECT_OUTPUT, async (event, payload) => {
-  const original = payload.original;
-  const fileExt = parse(original).ext;
-  const { canceled, filePath } = await dialog.showSaveDialog({
-    filters: [{name: fileExt, extensions: [fileExt.substring(1)]}]
+ipcMain.handle(commands.SELECT_FOLDER, async (event, message) => {
+  const { canceled, filePaths } = await dialog.showOpenDialog({
+    properties: ["openDirectory"],
  });
  if (canceled) {
    console.log("operation cancelled");
    return "cancelled";
  } else {
-    console.log(filePath);
-    if(fs.existsSync(tmpPath + "scaled" + fileExt)) {
-      fs.copyFileSync(tmpPath + "scaled" + fileExt, filePath);
-    }
-    return filePath;
-  }
-});
-
-ipcMain.handle(commands.REPLACE_ORIGINAL, async (event, payload) => {
-  const original = payload.original;
-  const fileExt = parse(original).ext;
-  if(fs.existsSync(tmpPath + "scaled" + fileExt)) {
-    fs.copyFileSync(tmpPath + "scaled" + fileExt, original);
+    console.log(filePaths[0]);
+    return filePaths[0];
  }
 });

@ -146,7 +106,7 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
  const scale = payload.scaleFactor;

  let inputDir = payload.imagePath.match(/(.*)[\/\\]/)[1] || "";
-  let outputDir = tmpPath
+  let outputDir = payload.outputPath;
  console.log("🚀 => ipcMain.on => outputDir", outputDir);

  // COPY IMAGE TO TMP FOLDER
@ -157,48 +117,56 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
      : payload.imagePath.split("/").slice(-1)[0];
  const fileName = parse(fullfileName).name;
  const fileExt = parse(fullfileName).ext;
+  const outFile = outputDir + "/" + fileName + "_upscayled_" + scale + "x_" + model + fileExt;

  // UPSCALE
  console.log("PRODUCTION? :", isDev);
  console.log("EXEC: ", execPath);
-  let upscayl = spawn(
-    execPath,
-    [
-      "-i",
-      tmpPath + "original" + fileExt,
-      "-o",
-      tmpPath + "scaled" + fileExt,
-      "-s",
-      scale === 2 ? 4 : scale,
-      "-m",
-      modelsPath,
-      "-n",
-      model,
-    ],
-    {
-      cwd: null,
-      detached: false,
-    }
-  );
-  let failed = false;
-  upscayl.stderr.on("data", (stderr) => {
-    console.log(stderr.toString());
-    stderr = stderr.toString();
-    if (stderr.includes("invalid gpu")) {
-      failed = true;
-    }
-    mainWindow.webContents.send(commands.UPSCAYL_PROGRESS, stderr.toString());
-  });
-
-  upscayl.on("close", (code) => {
-    if (failed !== true) {
-      console.log("Done upscaling");
-      mainWindow.webContents.send(
-        commands.UPSCAYL_DONE,
-        outputDir + "scaled" + fileExt
-      );
-    }
-  });
+  if (fs.existsSync(outFile)) {
+    mainWindow.webContents.send(
+      commands.UPSCAYL_DONE,
+      outFile
+    );
+  }
+  else {
+    let upscayl = spawn(
+      execPath,
+      [
+        "-i",
+        inputDir + "/" + fullfileName,
+        "-o",
+        outFile,
+        "-s",
+        scale === 2 ? 4 : scale,
+        "-m",
+        modelsPath,
+        "-n",
+        model,
+      ],
+      {
+        cwd: null,
+        detached: false,
+      }
+    );
+    let failed = false;
+    upscayl.stderr.on("data", (stderr) => {
+      console.log(stderr.toString());
+      stderr = stderr.toString();
+      if (stderr.includes("invalid gpu")) {
+        failed = true;
+      }
+      mainWindow.webContents.send(commands.UPSCAYL_PROGRESS, stderr.toString());
+    });
+    upscayl.on("close", (code) => {
+      if (failed !== true) {
+        console.log("Done upscaling");
+        mainWindow.webContents.send(
+          commands.UPSCAYL_DONE,
+          outFile
+        );
+      }
+    });
+  }
 });

 autoUpdater.on("update-available", (_event, releaseNotes, releaseName) => {
--- a/renderer/pages/index.jsx
+++ b/renderer/pages/index.jsx
@ -14,7 +14,6 @@ const Home = () => {
  const [outputPath, SetOutputPath] = useState("");
  const [scaleFactor, setScaleFactor] = useState(4);
  const [progress, setProgress] = useState("");
-  const [curStep, setStep] = useState(1);
  const [model, setModel] = useState("realesrgan-x4plus");
  const [loaded, setLoaded] = useState(false);
  const [version, setVersion] = useState("");
@ -23,13 +22,8 @@ const Home = () => {
    setProgress("");
    SetImagePath("");
    setUpscaledImagePath("");
-    setStep(1);
  };

-  const stepStyle = (thisStep) => {
-    return { display: (thisStep > curStep ? "none" : "block") };
-  }
-
  useEffect(() => {
    setVersion(navigator.userAgent.match(/Upscayl\/([\d\.]+\d+)/)[1]);
  }, []);
@ -54,7 +48,6 @@ const Home = () => {
    window.electron.on(commands.UPSCAYL_DONE, (_, data) => {
      setProgress("");
      setUpscaledImagePath(data);
-      setStep(4);
    });
  }, []);

@ -66,7 +59,6 @@ const Home = () => {
      SetImagePath(path);
      var dirname = path.match(/(.*)[\/\\]/)[1] || "";
      SetOutputPath(dirname);
-      setStep(3);
    }
  };

@ -109,7 +101,6 @@ const Home = () => {
      SetImagePath(filePath);
      var dirname = filePath.match(/(.*)[\/\\]/)[1] || "";
      SetOutputPath(dirname);
-      setStep(3);
      window.electron.invoke(commands.SET_FILE, {original: filePath});
    }
  };
@ -131,21 +122,11 @@ const Home = () => {
      SetImagePath(filePath);
      var dirname = filePath.match(/(.*)[\/\\]/)[1] || "";
      SetOutputPath(dirname);
-      setStep(3);
    }
  };

  const outputHandler = async () => {
-    var path = await window.electron.invoke(commands.SELECT_OUTPUT, { original: imagePath });
-    if (path !== "cancelled") {
-      SetOutputPath(path);
-    } else {
-      console.log("Getting output path from input file");
-    }
-  };
-
-  const replaceHandler = async () => {
-    var path = await window.electron.invoke(commands.REPLACE_ORIGINAL, { original: imagePath });
+    var path = await window.electron.invoke(commands.SELECT_FOLDER);
    if (path !== "cancelled") {
      SetOutputPath(path);
    } else {
@ -192,14 +173,14 @@ const Home = () => {
          <div className="mt-0">
            <p className="mb-2 font-medium text-neutral-100">Step 1</p>
            <button
-              className="rounded-lg bg-rose-400 hover:bg-rose-300 transition-colors p-3 w-full font-semibold"
+              className="rounded-lg bg-rose-400 hover:bg-rose-300 transition-colors p-3 font-semibold"
              onClick={selectImageHandler}
            >
              Select Image
            </button>
          </div>
          {/* STEP 2 */}
-          <div className="mt-5 animate-step-in" style={stepStyle(3)}>
+          <div className="mt-5 animate-step-in">
            <p className="font-medium text-neutral-100">Step 2</p>
            <p className="mb-2 text-sm text-neutral-400">
              Select Upscaling Type
@ -207,26 +188,14 @@ const Home = () => {
            <select
              name="select-model"
              onDrop={(e) => handleDrop(e)}
-              className="rounded-lg bg-slate-300 hover:bg-slate-200 p-3 w-full"
+              className="rounded-lg bg-slate-300 hover:bg-slate-200 p-3"
              onChange={handleModelChange}
            >
-              <option value="realesrgan-x4plus">Photos &amp; Realistic Art</option>
-              <option value="realesrgan-x4plus-anime">2D &amp; Simple Art</option>
+              <option value="realesrgan-x4plus">General Photo</option>
+              <option value="realesrgan-x4plus-anime">Digital Art</option>
            </select>
          </div>

-          {/* STEP 3 */}
-          <div className="mt-5 animate-step-in" style={stepStyle(3)}>
-            <p className="mb-2 font-medium text-neutral-100">Step 3</p>
-            <button
-              className="rounded-lg bg-sky-400 hover:bg-sky-300 transition-colors p-3 w-full font-semibold"
-              onClick={upscaylHandler}
-              disabled={progress.length > 0}
-            >
-              {progress.length > 0 ? "Upscayling⏳" : "Upscayl"}
-            </button>
-          </div>
-
          {/* STEP 3
          <div className="mt-10">
            <p className="font-medium text-neutral-100">Step 3</p>
@ -259,27 +228,32 @@ const Home = () => {
            </div>
          </div> */}

-          {/* STEP 4 */}
-          <div className="mt-5 animate-step-in" style={stepStyle(4)}>
-            <p className="font-medium text-neutral-100">Step 4</p>
+          {/* STEP 3 */}
+          <div className="mt-5 animate-step-in">
+            <p className="font-medium text-neutral-100">Step 3</p>
            <p className="mb-2 text-sm text-neutral-400">
-              Save file
+              Defaults to Image's path
            </p>
            <button
-              className="rounded-lg bg-teal-400 hover:bg-teal-300 transition-colors p-3 w-full font-semibold"
-              onClick={replaceHandler}
-            >
-              Replace Original
-            </button>
-            <button
-              className="rounded-lg bg-teal-400 hover:bg-teal-300 transition-colors p-3 mt-1 w-full font-semibold"
+              className="rounded-lg bg-teal-400 hover:bg-teal-300 transition-colors p-3 mt-1 font-semibold"
              onClick={outputHandler}
            >
-              Save As
+              Set Output Folder
+            </button>
+          </div>
+
+          {/* STEP 4 */}
+          <div className="mt-5 animate-step-in">
+            <p className="mb-2 font-medium text-neutral-100">Step 4</p>
+            <button
+              className="rounded-lg bg-sky-400 hover:bg-sky-300 transition-colors p-3 font-semibold"
+              onClick={upscaylHandler}
+              disabled={progress.length > 0}
+            >
+              {progress.length > 0 ? "Upscayling⏳" : "Upscayl"}
            </button>
          </div>
        </div>
-
        <div className="p-2 text-center text-sm text-neutral-500">
          <p>
            Copyright © 2022 -{" "}
@ -321,8 +295,8 @@ const Home = () => {
        onDragLeave={(e) => handleDragLeave(e)}
        onPaste={(e) => handlePaste(e)}
      >
-        {progress.length > 0 && (
-          <div className="absolute flex h-full w-full flex-col items-center justify-center bg-black/50 backdrop-blur-lg z-10">
+        {progress.length > 0 && upscaledImagePath.length === 0 && (
+          <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">{progress}</p>
@ -341,7 +315,7 @@ const Home = () => {
          <img
            className="h-full w-full object-contain"
            src={
-              "local://" + `${upscaledImagePath ? upscaledImagePath : imagePath}`
+              "file://" + `${upscaledImagePath ? upscaledImagePath : imagePath}`
            }
            draggable="false"
            alt=""
@ -350,7 +324,7 @@ const Home = () => {
          <ReactCompareSlider
            itemOne={
              <ReactCompareSliderImage
-                src={"local://" + imagePath + "?" + Date.now()}
+                src={"file://" + imagePath}
                alt="Original"
                style={{
                  objectFit: "contain",
@ -359,7 +333,7 @@ const Home = () => {
            }
            itemTwo={
              <ReactCompareSliderImage
-                src={"local://" + upscaledImagePath + "?" + Date.now()}
+                src={"file://" + upscaledImagePath}
                alt="Upscayl"
                style={{
                  objectFit: "contain",