title: Rails paperclip crop save ratio
body: <p>How to save ratio while crop image?</p>
  
  <p>I use paperclip and my image style <code>blog_article_main</code> is 940x400x it works ok.</p>
  
  <p>But while i crop  an image ratio is changed.</p>
  
  <p>my cropper </p>
  
  <pre><code>module Paperclip
    class Cropper &lt; Thumbnail
      def transformation_command
        if crop_command
          crop_command + super.join(' ').sub(/ -crop \S+/, '').split(' ') 
        else
          super
        end
      end
  
      def crop_command
        target = @attachment.instance if @attachment
        if target.cropping?
          ["-crop", "#{target.crop_w}x#{target.crop_h}+#{target.crop_x}+#{target.crop_y}"]
        end
      end
    end
  end
  </code></pre>
  
  <p>my js </p>
  
  <pre><code>javascript:
    $(function () {
      $('#cropbox').Jcrop({
        onChange: update_crop,
        onSelect: update_crop,
        bgColor: 'black',
        bgOpacity: .2,
        setSelect: [100, 100, 400, 400],
        //aspectRatio: 16 / 9,
        maxSize:[940,400]
      });
    });
    function update_crop(coords) {
      var rx = 100/coords.w;
      var ry = 100/coords.h;
      $('#preview').css({
        width: Math.round(rx * "#{@photo.photo_geometry(:blog_article_main).width}" ) + 'px',
        height: Math.round(ry *  "{#@photo.photo_geometry(:blog_article_main).height}" ) + 'px',
        marginLeft: '-' + Math.round(rx * coords.x) + 'px',
        marginTop: '-' + Math.round(ry * coords.y) + 'px'
      });
      var ratio = "#{@photo.photo_geometry(:original).width}"  /  "#{@photo.photo_geometry(:blog_article_main).width}" ;
      $("#crop_x").val(Math.round(coords.x * ratio));
      $("#crop_y").val(Math.round(coords.y * ratio));
      $("#crop_w").val(Math.round(coords.w * ratio));
      $("#crop_h").val(Math.round(coords.h * ratio));
  
  
  
    }
  </code></pre>
  
  <p>and than after image has cropped ratio changed</p>
  
  <pre><code> def photo_geometry(style = :original)
      @geometry ||= {}
      @geometry[style] ||= Paperclip::Geometry.from_file(self.image(style))
    end
  
  
  @photo.photo_geometry(:blog_article_main)=&gt; 940x851
  </code></pre>
  
  <p>original image <a href="https://i.stack.imgur.com/s2GVb.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/s2GVb.jpg" alt="enter image description here"></a></p>
  
  <p>how i want to crop  <a href="https://i.stack.imgur.com/wUW0x.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wUW0x.jpg" alt="enter image description here"></a> </p>
  
  <p>and after<a href="https://i.stack.imgur.com/U3RWM.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/U3RWM.jpg" alt="enter image description here"></a></p>