React client app #5

Merged
CrispyBaguette merged 18 commits from react-client-app into master 2021-12-12 17:42:16 +00:00
2 changed files with 23 additions and 5 deletions
Showing only changes of commit d30800bb6f - Show all commits

View File

@ -1,7 +1,7 @@
import React from "react"; import React from "react";
import ImageInput from "./ImageInput"; import ImageInput from "./ImageInput";
import ImageOutput from "./ImageOutput"; import ImageOutput from "./ImageOutput";
import Ditherer from "./Ditherer"; import Ditherer from "./lib/Ditherer";
import ImagePreview from "./ImagePreview"; import ImagePreview from "./ImagePreview";
import Header from "./Header"; import Header from "./Header";
@ -19,9 +19,15 @@ function App() {
const handleImageSubmit = async (data: Uint8ClampedArray) => { const handleImageSubmit = async (data: Uint8ClampedArray) => {
setBaseImage(data); setBaseImage(data);
setAppState(AppState.IMAGE_LOADED); setAppState(AppState.IMAGE_LOADED);
try {
const ditheredImage = await new Ditherer().dither(data); const ditheredImage = await new Ditherer().dither(data);
setDitheredImage(ditheredImage); setDitheredImage(ditheredImage);
setAppState(AppState.IMAGE_PROCESSED); setAppState(AppState.IMAGE_PROCESSED);
} catch (e) {
console.error(e);
window.alert("Something went wrong. Please try again.");
}
}; };
return ( return (

View File

@ -4,7 +4,7 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
function Header() { function Header() {
return ( return (
<header className="bg-nord-1 text-nord-5 py-3 px-2"> <header className="flex items-center bg-nord-1 text-nord-5 py-3 px-2">
<a href="https://github.com/CrispyBaguette/wasm-palette-converter"> <a href="https://github.com/CrispyBaguette/wasm-palette-converter">
<FontAwesomeIcon <FontAwesomeIcon
icon={faGithub} icon={faGithub}
@ -17,6 +17,18 @@ function Header() {
className="fa-2x hover:text-nord-7 mx-2" className="fa-2x hover:text-nord-7 mx-2"
/> />
</a> </a>
<span className="text-sm">
Powered by{" "}
<a
href="https://ipfs.io"
target="_blank"
rel="noreferrer"
className="bg-nord-5 text-nord-1 hover:bg-nord-7 px-1 "
>
IPFS
</a>
. Visit using your own node !
</span>
</header> </header>
); );
} }