1
0
mirror of https://github.com/upscayl/upscayl.git synced 2024-11-27 17:00:52 +01:00

Added jotai and loggin

This commit is contained in:
Nayam Amarshe 2023-04-08 12:23:32 +05:30
parent 373870621e
commit 479acfe30e
8 changed files with 146 additions and 101 deletions

View File

@ -97,10 +97,10 @@ ipcMain.handle(commands.SELECT_FILE, async () => {
});
if (canceled) {
console.log("File Operation Cancelled");
log.log("File Operation Cancelled");
return "cancelled";
} else {
console.log("Selected File Path: ", filePaths[0]);
log.log("Selected File Path: ", filePaths[0]);
// CREATE input AND upscaled FOLDER
return filePaths[0];
}
@ -112,17 +112,17 @@ ipcMain.handle(commands.SELECT_FOLDER, async (event, message) => {
properties: ["openDirectory"],
});
if (canceled) {
console.log("operation cancelled");
log.log("operation cancelled");
return "cancelled";
} else {
console.log(filePaths[0]);
log.log(filePaths[0]);
return filePaths[0];
}
});
//------------------------Open Folder-----------------------------//
ipcMain.on(commands.OPEN_FOLDER, async (event, payload) => {
console.log(payload);
log.log(payload);
shell.openPath(payload);
});
@ -167,7 +167,7 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => {
// CONVERT DATA TO STRING
data = data.toString();
// PRINT TO CONSOLE
console.log(data);
log.log(data);
// SEND UPSCAYL PROGRESS TO RENDERER
mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_PROGRESS, data);
// IF PROGRESS HAS ERROR, UPSCAYL FAILED
@ -190,7 +190,7 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => {
// CONVERT DATA TO STRING
data = data.toString();
// PRINT TO CONSOLE
console.log(data);
log.log(data);
// SEND UPSCAYL PROGRESS TO RENDERER
mainWindow.webContents.send(commands.DOUBLE_UPSCAYL_PROGRESS, data);
// IF PROGRESS HAS ERROR, UPSCAYL FAILED
@ -208,7 +208,7 @@ ipcMain.on(commands.DOUBLE_UPSCAYL, async (event, payload) => {
};
const onClose2 = (code) => {
if (!failed2) {
console.log("Done upscaling");
log.log("Done upscaling");
mainWindow.webContents.send(
commands.DOUBLE_UPSCAYL_DONE,
isAlpha ? outFile + ".png" : outFile
@ -254,10 +254,10 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
const fullfileName = payload.imagePath.replace(/^.*[\\\/]/, "") as string;
const fileName = parse(fullfileName).name;
console.log("🚀 => fileName", fileName);
log.log("🚀 => fileName", fileName);
const fileExt = parse(fullfileName).ext;
console.log("🚀 => fileExt", fileExt);
log.log("🚀 => fileExt", fileExt);
const outFile =
outputDir +
@ -293,17 +293,14 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
let failed = false;
const onData = (data: string) => {
console.log(
"🚀 => upscayl.stderr.on => stderr.toString()",
data.toString()
);
log.log("image upscayl: ", data.toString());
data = data.toString();
mainWindow.webContents.send(commands.UPSCAYL_PROGRESS, data.toString());
if (data.includes("invalid gpu") || data.includes("failed")) {
failed = true;
}
if (data.includes("has alpha channel")) {
console.log("INCLUDES ALPHA CHANNEL, CHANGING OUTFILE NAME!");
log.log("INCLUDES ALPHA CHANNEL, CHANGING OUTFILE NAME!");
isAlpha = true;
}
};
@ -314,7 +311,7 @@ ipcMain.on(commands.UPSCAYL, async (event, payload) => {
};
const onClose = () => {
if (failed !== true) {
console.log("Done upscaling");
log.log("Done upscaling");
mainWindow.webContents.send(
commands.UPSCAYL_DONE,
isAlpha ? outFile + ".png" : outFile
@ -359,10 +356,7 @@ ipcMain.on(commands.FOLDER_UPSCAYL, async (event, payload) => {
let failed = false;
const onData = (data: any) => {
console.log(
"🚀 => upscayl.stderr.on => stderr.toString()",
data.toString()
);
log.log("🚀 => upscayl.stderr.on => stderr.toString()", data.toString());
data = data.toString();
mainWindow.webContents.send(
commands.FOLDER_UPSCAYL_PROGRESS,
@ -382,7 +376,7 @@ ipcMain.on(commands.FOLDER_UPSCAYL, async (event, payload) => {
};
const onClose = () => {
if (failed !== true) {
console.log("Done upscaling");
log.log("Done upscaling");
mainWindow.webContents.send(commands.FOLDER_UPSCAYL_DONE, outputDir);
}
};
@ -430,15 +424,15 @@ autoUpdater.on("update-downloaded", (event) => {
// const justFileName = parse(videoFileName).name;
// let inputDir = payload.videoPath.match(/(.*)[\/\\]/)[1] || "";
// console.log("🚀 => file: index.ts => line 337 => inputDir", inputDir);
// log.log("🚀 => file: index.ts => line 337 => inputDir", inputDir);
// // Set the output directory
// let outputDir = payload.outputPath + "_frames";
// console.log("🚀 => file: index.ts => line 340 => outputDir", outputDir);
// log.log("🚀 => file: index.ts => line 340 => outputDir", outputDir);
// let frameExtractionPath = join(inputDir, justFileName + "_f");
// let frameUpscalePath = join(inputDir, justFileName + "_u");
// console.log(
// log.log(
// "🚀 => file: index.ts => line 342 => frameExtractionPath",
// frameExtractionPath,
// frameUpscalePath
@ -467,7 +461,7 @@ autoUpdater.on("update-downloaded", (event) => {
// let failed = false;
// ffmpegProcess?.stderr.on("data", (data: string) => {
// console.log("🚀 => file: index.ts:420 => data", data.toString());
// log.log("🚀 => file: index.ts:420 => data", data.toString());
// data = data.toString();
// mainWindow.webContents.send(
// commands.FFMPEG_VIDEO_PROGRESS,
@ -487,7 +481,7 @@ autoUpdater.on("update-downloaded", (event) => {
// // Send done comamnd when
// ffmpegProcess?.on("close", (code: number) => {
// if (failed !== true) {
// console.log("Frame extraction successful!");
// log.log("Frame extraction successful!");
// mainWindow.webContents.send(commands.FFMPEG_VIDEO_DONE, outputDir);
// // UPSCALE
@ -513,7 +507,7 @@ autoUpdater.on("update-downloaded", (event) => {
// );
// upscayl?.stderr.on("data", (data) => {
// console.log(
// log.log(
// "🚀 => upscayl.stderr.on => stderr.toString()",
// data.toString()
// );

View File

@ -82,11 +82,11 @@ electron_1.ipcMain.handle(commands_1.default.SELECT_FILE, () => __awaiter(void 0
properties: ["openFile", "multiSelections"],
});
if (canceled) {
console.log("File Operation Cancelled");
electron_log_1.default.log("File Operation Cancelled");
return "cancelled";
}
else {
console.log("Selected File Path: ", filePaths[0]);
electron_log_1.default.log("Selected File Path: ", filePaths[0]);
// CREATE input AND upscaled FOLDER
return filePaths[0];
}
@ -97,17 +97,17 @@ electron_1.ipcMain.handle(commands_1.default.SELECT_FOLDER, (event, message) =>
properties: ["openDirectory"],
});
if (canceled) {
console.log("operation cancelled");
electron_log_1.default.log("operation cancelled");
return "cancelled";
}
else {
console.log(filePaths[0]);
electron_log_1.default.log(filePaths[0]);
return filePaths[0];
}
}));
//------------------------Open Folder-----------------------------//
electron_1.ipcMain.on(commands_1.default.OPEN_FOLDER, (event, payload) => __awaiter(void 0, void 0, void 0, function* () {
console.log(payload);
electron_log_1.default.log(payload);
electron_1.shell.openPath(payload);
}));
//------------------------Double Upscayl-----------------------------//
@ -134,7 +134,7 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a
// CONVERT DATA TO STRING
data = data.toString();
// PRINT TO CONSOLE
console.log(data);
electron_log_1.default.log(data);
// SEND UPSCAYL PROGRESS TO RENDERER
mainWindow.webContents.send(commands_1.default.DOUBLE_UPSCAYL_PROGRESS, data);
// IF PROGRESS HAS ERROR, UPSCAYL FAILED
@ -157,7 +157,7 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a
// CONVERT DATA TO STRING
data = data.toString();
// PRINT TO CONSOLE
console.log(data);
electron_log_1.default.log(data);
// SEND UPSCAYL PROGRESS TO RENDERER
mainWindow.webContents.send(commands_1.default.DOUBLE_UPSCAYL_PROGRESS, data);
// IF PROGRESS HAS ERROR, UPSCAYL FAILED
@ -175,7 +175,7 @@ electron_1.ipcMain.on(commands_1.default.DOUBLE_UPSCAYL, (event, payload) => __a
};
const onClose2 = (code) => {
if (!failed2) {
console.log("Done upscaling");
electron_log_1.default.log("Done upscaling");
mainWindow.webContents.send(commands_1.default.DOUBLE_UPSCAYL_DONE, isAlpha ? outFile + ".png" : outFile);
}
};
@ -203,9 +203,9 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter(
// COPY IMAGE TO TMP FOLDER
const fullfileName = payload.imagePath.replace(/^.*[\\\/]/, "");
const fileName = (0, path_1.parse)(fullfileName).name;
console.log("🚀 => fileName", fileName);
electron_log_1.default.log("🚀 => fileName", fileName);
const fileExt = (0, path_1.parse)(fullfileName).ext;
console.log("🚀 => fileExt", fileExt);
electron_log_1.default.log("🚀 => fileExt", fileExt);
const outFile = outputDir +
"/" +
fileName +
@ -225,14 +225,14 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter(
let isAlpha = false;
let failed = false;
const onData = (data) => {
console.log("🚀 => upscayl.stderr.on => stderr.toString()", data.toString());
electron_log_1.default.log("image upscayl: ", data.toString());
data = data.toString();
mainWindow.webContents.send(commands_1.default.UPSCAYL_PROGRESS, data.toString());
if (data.includes("invalid gpu") || data.includes("failed")) {
failed = true;
}
if (data.includes("has alpha channel")) {
console.log("INCLUDES ALPHA CHANNEL, CHANGING OUTFILE NAME!");
electron_log_1.default.log("INCLUDES ALPHA CHANNEL, CHANGING OUTFILE NAME!");
isAlpha = true;
}
};
@ -243,7 +243,7 @@ electron_1.ipcMain.on(commands_1.default.UPSCAYL, (event, payload) => __awaiter(
};
const onClose = () => {
if (failed !== true) {
console.log("Done upscaling");
electron_log_1.default.log("Done upscaling");
mainWindow.webContents.send(commands_1.default.UPSCAYL_DONE, isAlpha ? outFile + ".png" : outFile);
}
};
@ -269,7 +269,7 @@ electron_1.ipcMain.on(commands_1.default.FOLDER_UPSCAYL, (event, payload) => __a
const upscayl = (0, upscayl_1.spawnUpscayl)("realesrgan", (0, getArguments_1.getBatchArguments)(inputDir, outputDir, binaries_1.modelsPath, model, gpuId, saveImageAs));
let failed = false;
const onData = (data) => {
console.log("🚀 => upscayl.stderr.on => stderr.toString()", data.toString());
electron_log_1.default.log("🚀 => upscayl.stderr.on => stderr.toString()", data.toString());
data = data.toString();
mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_PROGRESS, data.toString());
if (data.includes("invalid gpu") || data.includes("failed")) {
@ -283,7 +283,7 @@ electron_1.ipcMain.on(commands_1.default.FOLDER_UPSCAYL, (event, payload) => __a
};
const onClose = () => {
if (failed !== true) {
console.log("Done upscaling");
electron_log_1.default.log("Done upscaling");
mainWindow.webContents.send(commands_1.default.FOLDER_UPSCAYL_DONE, outputDir);
}
};
@ -324,13 +324,13 @@ electron_updater_1.autoUpdater.on("update-downloaded", (event) => {
// let videoFileName = payload.videoPath.replace(/^.*[\\\/]/, "");
// const justFileName = parse(videoFileName).name;
// let inputDir = payload.videoPath.match(/(.*)[\/\\]/)[1] || "";
// console.log("🚀 => file: index.ts => line 337 => inputDir", inputDir);
// log.log("🚀 => file: index.ts => line 337 => inputDir", inputDir);
// // Set the output directory
// let outputDir = payload.outputPath + "_frames";
// console.log("🚀 => file: index.ts => line 340 => outputDir", outputDir);
// log.log("🚀 => file: index.ts => line 340 => outputDir", outputDir);
// let frameExtractionPath = join(inputDir, justFileName + "_f");
// let frameUpscalePath = join(inputDir, justFileName + "_u");
// console.log(
// log.log(
// "🚀 => file: index.ts => line 342 => frameExtractionPath",
// frameExtractionPath,
// frameUpscalePath
@ -356,7 +356,7 @@ electron_updater_1.autoUpdater.on("update-downloaded", (event) => {
// );
// let failed = false;
// ffmpegProcess?.stderr.on("data", (data: string) => {
// console.log("🚀 => file: index.ts:420 => data", data.toString());
// log.log("🚀 => file: index.ts:420 => data", data.toString());
// data = data.toString();
// mainWindow.webContents.send(
// commands.FFMPEG_VIDEO_PROGRESS,
@ -374,7 +374,7 @@ electron_updater_1.autoUpdater.on("update-downloaded", (event) => {
// // Send done comamnd when
// ffmpegProcess?.on("close", (code: number) => {
// if (failed !== true) {
// console.log("Frame extraction successful!");
// log.log("Frame extraction successful!");
// mainWindow.webContents.send(commands.FFMPEG_VIDEO_DONE, outputDir);
// // UPSCALE
// let upscayl: ChildProcessWithoutNullStreams | null = null;
@ -398,7 +398,7 @@ electron_updater_1.autoUpdater.on("update-downloaded", (event) => {
// }
// );
// upscayl?.stderr.on("data", (data) => {
// console.log(
// log.log(
// "🚀 => upscayl.stderr.on => stderr.toString()",
// data.toString()
// );

23
package-lock.json generated
View File

@ -18,6 +18,7 @@
"electron-root-path": "^1.1.0",
"electron-updater": "^5.3.0",
"image-size": "^1.0.2",
"jotai": "^2.0.3",
"react-compare-slider": "^2.2.0",
"react-dropzone": "^14.2.3",
"react-image-zoom": "^1.3.1",
@ -4936,6 +4937,22 @@
"node": ">=10"
}
},
"node_modules/jotai": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/jotai/-/jotai-2.0.3.tgz",
"integrity": "sha512-MMjhSPAL3RoeZD9WbObufRT2quThEAEknHHridf2ma8Ml7ZVQmUiHk0ssdbR3F0h3kcwhYqSGJ59OjhPge7RRg==",
"engines": {
"node": ">=12.20.0"
},
"peerDependencies": {
"react": ">=17.0.0"
},
"peerDependenciesMeta": {
"react": {
"optional": true
}
}
},
"node_modules/js-image-zoom": {
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/js-image-zoom/-/js-image-zoom-0.7.0.tgz",
@ -11365,6 +11382,12 @@
"minimatch": "^3.0.4"
}
},
"jotai": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/jotai/-/jotai-2.0.3.tgz",
"integrity": "sha512-MMjhSPAL3RoeZD9WbObufRT2quThEAEknHHridf2ma8Ml7ZVQmUiHk0ssdbR3F0h3kcwhYqSGJ59OjhPge7RRg==",
"requires": {}
},
"js-image-zoom": {
"version": "0.7.0",
"resolved": "https://registry.npmjs.org/js-image-zoom/-/js-image-zoom-0.7.0.tgz",

View File

@ -164,6 +164,7 @@
"electron-root-path": "^1.1.0",
"electron-updater": "^5.3.0",
"image-size": "^1.0.2",
"jotai": "^2.0.3",
"react-compare-slider": "^2.2.0",
"react-dropzone": "^14.2.3",
"react-image-zoom": "^1.3.1",

View File

@ -0,0 +1,3 @@
import { atom } from "jotai";
export const logAtom = atom<string[]>([]);

View File

@ -30,6 +30,7 @@ interface IProps {
width: number | null;
height: number | null;
};
logData: string[];
}
function SettingsTab({
@ -55,6 +56,7 @@ function SettingsTab({
saveImageAs,
setSaveImageAs,
dimensions,
logData,
}: IProps) {
const [currentModel, setCurrentModel] = useState<{
label: string;
@ -64,6 +66,8 @@ function SettingsTab({
value: null,
});
const [isCopied, setIsCopied] = useState(false);
useEffect(() => {
themeChange(false);
@ -112,6 +116,14 @@ function SettingsTab({
localStorage.setItem("gpuId", e.target.value);
};
const copyOnClickHandler = () => {
navigator.clipboard.writeText(logData.join("\n"));
setIsCopied(true);
setTimeout(() => {
setIsCopied(false);
}, 2000);
};
const customStyles = {
option: (provided, state) => ({
...provided,
@ -242,15 +254,16 @@ function SettingsTab({
<div className="relative flex flex-col gap-2">
<button
className="btn-primary btn-xs btn absolute top-10 right-5 z-10"
onClick={() => {
navigator.clipboard.writeText("Hello World!");
}}>
Copy 📋
className="btn-primary btn-xs btn absolute top-10 right-2 z-10"
onClick={copyOnClickHandler}>
{isCopied ? <span>Copied 📋</span> : <span>Copy 📋</span>}
</button>
<p className="text-sm font-medium">Logs</p>
<code className="rounded-btn min-h-16 relative h-full max-h-64 overflow-y-auto bg-base-200 p-4">
{log.info("Hello World")}
<code className="max-h-84 rounded-btn min-h-16 relative flex h-80 flex-col gap-3 overflow-y-auto break-all bg-base-200 p-4">
{logData.map((logLine) => {
console.log(logData);
return <p className="">{logLine}</p>;
})}
</code>
</div>

View File

@ -4,6 +4,7 @@ import { AppProps } from "next/app";
import { useEffect } from "react";
import { themeChange } from "theme-change";
import log from "electron-log/renderer";
import { Provider } from "jotai";
const MyApp = ({ Component, pageProps }: AppProps) => {
return (
@ -11,7 +12,9 @@ const MyApp = ({ Component, pageProps }: AppProps) => {
<Head>
<title>Upscayl</title>
</Head>
<Component {...pageProps} data-theme="dark" />
<Provider>
<Component {...pageProps} data-theme="dark" />
</Provider>
</>
);
};

View File

@ -1,4 +1,4 @@
import { useState, useEffect, useRef, useCallback } from "react";
import { useState, useEffect, useCallback } from "react";
import commands from "../../electron/commands";
import { ReactCompareSlider } from "react-compare-slider";
import Header from "../components/Header";
@ -6,12 +6,11 @@ import Footer from "../components/Footer";
import ProgressBar from "../components/ProgressBar";
import RightPaneInfo from "../components/RightPaneInfo";
import ImageOptions from "../components/ImageOptions";
import LeftPaneVideoSteps from "../components/LeftPaneVideoSteps";
import LeftPaneImageSteps from "../components/LeftPaneImageSteps";
import Tabs from "../components/Tabs";
import SettingsTab from "../components/SettingsTab";
let logData = [];
import { useAtom } from "jotai";
import { logAtom } from "../atoms/logAtom";
const Home = () => {
// STATES
@ -40,17 +39,21 @@ const Home = () => {
height: null,
});
const [selectedTab, setSelectedTab] = useState(0);
const [logData, setLogData] = useState([]);
const [logData, setLogData] = useAtom(logAtom);
(function () {
let info = console.info;
// (function () {
// let info = console.info;
console.log = function () {
var args = Array.prototype.slice.call(arguments);
info.apply(this, args);
setLogData([...logData, { level: "info", arguments: args }]);
};
})();
// console.log = function () {
// var args = Array.prototype.slice.call(arguments);
// info.apply(this, args);
// };
// })();
const addToLog = (data: string) => {
console.log("🚀 => file: index.tsx:52 => data:", data);
setLogData((prevLogData) => [...prevLogData, data]);
};
// EFFECTS
useEffect(() => {
@ -58,7 +61,7 @@ const Home = () => {
setVersion(navigator?.userAgent?.match(/Upscayl\/([\d\.]+\d+)/)[1]);
const handleErrors = (data) => {
const handleErrors = (data: string) => {
if (data.includes("invalid gpu")) {
alert(
"Error. Please make sure you have a Vulkan compatible GPU (Most modern GPUs support Vulkan). Upscayl does not work with CPU or iGPU sadly."
@ -82,28 +85,25 @@ const Home = () => {
};
// UPSCAYL PROGRESS
window.electron.on(commands.UPSCAYL_PROGRESS, (_, data) => {
console.log(
"🚀 => file: index.jsx => line 61 => window.electron.on => data",
data
);
window.electron.on(commands.UPSCAYL_PROGRESS, (_, data: string) => {
if (data.length > 0 && data.length < 10) {
setProgress(data);
}
handleErrors(data);
addToLog(data);
});
// FOLDER UPSCAYL PROGRESS
window.electron.on(commands.FOLDER_UPSCAYL_PROGRESS, (_, data) => {
window.electron.on(commands.FOLDER_UPSCAYL_PROGRESS, (_, data: string) => {
if (data.length > 0 && data.length < 10) {
setProgress(data);
}
handleErrors(data);
addToLog(data);
});
// DOUBLE UPSCAYL PROGRESS
window.electron.on(commands.DOUBLE_UPSCAYL_PROGRESS, (_, data) => {
window.electron.on(commands.DOUBLE_UPSCAYL_PROGRESS, (_, data: string) => {
if (data.length > 0 && data.length < 10) {
if (data === "0.00%") {
setDoubleUpscaylCounter(doubleUpscaylCounter + 1);
@ -111,39 +111,45 @@ const Home = () => {
setProgress(data);
}
handleErrors(data);
addToLog(data);
});
// VIDEO UPSCAYL PROGRESS
window.electron.on(commands.UPSCAYL_VIDEO_PROGRESS, (_, data) => {
window.electron.on(commands.UPSCAYL_VIDEO_PROGRESS, (_, data: string) => {
if (data.length > 0 && data.length < 10) {
setProgress(data);
}
handleErrors(data);
addToLog(data);
});
// UPSCAYL DONE
window.electron.on(commands.UPSCAYL_DONE, (_, data) => {
window.electron.on(commands.UPSCAYL_DONE, (_, data: string) => {
setProgress("");
setUpscaledImagePath(data);
addToLog(data);
});
// FOLDER UPSCAYL DONE
window.electron.on(commands.FOLDER_UPSCAYL_DONE, (_, data) => {
window.electron.on(commands.FOLDER_UPSCAYL_DONE, (_, data: string) => {
setProgress("");
setUpscaledBatchFolderPath(data);
addToLog(data);
});
// DOUBLE UPSCAYL DONE
window.electron.on(commands.DOUBLE_UPSCAYL_DONE, (_, data) => {
window.electron.on(commands.DOUBLE_UPSCAYL_DONE, (_, data: string) => {
setProgress("");
setDoubleUpscaylCounter(0);
setUpscaledImagePath(data);
addToLog(data);
});
// VIDEO UPSCAYL DONE
window.electron.on(commands.UPSCAYL_VIDEO_DONE, (_, data) => {
window.electron.on(commands.UPSCAYL_VIDEO_DONE, (_, data: string) => {
setProgress("");
setUpscaledVideoPath(data);
addToLog(data);
});
}, []);
@ -205,24 +211,24 @@ const Home = () => {
};
// HANDLERS
const handleMouseMove = (e) => {
const handleMouseMove = useCallback((e: any) => {
const { left, top, width, height } = e.target.getBoundingClientRect();
const x = ((e.pageX - left) / width) * 100;
const y = ((e.pageY - top) / height) * 100;
setBackgroundPosition(`${x}% ${y}%`);
};
}, []);
const selectVideoHandler = async () => {
resetImagePaths();
// const selectVideoHandler = async () => {
// resetImagePaths();
var path = await window.electron.invoke(commands.SELECT_FILE);
// var path = await window.electron.invoke(commands.SELECT_FILE);
if (path !== "cancelled") {
setVideoPath(path);
var dirname = path.match(/(.*)[\/\\]/)[1] || "";
setOutputPath(dirname);
}
};
// if (path !== "cancelled") {
// setVideoPath(path);
// var dirname = path.match(/(.*)[\/\\]/)[1] || "";
// setOutputPath(dirname);
// }
// };
const selectImageHandler = async () => {
resetImagePaths();
@ -247,14 +253,15 @@ const Home = () => {
}
};
const imageLoadHandler = ({ target: img }) => {
const image = img;
console.log("imageLoadHandler", {
image,
});
};
// ? What's this for
// const imageLoadHandler = ({ target: img }) => {
// const image = img;
// console.log("imageLoadHandler", {
// image,
// });
// };
const handleModelChange = (e) => {
const handleModelChange = (e: any) => {
setModel(e.value);
localStorage.setItem(
"model",
@ -492,6 +499,7 @@ const Home = () => {
saveImageAs={saveImageAs}
setSaveImageAs={setSaveImageAs}
dimensions={dimensions}
logData={logData}
/>
)}
{/* )} */}