Upload and edit image using Croppic jQuery plugin and Laravel
This project is related to tutorial from Codingo Tuts.
In this tutorial I covered creating image upload/edit widget, which is ideal for profile photo manipulations. It works in similar way as Facebook, Twitter or Linkedin profile photo widgets.
Croppic works in following way:
- when you select image from browse window it will be uploaded to server, in original form
- server responds with url to newly uploaded image and Croppic renders it
- user can slide image, zoom-in, zoom-out and after he clicks crop button data is sent to server
- server receives url of original image, and cropping details like: x-position, y-position, cropped width, cropped height, angle.
- after server processes image using cropping details, it sends success response to client
- if any errors occur, alert dialog is displayed with error message
- after successful cropping, final image is displayed to user in Croppic box
- user can click X and start process all over again