1
0
Fork 0
mirror of https://github.com/voltbonn/profile-picture-generator.git synced 2025-01-02 21:12:37 +00:00

display the orignial image in the preview, not the cropped one

This commit is contained in:
thomasrosen 2021-01-21 20:54:45 +01:00
parent d8ff7976e4
commit a8c72b4be1

View file

@ -10,6 +10,7 @@ const frameSize = 1080
function App() {
const [frameURL, setFrameURL] = useState(null)
const [originalPhoto, setOriginalPhoto] = useState(null)
const [photo, setPhoto] = useState(null)
const [combinedImage, setCombinedImage] = useState(null)
@ -42,6 +43,7 @@ function App() {
setPhoto(pngUrl)
}
img.src = reader_event.target.result
setOriginalPhoto(reader_event.target.result)
}
reader.readAsDataURL(files_event.target.files[0])
}, [setPhoto])
@ -64,8 +66,8 @@ return (
<p>It should best be a square image or your face in the middle. The photo is not saved and never leaves your computer.</p>
<label className="labelButton" tabIndex="0" style={{outline:'none'}}>
{!!photo ? <img src={photo} alt="Preview" /> : null}
<span>Load Photo</span>
{!!photo ? <img src={originalPhoto} alt="Preview" /> : null}
<input onChange={handleImage} type="file" accept="image/*" style={{display: 'none'}} />
</label>