diff --git a/package.json b/package.json index 2c6717a..fcf9a29 100644 --- a/package.json +++ b/package.json @@ -105,10 +105,14 @@ ], "target": [ "AppImage", - "flatpak", - "zip" + "zip", + "deb", + "rpm", + "tar.gz" ], - "category": "Graphics;2DGraphics;RasterGraphics;ImageProcessing;" + "category": "Graphics;2DGraphics;RasterGraphics;ImageProcessing;", + "synopsis": "AI Image Upscaler", + "description": "Upscayl is a free and open source AI image upscaler for Linux. It uses the latest AI technology to upscale images to higher resolutions." }, "win": { "publish": [ @@ -119,6 +123,11 @@ ], "icon": "main/build/icon.png" }, + "nsis": { + "allowToChangeInstallationDirectory": true, + "allowElevation": true, + "perMachine": true + }, "files": [ "main", "renderer/out" diff --git a/renderer/components/ImageOptions.tsx b/renderer/components/ImageOptions.tsx index a0d9ae7..cd6f122 100644 --- a/renderer/components/ImageOptions.tsx +++ b/renderer/components/ImageOptions.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect } from "react"; const ImageOptions = ({ zoomAmount, @@ -13,27 +13,13 @@ const ImageOptions = ({ rightImageRef: React.RefObject; resetImagePaths: () => void; }) => { - const [zoomLevel, setZoomLevel] = React.useState("125"); - - const handleZoom = (direction: number) => { - if (direction === 0) { - setZoomAmount(""); - setZoomLevel("100"); - console.log("🚀 => file: ImageOptions.tsx:24 => zoomLevel", zoomLevel); - } else if (direction === 1 && zoomLevel < "200") { - setZoomLevel((parseInt(zoomLevel) + direction * 25).toString()); - setZoomAmount("zoom-" + zoomLevel); - console.log("🚀 => file: ImageOptions.tsx:24 => zoomLevel", zoomLevel); - } else if (direction === -1 && zoomLevel > "100") { - setZoomLevel((parseInt(zoomLevel) + direction * 25).toString()); - setZoomAmount("zoom-" + zoomLevel); - console.log("🚀 => file: ImageOptions.tsx:24 => zoomLevel", zoomLevel); + useEffect(() => { + if (!localStorage.getItem("zoomAmount")) { + localStorage.setItem("zoomAmount", zoomAmount); + } else { + setZoomAmount(localStorage.getItem("zoomAmount")); } - - if (zoomLevel > "200" || zoomLevel < "100") { - setZoomAmount("100"); - } - }; + }, []); return (
@@ -53,35 +39,50 @@ const ImageOptions = ({ className={`btn-primary btn ${ zoomAmount === "100%" ? "btn-secondary" : "btn-primary" }`} - onClick={() => setZoomAmount("100%")}> + onClick={() => { + setZoomAmount("100%"); + localStorage.setItem("zoomAmount", "100%"); + }}> 100%
diff --git a/renderer/components/LeftPaneImageSteps.tsx b/renderer/components/LeftPaneImageSteps.tsx index 29189eb..1fd3a5a 100644 --- a/renderer/components/LeftPaneImageSteps.tsx +++ b/renderer/components/LeftPaneImageSteps.tsx @@ -90,9 +90,9 @@ function LeftPaneImageSteps({ }; const modelOptions = [ + { label: "General Photo (Real-ESRGAN)", value: "realesrgan-x4plus" }, { label: "General Photo (Remacri)", value: "remacri" }, { label: "General Photo (Ultramix Balanced)", value: "ultramix_balanced" }, - { label: "General Photo (Real-ESRGAN)", value: "realesrgan-x4plus" }, { label: "General Photo (Ultrasharp)", value: "ultrasharp" }, { label: "Digital Art", value: "realesrgan-x4plus-anime" }, { label: "Sharpen Image", value: "models-DF2K" }, diff --git a/renderer/pages/index.tsx b/renderer/pages/index.tsx index 4905c9f..56c590f 100644 --- a/renderer/pages/index.tsx +++ b/renderer/pages/index.tsx @@ -1,9 +1,6 @@ import { useState, useEffect, useRef, useCallback } from "react"; import commands from "../../electron/commands"; -import { - ReactCompareSlider, - ReactCompareSliderImage, -} from "react-compare-slider"; +import { ReactCompareSlider } from "react-compare-slider"; import Header from "../components/Header"; import Footer from "../components/Footer"; import ProgressBar from "../components/ProgressBar"; @@ -13,7 +10,6 @@ import RightPaneInfo from "../components/RightPaneInfo"; import ImageOptions from "../components/ImageOptions"; import LeftPaneVideoSteps from "../components/LeftPaneVideoSteps"; import LeftPaneImageSteps from "../components/LeftPaneImageSteps"; -import { TransformComponent, TransformWrapper } from "react-zoom-pan-pinch"; const Home = () => { // STATES