CODEWITHSUNDEEP
ruby-on-railsrubyimageruby-on-rails-3paperclip
user502052
user502052

Reputation: 15257

How to process an image using Ruby on Rails, Paperclip gem, RJS Template and ImageMagick libraries?

I am using Ruby on Rails and the Paperclip gem and I would like to rotate an image before it is stylized and saved on my server.

For example, if in my model I have:

  has_attached_file :avatar,
    :styles => {
      :thumb    => ["50x50#",   :jpg],
      :small    => ["100x100>", :jpg],
      :medium   => ["100x100>", :jpg] }

I would like to implement these steps:

  1. an user upload an image;
  2. the RoR application show to the user the "medium" image (maybe saving the related file in a temporary directory);
  3. the user adjust (rotate) the image and then use a button to submit it;
  4. the RoR application process the image (rotation, conversion, size, ...) using Paperclip and save all related files ("thumb", "small" and "medium" image) on the disk.

How can I implement these steps in a RoR application?

I've seen the Railcast 182... I would not add third-party software, but do the implementation myself, for example with a new view file, AJAX approach (RJS) and ImageMagick libraries.

P.S.: I read about Paperclip "processors" but I am still not able to implement those. Can someone help me?

Upvotes: 1

Views: 1530

Answers (2)

smudge
smudge

Reputation: 831

Ryan Bates explains how to set-up a similar series of steps, except for cropping:

http://railscasts.com/episodes/182-cropping-images

What I would do is try to adapt what he did for rotation instead. So, for the javascript, you can use something like this:

http://wilq32.adobeair.pl/jQueryRotate/Wilq32.jQueryRotate.html

I might provide a slider for the user input. They can freely rotate the image, and then submit whatever angle they end up settling on.

On the Rails side, keep track of the angle of rotation (instead of the cropping dimensions) and then send that to a rotation processor. (Look at how the cropping processor is done on the Railscast).

The processor will use the "-rotate" operator instead of "-crop."

And... there you have it. Obviously I didn't go into all of the specifics, but the Railscast should explain the process pretty well, and from there it is just a matter of adapting it for a different ImageMagick operation.

Upvotes: 1

raid5ive
raid5ive

Reputation: 6642

I don't believe what you are trying to achieve on the client-side is completely achievable using just Rails, it is going to require some javascript. I've used jcrop http://deepliquid.com/content/Jcrop.html in the past to do the resize/crop on the client side before the image is uploaded to the service. I'd probably look into a solution like this or similar.

Upvotes: 1

Related Questions