How to automatically rotate tall thumbnails?

Question

I'm making an app where users can post images over a general feed, and tall photos are printed sideways in my feed.

I started using thumbnail conversion using the CarrierWave gem on Rails, which started the problem, but I don't want to get rid of this feature.

I've been on numerous Stack posts (a lot on PHP, no Rails), and tried a bunch of tutorials but none really match my issue.

I don't know how exactly to word the problem, but I want taller images to be normal rather than sideways, yet all other posts to stay the same. Also, the tall image came out as distorted and pixelated.

Here's my code:

Html.erb:

<div class="posts_container" style="overflow: auto;">

<% @posts.each do |p| %>
    <div class="post">
        <p>
        <%= image_tag p.image_url(:thumb).to_s %>
        </p>
        <p>
        <%= p.caption %>
        <%= p.content %>
        </p>
    </div>
<% end %>

</div>

And CSS:

.posts_container {
  padding: 0 10px;
}

.post {
  margin-top: 40px;
  background: #FFF;
  float: right;
  width: 100%;
  border: thin silver solid;
}

Also, how can I retain the quality of the picture, even though it's a thumbnail?

Thanks so much.

http://stackoverflow.com/questions/20061774/rotate-an-image-in-image-source-in-html — SaggingRufus, Aug 24 '15 at 17:34
How will the site know the dimensions of each image that someone posts? I want it to only rotate tall images @SaggingRufus — Jacob Reisner, Aug 24 '15 at 17:36
use this: http://stackoverflow.com/questions/623172/how-to-get-image-size-height-width-using-javascript — SaggingRufus, Aug 24 '15 at 17:39

How to automatically rotate tall thumbnails?

0 Answers0