Trying to make use of Jcrop and serverside image resizing with scala Scrimage lib

Question

I'm trying to combine jcrop and scrimage but I'm having trouble in understanding the documentation of scrimage. The user uploads an image. When the upload is done the user is able choose a fixed area to crop with Jcrop:

upload.js

      $(function () {
            $('#fileupload').fileupload({
                dataType: 'json',                    
                progress: function (e, data) {
                    var progress = parseInt(data.loaded / data.total * 100, 10);
                    $("#progress").find(".progress-bar").css(
                        "width",
                        progress + "%"
                    );
                },
                done: function (e, data) {
                    $("#cropArea").empty();
                    var cropWidth = 210;
                    var cropHeight = 144;
                    if(data.result.status == 200) {
                        var myImage = $("<img></img>", {
                            src: data.result.link
                        }).appendTo('#cropArea');
                        var c = myImage.Jcrop({
                            allowResize: false,
                            allowSelect: false,
                            setSelect:[0,0,cropWidth,cropHeight],
                            onSelect: showCoords
                        });
                    }
                }
            });
        });

Example:

When the user is satisfied the coordinates will be posted to the server and there is where the magic should happen.

Controller:

def uploadFile = Action(multipartFormDataAsBytes) { request =>
    val result = request.body.files.map {
      case FilePart(key, filename, contentType, bytes) => {
        val coords = request.body.dataParts.get("coords")
        val bais = new ByteArrayInputStream(bytes)
        Image(bais).resize(magic stuff with coords)

        Ok("works")
      }
    }
    result(0)
  }

If i read the docs for scrimage and resize:

Resizes the canvas to the given dimensions. This does not scale the image but simply changes the dimensions of the canvas on which the image is sitting. Specifying a larger size will pad the image with a background color and specifying a smaller size will crop the image. This is the operation most people want when they think of crop.

But when trying to implement resize with an inputstream Image(is).resize() I'm not sure I how should do this. Resize takes a scaleFactor, position and color... I guess I should populate the position with the coords I get from jcrop??, and what do I do with the scaleFactor? Anybody got a good example of how to do this this?

Thank you for two great libs!

Answer 1

Subimage is what you want. That lets you specify coordinates rather than offsets.

So simply,

val image = // original
val resized = image.subimage(x,y,w,h) // you'll get these from jcrop somehow