The idea is a simple HTML image editor that supports cropping. The user would arrive on a page where an editor component would show a single image. The image should be sized such that it's entirely visible in the viewport. The user could then adjust the bounds of the image and click the submit/done button which would POST the edited image data to an endpoint and navigate to a new page containing the edited image. See "Editor [login to view URL]" attached.
An HTML canvas seems like a good fit here. All the processing should be done client side and the POST should contain the edited image contents. The canvas API seems to support this.
- Editor component should easily integrate into another webpage. E.g. it shouldn't interfere with a header or footer in an existing page.
- Should support modern Chrome, Firefox, IE, Edge & Safari on desktop and mobile. I don't care about ancient browsers.
- Vanilla browser JS to minimize dependencies. Definitely no Flash. No React or Angular. Probably no jQuery or [login to view URL] unless there's a really good reason.
- If any image assets are required, I will provide them, although I don't much will be required here.
- Even though the image should be scaled to fit in the viewport, the image sent in the POST should be the same scale as the original image.
- The tool must work well on mobile. It must be possible to adjust the crop dimensions easily (think iPhone gallery built in editor easy, see attached "iPhone [login to view URL]").
If this v1 works out well, I would be interested in growing editing functionality to include things like drawing arrows and other markup, or rotate and zoom. That would be a later job, however.
58 freelancers are bidding on average $465 for this job
simple html image edits Relevant Skills and Experience Respected Sir, We have expert in css and html and have good exp to create responsive and bootstrap design. Proposed Milestones $250 USD - Project