1
0
mirror of https://github.com/upscayl/upscayl.git synced 2025-02-21 21:19:31 +01:00

Added reset button

This commit is contained in:
Nayam Amarshe 2022-08-27 16:05:05 +05:30
parent 56af5c780a
commit f8b8f399ca
2 changed files with 18 additions and 7 deletions

View File

@ -113,9 +113,6 @@
"target": [ "target": [
"nsis" "nsis"
], ],
"asarUnpack": [
"**/node_modules/sharp/**"
],
"icon": "main/build/icon.png" "icon": "main/build/icon.png"
}, },
"files": [ "files": [

View File

@ -46,6 +46,7 @@ const Home = () => {
}); });
window.electron.on(commands.UPSCAYL_DONE, (_, data) => { window.electron.on(commands.UPSCAYL_DONE, (_, data) => {
setProgress("");
setUpscaledImagePath(data); setUpscaledImagePath(data);
}); });
}, []); }, []);
@ -80,6 +81,8 @@ const Home = () => {
console.log("drag over"); console.log("drag over");
}; };
const allowedFileTypes = ["png", "jpg", "jpeg", "webp"];
const handleDrop = (e) => { const handleDrop = (e) => {
e.preventDefault(); e.preventDefault();
resetImagePaths(); resetImagePaths();
@ -87,10 +90,11 @@ const Home = () => {
const type = e.dataTransfer.items[0].type; const type = e.dataTransfer.items[0].type;
const filePath = e.dataTransfer.files[0].path; const filePath = e.dataTransfer.files[0].path;
const extension = e.dataTransfer.files[0].name.split(".").at(-1); const extension = e.dataTransfer.files[0].name.split(".").at(-1);
console.log("🚀 => handleDrop => extension", extension);
if ( if (
!type.includes("image") && !type.includes("image") ||
!["jpeg", "jpg", "png", "webp"].includes(extension.toLowerCase()) !allowedFileTypes.includes(extension.toLowerCase())
) { ) {
alert("Please drag and drop an image"); alert("Please drag and drop an image");
} else { } else {
@ -110,7 +114,7 @@ const Home = () => {
if ( if (
!type.includes("image") && !type.includes("image") &&
!["jpeg", "jpg", "png", "webp"].includes(extension.toLowerCase()) !allowedFileTypes.includes(extension.toLowerCase())
) { ) {
alert("Please drag and drop an image"); alert("Please drag and drop an image");
} else { } else {
@ -146,6 +150,14 @@ const Home = () => {
return ( return (
<div className="flex h-screen w-screen flex-row overflow-hidden bg-neutral-900"> <div className="flex h-screen w-screen flex-row overflow-hidden bg-neutral-900">
<div className="flex h-screen w-96 flex-col bg-neutral-800"> <div className="flex h-screen w-96 flex-col bg-neutral-800">
{imagePath.length > 0 && (
<button
className="absolute bottom-1 right-1 z-10 rounded-full bg-sky-400 p-2 opacity-50"
onClick={resetImagePaths}
>
Reset
</button>
)}
{/* HEADER */} {/* HEADER */}
<h1 className="pl-5 pt-5 text-3xl font-bold text-neutral-50"> <h1 className="pl-5 pt-5 text-3xl font-bold text-neutral-50">
Upscayl Upscayl
@ -231,8 +243,9 @@ const Home = () => {
<button <button
className="rounded-lg bg-sky-400 p-3" className="rounded-lg bg-sky-400 p-3"
onClick={upscaylHandler} onClick={upscaylHandler}
disabled={progress.length > 0}
> >
Upscayl {progress.length > 0 ? "Upscayling⏳" : "Upscayl"}
</button> </button>
</div> </div>
</div> </div>
@ -300,6 +313,7 @@ const Home = () => {
src={ src={
"file://" + `${upscaledImagePath ? upscaledImagePath : imagePath}` "file://" + `${upscaledImagePath ? upscaledImagePath : imagePath}`
} }
draggable="false"
alt="" alt=""
/> />
) : ( ) : (