camanjs returns maximum callstack error on cropping source

[mejuliver]

So first, I'm using jquery. Upon input change, i then add source to canvas then after that upon crop button click, trigger the crop function. Please refer below codes

<input type="file" id="input-file">
<canvas id="canvas-raw"></canvas>

<script>
$(function(){
 $('input#fileinput').change(function(e){
        renderImage(e);
    });
   $('button#crop-btn').click(function(){
   // call crop function
   camanCropper();
   });

});
function renderImage(e) {
    var canvas = document.getElementById('canvas-raw');
    var ctx = canvas.getContext('2d');
    var img = new Image;
    img.src = URL.createObjectURL(e.target.files[0]);
    img.onload = function() {
        canvas.setAttribute('width',img.width);
        canvas.setAttribute('height',img.height);
        ctx.drawImage(img,
            canvas.width / 2 - img.width / 2,
            canvas.height / 2 - img.height / 2
        );
    }
}

function camanCropper(){
    Caman("#canvas-raw", function(){
      // width, height, x, y
      this.crop(144, 134, 0, 0); // uses dummy points for right now
      // Still have to call render!
      this.render();
    });

}
</script>

then it gives me this error

Uncaught RangeError: Maximum call stack size exceeded caman.full.min.js:115

any help, ideas please?