CODEWITHSUNDEEP
phpjqueryuploadcare
JonYork
JonYork

Reputation: 1243

Uploadcare not cropping properly

Trying to trigger the uploadcare php function with a jquery ajax call, and I get everything to work fine, except for the user selected crop region. It crops to the right ration, but defaults to top left all the time.

What am I missing to pass on the user selected crop area?

Here is the jQuery code that runs the script

$(function() { 
  $('#avatar-uc').each(function() { 
     $("#avatar-uc").find('.uploadcare-widget-button-open').html('<i class="fa fa-camera"></i> Edit Photo'); 
     $("#avatar-uc").find('.uploadcare-widget-button-remove').html('<i class="fa fa-camera"></i> Edit Photo'); 
       WidgetResetAvatar( 
        uploadcare.SingleWidget($(this).children('input'))
      ); 
});
});
function WidgetResetAvatar(widget) { 
  widget.onChange(function(file) {
    if (file) { 
      file.done(function(fileInfo) { 
        $.ajax({
            url: '/asset/create/avatar',
            method: 'POST',
            disablePreview: true,
            headers: { 'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')},
            data: {uuid: fileInfo.uuid},
        })
        .done(function( data ) {
          $('#avatarPhoto').css('background-image', 'url("'+data.avatar_url+'")')
        });
      }); 
    }  
    widget.value(null)
  }); 
}

And the PHP Function

public function CreateAvatar(Request $request)
{
if (!Auth::check()) {
    return Response::json(array('message' => 'not logged in'));
}

$user = Auth::user();

if ($request->ajax()) {
    if (!empty($request->uuid)) {
        $api = app()->uploadcare;
        $original_file = $api->getFile($request->uuid);
        $cropped_file = $original_file->crop(150,150)->copy();
        $cropped_file->store();
        $cropped_file_url = $cropped_file->data['original_file_url'];
        $upload_url = "https://ucarecdn.com";
        $remove_upload_care_url = "";
        $cropped_file_path = str_replace($upload_url, 
$remove_upload_care_url, $cropped_file_url);
    }
    else {
        $cropped_file_path = "";
    }

    $user->avatar = $cropped_file_path;
    $user->save();

    return Response::json(['avatar_url' => $cropped_file_url]);
}
}

Upvotes: 0

Views: 173

Answers (1)

Dmitry Mukhin
Dmitry Mukhin

Reputation: 6967

For some reason, crop() function does not accept coordinates for the cropping area, just to center it or not (see the code).

Easiest way is to build the URL by hand. Bonus points for sending PR to the library for accepting coordinates.

Upvotes: 0

Related Questions