Image cropping and uploading to Amazon S3 using Ruby on Rails

The image cropping and uploading is essential part of any web application now days. Recently, I was working on a web application built on ROR platform. Initially we were using attachment_fu gem for image uploading but later there were requirements of cropping the image. I looked for the option for cropping in the attachment_fu but couldn't found any option for image cropping in it. Finally after go through documentation for attachment_fu and googling for alternative, I found a gem called 'Paperclip'. Paperclip gem is used for image upload and cropping but no straight forward integration with attachment_fu. So, I come up with idea of integrating attachment_fu with image cropping feature and shall explain step to step implementation of image cropping using attachment_fu.

Image Crop:

There are many javascripts from hotscripts which can be used for image cropping and I have used one of the javasript "Javascript Image Cropper UI" .

Image Processing

The above javascript shall give us the dimensions for the cropped image and we need to process the image using gem 'RMagick'

=start rdoc
This method takes crop image dimensions along with the original image path
and re-sized the image to the desired size
x: left most x coordinate of image for cropped image from JavaScript
y: left most y coordinate of image for cropped image from JavaScript
Width: width of image for cropped image from JavaScript
Height: height of image for cropped image from JavaScript
Path: Image path from JavaScript
=end
def self.update_attributes_crop(x,y,width,height,path)
# Get the path of the Directory where Image should be stored
path = File.dirname(__FILE__) + "/../../public/#{path}"

orig_img = Magick::ImageList.new(path)

scale = orig_img.crop(x.to_i,y.to_i,width.to_i,height.to_i, true)

crop_img = Magick::Image.new(width.to_i,height.to_i)

orig_img = crop_img.composite(scale,0,0,Magick::OverCompositeOp)

orig_img.write(path)

end

Upload image to Amazon S3
If you want to upload the image to Amazon S3 then you can use :
S3_copy(source, destination, bucket) line of code in your controller

=start rdoc
This method upload the file from local drive to Amazon S3 bucket
Source: source(path) of image from rails server
Destination: destination (relative path) of Image on S3 server
Bucket: your S3 bucket name for image upload
=end
def S3_copy(source, destination, bucket)
AWS::S3::Base.establish_connection!(
:access_key_id => S3_access_key_id,
:secret_access_key => S3_secret_access_key
)
AWS::S3::S3Object.copy(source,destination,bucket,:access => :public_read)
policy = AWS::S3::S3Object.acl(destination,bucket)

policy.grants << AWS::S3::ACL::Grant.grant(:public_read)

policy.grants << AWS::S3::ACL::Grant.grant(:public_read_acp)
begin
AWS::S3::S3Object.acl(destination, bucket, policy)
rescue
p 'Issue occurred while granting access for the file'
end
end

I hope using above approach you can do image cropping and uploading. Please let me know if you have any questions

---

Posted from my blog with : https://www.ipragmatech.com/image_croping_upload_ruby_on_rails/

---