Play scala browse the image then crop and submit into form

Question

In My Play Framework Scala project I would like to upload images on form submission,for this purpose I have used the below code

form.scala.html

    @form(routes.Users.register(),'enctype -> "multipart/form-data") {
 @inputFile(field = algorithmForm("profileimage"), '_label -> "User Icon")
       <input type="submit" value="Add user" >
}

Users.scala

 request.body.file("profileimage").map { picture =>
        import java.io.File
        val filename = picture.filename
        val contentType = picture.contentType

        picture.ref.moveTo(new File("D:\\User\\"+filename))   
        Ok("file created")
      }.getOrElse {
        Redirect(routes.Application.index).flashing(
          "error" -> "Missing file")
      }

What I actually need

need to show the selected image in view page then do a cropping operation in that image,on form submit need to upload that cropped image into the specified location.So I have used https://github.com/andyvr/picEdit this plugin I have done all those thinks using this plugin but unfortunately I couldn't submit the form it was not working.So please suggest any plugin with this mentioned functionality along with submit option enable.

Edit

I have cropped and submitted the image with other form values.It is copying a file in a particular mentioned directory,but the image is original one not a cropped image.actually I need a cropped image to save in that corresponding directory. and also it doesn't redirect to other pages.I used Ok("submitted") ,Redirect() methods but it doesn't do that.

Answer 1

Have you checked Picture Cut JQuery plugin Github URL. I hope it will be helpful. This plugin has the crop, drag-drop and other features. Please take a look at it.

Otherwise you can check following link which showcase few more such plugins