diff --git a/electron/commands.ts b/electron/commands.ts index 2375a33..58be005 100644 --- a/electron/commands.ts +++ b/electron/commands.ts @@ -12,7 +12,9 @@ const commands = { FOLDER_UPSCAYL_PROGRESS: "Send Folder Upscaling Progress from Main to Renderer", OPEN_FOLDER: "Open Folder", - SELECT_VIDEO: "Select a Video", + UPSCAYL_VIDEO: "Upscale the Video", + UPSCAYL_VIDEO_DONE: "Video Upscaling Done", + UPSCAYL_VIDEO_PROGRESS: "Send Video Upscale Progress from Main to Renderer", }; export default commands; diff --git a/renderer/Poppins-Black.ttf b/renderer/Poppins-Black.ttf new file mode 100644 index 0000000..71c0f99 Binary files /dev/null and b/renderer/Poppins-Black.ttf differ diff --git a/renderer/Poppins-Bold.ttf b/renderer/Poppins-Bold.ttf new file mode 100644 index 0000000..00559ee Binary files /dev/null and b/renderer/Poppins-Bold.ttf differ diff --git a/renderer/Poppins-ExtraBold.ttf b/renderer/Poppins-ExtraBold.ttf new file mode 100644 index 0000000..df70936 Binary files /dev/null and b/renderer/Poppins-ExtraBold.ttf differ diff --git a/renderer/Poppins-Medium.ttf b/renderer/Poppins-Medium.ttf new file mode 100644 index 0000000..6bcdcc2 Binary files /dev/null and b/renderer/Poppins-Medium.ttf differ diff --git a/renderer/Poppins-Regular.ttf b/renderer/Poppins-Regular.ttf new file mode 100644 index 0000000..9f0c71b Binary files /dev/null and b/renderer/Poppins-Regular.ttf differ diff --git a/renderer/Poppins-SemiBold.ttf b/renderer/Poppins-SemiBold.ttf new file mode 100644 index 0000000..74c726e Binary files /dev/null and b/renderer/Poppins-SemiBold.ttf differ diff --git a/renderer/pages/index.tsx b/renderer/pages/index.tsx index 1e07ba5..854bd49 100644 --- a/renderer/pages/index.tsx +++ b/renderer/pages/index.tsx @@ -39,6 +39,9 @@ const Home = () => { setBatchFolderPath(""); setUpscaledBatchFolderPath(""); + + setVideoPath(""); + setUpscaledVideoPath(""); }; useEffect(() => { @@ -92,6 +95,12 @@ const Home = () => { } handleErrors(data); }); + window.electron.on(commands.UPSCAYL_VIDEO_PROGRESS, (_, data) => { + if (data.length > 0 && data.length < 10) { + setProgress(data); + } + handleErrors(data); + }); window.electron.on(commands.UPSCAYL_DONE, (_, data) => { setProgress(""); @@ -104,6 +113,9 @@ const Home = () => { window.electron.on(commands.DOUBLE_UPSCAYL_DONE, (_, data) => { setUpscaledImagePath(data); }); + window.electron.on(commands.UPSCAYL_VIDEO_DONE, (_, data) => { + setUpscaledVideoPath(data); + }); }, []); useEffect(() => { @@ -128,13 +140,22 @@ const Home = () => { alert("Please select an image"); resetImagePaths(); } + } else if (videoPath.length > 0) { + const filePath = videoPath; + + const extension = videoPath.toLocaleLowerCase().split(".").pop(); + + if (!allowedVideoFileTypes.includes(extension.toLowerCase())) { + alert("Please select an MP4, WebM or MKV video"); + resetImagePaths(); + } } - }, [imagePath]); + }, [imagePath, videoPath]); const selectVideoHandler = async () => { resetImagePaths(); - var path = await window.electron.invoke(commands.SELECT_VIDEO); + var path = await window.electron.invoke(commands.SELECT_FILE); if (path !== "cancelled") { setVideoPath(path); @@ -190,6 +211,7 @@ const Home = () => { }; const allowedFileTypes = ["png", "jpg", "jpeg", "webp"]; + const allowedVideoFileTypes = ["webm", "mp4", "mkv"]; const handleDrop = (e) => { e.preventDefault(); @@ -203,12 +225,18 @@ const Home = () => { console.log("🚀 => handleDrop => extension", extension); if ( - !type.includes("image") || - !allowedFileTypes.includes(extension.toLowerCase()) + (!type.includes("image") && !type.includes("video")) || + (!allowedFileTypes.includes(extension.toLowerCase()) && + !allowedVideoFileTypes.includes(extension.toLowerCase())) ) { alert("Please drag and drop an image"); } else { - SetImagePath(filePath); + if (isVideo) { + setVideoPath(filePath); + } else { + SetImagePath(filePath); + } + var dirname = filePath.match(/(.*)[\/\\]/)[1] || ""; console.log("🚀 => handleDrop => dirname", dirname); setOutputPath(dirname); @@ -245,7 +273,11 @@ const Home = () => { }; const upscaylHandler = async () => { - setUpscaledImagePath(""); + if (isVideo) { + setUpscaledVideoPath(""); + } else { + setUpscaledImagePath(""); + } if (imagePath !== "" || batchFolderPath !== "") { setProgress("Hold on..."); if (model === "models-DF2K") { @@ -274,6 +306,13 @@ const Home = () => { model, }); } + } else if (videoPath !== "") { + await window.electron.send(commands.UPSCAYL_VIDEO, { + scaleFactor, + imagePath, + outputPath, + model, + }); } else { alert("Please select an image to upscale"); } diff --git a/renderer/styles/globals.css b/renderer/styles/globals.css index 903cbfb..f8e6cad 100644 --- a/renderer/styles/globals.css +++ b/renderer/styles/globals.css @@ -5,6 +5,13 @@ @layer base { * { @apply select-none; + font-family: "Poppins", sans-serif; + src: url("/Poppins-Regular.ttf") format("truetype"), + url("/Poppins-Medium.ttf") format("truetype"), + url("/Poppins-Semibold.ttf") format("truetype"), + url("/Poppins-Bold.ttf") format("truetype"), + url("/Poppins-ExtraBold.ttf") format("truetype"), + url("/Poppins-Black.ttf") format("truetype"); } ::-webkit-scrollbar { @apply w-3;