Add image cropping to my javascript code

I have an iOS app that uses a javascript code and embedded web server to allow photos to be transferred from a users phone using a localhost address to my app. The problem is it sends the photos full size. What I need is to crop the images square to 1200x1200 pixels. When you test the attached files you will see a "print your image" button. This button sends the photo from the users device to my app. What I need is to add another button that says "Select Your Photo". When that is pressed the image is retrieved with a cropping square javascript. This can be a simple script. If you go to [login to view URL] and scroll down to the demos section you will look for the "Resizer Example". That's exactly what I want but the result will be 1200x1200 pixels. When you press the "result" button it won't show the popup like the demo does. It will perform the function of the "print your image" button. So, to summarize 1. Add croppie source code to my files. 2. Add a "Select Your Photo" button to my [login to view URL] 3. When "Select Your Photo" is pressed it will let the user select a photo from their phone. 4. The user will then move their image inside the boundaries of the cropping box. 5. When they press "Print Your Image" it will then crop the file and upload it like my current code does.-