hajonsoft / hajonsoft-tiger

🐯 Home for Dove and Humming Bird collectively named Nest
2 stars 0 forks source link

Crop passport image in reservation #351

Open hajonsoft opened 2 years ago

hajonsoft commented 2 years ago

As a traveller, I want to crop parts of the passport image after I upload it. This will make it easy for me to enter the portrait photo of the traveller and select the MRZ area for further processing. I can also select any other part of the passport in the future for further processing or character recognition.

GIVEN I am a traveller making a reservation WHEN I upload a passport image THEN a selection around the portrait appears so I can adjust it nicely around the photo of the passenger. Every time I adjust the selection, I can see a preview to my crop area below the passport. WHEN I click done THEN the image appears in portrait part of the reservation. and a new selection for the MRZ is suggested for me on the passport starting from 100px, 600px. with full width of the passport image and height of 200px WHEN I adjust a box around MRZ THEN I can see the selected part cropped below the passport WHEN I click done THEN the MRZ selection is parsed with an OCR service to get the 6 fields (name, birthdate, issue country, nationality, expire date), every value is displayed in the respective field WHEN I select place of birth THEN the place of birth is parsed and displayed in the place of birth field

hajonsoft commented 2 years ago

https://codesandbox.io/s/react-image-crop-demo-with-react-hooks-y831o?file=/src/App.tsx