mirror of
https://github.com/upscayl/upscayl.git
synced 2024-11-27 17:00:52 +01:00
Fixed UI
This commit is contained in:
parent
cee6639332
commit
e88100e802
@ -125,51 +125,51 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
|
||||
// UPSCALE
|
||||
console.log("PRODUCTION? :", isDev);
|
||||
console.log("EXEC: ", execPath);
|
||||
console.log("MODEL: ", modelsPath + "/" + model)
|
||||
console.log("MODEL: ", modelsPath + "/" + model);
|
||||
if (fs.existsSync(outFile)) {
|
||||
mainWindow.webContents.send(commands.UPSCAYL_DONE, outFile);
|
||||
} else {
|
||||
let upscayl = model.includes("realesrgan") ?
|
||||
spawn(
|
||||
execPath + '-realesrgan',
|
||||
[
|
||||
"-i",
|
||||
inputDir + "/" + fullfileName,
|
||||
"-o",
|
||||
outFile,
|
||||
"-s",
|
||||
scale === 2 ? 4 : scale,
|
||||
"-m",
|
||||
modelsPath,
|
||||
"-n",
|
||||
model,
|
||||
],
|
||||
{
|
||||
cwd: null,
|
||||
detached: false,
|
||||
}
|
||||
)
|
||||
:
|
||||
spawn(
|
||||
execPath + '-realsr',
|
||||
[
|
||||
"-i",
|
||||
inputDir + "/" + fullfileName,
|
||||
"-o",
|
||||
outFile,
|
||||
"-s",
|
||||
scale === 2 ? 4 : scale,
|
||||
"-m",
|
||||
modelsPath+ "/" + model,
|
||||
],
|
||||
{
|
||||
cwd: null,
|
||||
detached: false,
|
||||
}
|
||||
)
|
||||
;
|
||||
let upscayl = model.includes("realesrgan")
|
||||
? spawn(
|
||||
execPath + "-realesrgan",
|
||||
[
|
||||
"-i",
|
||||
inputDir + "/" + fullfileName,
|
||||
"-o",
|
||||
outFile,
|
||||
"-s",
|
||||
scale === 2 ? 4 : scale,
|
||||
"-m",
|
||||
modelsPath,
|
||||
"-n",
|
||||
model,
|
||||
],
|
||||
{
|
||||
cwd: null,
|
||||
detached: false,
|
||||
}
|
||||
)
|
||||
: spawn(
|
||||
execPath + "-realsr",
|
||||
[
|
||||
"-i",
|
||||
inputDir + "/" + fullfileName,
|
||||
"-o",
|
||||
outFile,
|
||||
"-s",
|
||||
4,
|
||||
"-x",
|
||||
"-m",
|
||||
modelsPath + "/" + model,
|
||||
],
|
||||
{
|
||||
cwd: null,
|
||||
detached: false,
|
||||
}
|
||||
);
|
||||
|
||||
let failed = false;
|
||||
|
||||
upscayl.stderr.on("data", (stderr) => {
|
||||
console.log(stderr.toString());
|
||||
stderr = stderr.toString();
|
||||
|
@ -2,9 +2,9 @@ import React from "react";
|
||||
|
||||
function LeftPaneSteps(props) {
|
||||
return (
|
||||
<div className="h-screen overflow-auto p-5">
|
||||
<div className="animate-step-in flex h-screen flex-col gap-10 overflow-auto p-5">
|
||||
{/* STEP 1 */}
|
||||
<div className="mt-0">
|
||||
<div className="">
|
||||
<p className="mb-2 font-medium text-neutral-100">Step 1</p>
|
||||
<button
|
||||
className="rounded-lg bg-rose-400 p-3 transition-colors hover:bg-rose-300"
|
||||
@ -13,8 +13,9 @@ function LeftPaneSteps(props) {
|
||||
Select Image
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* STEP 2 */}
|
||||
<div className="animate-step-in mt-5">
|
||||
<div className="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</p>
|
||||
<select
|
||||
@ -25,8 +26,8 @@ function LeftPaneSteps(props) {
|
||||
>
|
||||
<option value="realesrgan-x4plus">General Photo</option>
|
||||
<option value="realesrgan-x4plus-anime">Digital Art</option>
|
||||
<option value="models-DF2K">DF2K</option>
|
||||
<option value="models-DF2K_JPEG">DF2K_JPEG</option>
|
||||
<option value="models-DF2K">Sharpen Image</option>
|
||||
<option value="models-DF2K_JPEG">Sharpen JPEG</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@ -63,7 +64,7 @@ function LeftPaneSteps(props) {
|
||||
</div> */}
|
||||
|
||||
{/* STEP 3 */}
|
||||
<div className="animate-step-in mt-5">
|
||||
<div className="animate-step-in">
|
||||
<p className="font-medium text-neutral-100">Step 3</p>
|
||||
<p className="mb-2 text-sm text-neutral-400">
|
||||
Defaults to Image's path
|
||||
@ -77,7 +78,7 @@ function LeftPaneSteps(props) {
|
||||
</div>
|
||||
|
||||
{/* STEP 4 */}
|
||||
<div className="animate-step-in mt-5">
|
||||
<div className="animate-step-in">
|
||||
<p className="mb-2 font-medium text-neutral-100">Step 4</p>
|
||||
<button
|
||||
className="rounded-lg bg-sky-400 p-3 transition-colors hover:bg-sky-300"
|
||||
|
@ -1,10 +1,13 @@
|
||||
import React from "react";
|
||||
|
||||
function RightPaneInfo() {
|
||||
function RightPaneInfo({ version }) {
|
||||
return (
|
||||
<p className="p-5 text-lg font-medium text-neutral-400">
|
||||
Select an Image to Upscale
|
||||
</p>
|
||||
<>
|
||||
<p className="p-5 text-lg font-medium text-neutral-400">
|
||||
Select an Image to Upscale
|
||||
</p>
|
||||
<p className="text-neutral-600">Upscayl v{version}</p>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
|
@ -11,9 +11,6 @@ import ResetButton from "../components/ResetButton";
|
||||
import LeftPaneSteps from "../components/LeftPaneSteps";
|
||||
import RightPaneInfo from "../components/RightPaneInfo";
|
||||
|
||||
import Animated from "../public/loading.svg";
|
||||
import Image from "next/image";
|
||||
|
||||
const Home = () => {
|
||||
const [imagePath, SetImagePath] = useState("");
|
||||
const [upscaledImagePath, setUpscaledImagePath] = useState("");
|
||||
@ -94,7 +91,9 @@ const Home = () => {
|
||||
resetImagePaths();
|
||||
|
||||
const type = e.dataTransfer.items[0].type;
|
||||
console.log("🚀 => handleDrop => type", type);
|
||||
const filePath = e.dataTransfer.files[0].path;
|
||||
console.log("🚀 => handleDrop => filePath", filePath);
|
||||
const extension = e.dataTransfer.files[0].name.split(".").at(-1);
|
||||
console.log("🚀 => handleDrop => extension", extension);
|
||||
|
||||
@ -106,8 +105,8 @@ const Home = () => {
|
||||
} else {
|
||||
SetImagePath(filePath);
|
||||
var dirname = filePath.match(/(.*)[\/\\]/)[1] || "";
|
||||
console.log("🚀 => handleDrop => dirname", dirname);
|
||||
SetOutputPath(dirname);
|
||||
window.electron.invoke(commands.SET_FILE, { original: filePath });
|
||||
}
|
||||
};
|
||||
|
||||
@ -141,6 +140,7 @@ const Home = () => {
|
||||
};
|
||||
|
||||
const upscaylHandler = async () => {
|
||||
setUpscaledImagePath("");
|
||||
if (imagePath !== "") {
|
||||
setProgress("Hold on...");
|
||||
await window.electron.send(commands.UPSCAYL, {
|
||||
|
@ -18,7 +18,6 @@
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
@apply rounded-full bg-neutral-400;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@layer utilities {
|
||||
@ -28,11 +27,19 @@
|
||||
}
|
||||
|
||||
.animate-step-in {
|
||||
animation: animate-step-in 0.35s cubic-bezier(0.07, 0.43, 0.02, 1);
|
||||
animation: animate-step-in 0.6s cubic-bezier(0.07, 0.43, 0.02, 1);
|
||||
}
|
||||
|
||||
@keyframes animate-step-in {
|
||||
0% { opacity: 0; transform: translateY(-10px); }
|
||||
80% { opacity: 1; }
|
||||
100% { opacity: 1; transform: translateY(0px); }
|
||||
}
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
80% {
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
|
0
resources/linux/bin/upscayl-realesrgan
Normal file → Executable file
0
resources/linux/bin/upscayl-realesrgan
Normal file → Executable file
0
resources/linux/bin/upscayl-realsr
Normal file → Executable file
0
resources/linux/bin/upscayl-realsr
Normal file → Executable file
Loading…
Reference in New Issue
Block a user