$(function(){
    var jcrop_api;

    var changeCrop = function(c){
        //alert(c.w);
        var url = $('#convert_url_link').attr('href');
        var cropparams = [Math.floor(c.x),Math.floor(c.y),Math.floor(c.w),Math.floor(c.h)].join();
        newurl = url.replace(/crop=[0-9]+,[0-9]+,[0-9]+,[0-9]+/, 'crop='+cropparams);
        $('#convert_url_link').attr('href', newurl );
        $('#process-image-thumb').attr('src', newurl );
        $('#convert_url_link').text(newurl );
      };

      $('#convert_url_placeholder').change( function(){
        $('#converted_url').attr('src', $('#convert_url_placeholder').text());
      });

      //target is the img tag
      $('#target').attr('src',url);
      $('#target').Jcrop({
        bgColor: 'black',
        onSelect: changeCrop,
        aspectRatio:1,
        keySupport:false
      },function(){
        jcrop_api = this;
        jcrop_api.setSelect([ 100,135,320,190 ]);
      });
    });