User has 2 image attachments in model. But, after upload of a single image (i.e. avatar), it replaces both

Question

So, in the my rails app, I've given users the ability to add their own avatar picture and a background image to their profile.

The problem is, whenever I upload the avatar image, it displays for both the avatar and the background of the profile. And when I upload a background image, it displays for both the background and the avatar picture, replacing the original avatar picture I set.

On my local host this works fine. The user's profile can display both the avatar image and the background image I set. But, this issue seems to occur only on heroku.

Any idea on how to fix this?

It's a rails app and I'm using paperclip and aws-sdk.

Here's some of my code from the user #show...

Background:

 <div class="bg-dark lter nav-user pos-rlt" style="<%= show_user_bg %>">

Avatar:

<a href="#" class="thumb-sm avatar animated rollIn" style="margin-left:22%;" data-         toggle="dropdown">
<%= image_tag @user.avatar.url(:medium) %>
<span class="caret caret-white"></span>
</a>

The background's css is included in the users_helper...

module UsersHelper
def show_user_bg
"background:transparent url(#{@user.background.url}) no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;"
end
end

This is from the user's model...

# Setup accessible (or protected) attributes for your model
attr_accessible :email, :password, :password_confirmation, :remember_me, :name, :avatar,         :tagline, :bio, :phone, :website, :city, :background
# attr_accessible :title, :body

validates_attachment :avatar, 
                    content_type: { content_type: ['image/jpeg',   'image/jpg', 'image/png', 'image/gif'] },
                    size: { less_than: 5.megabytes }
validates_attachment :background, 
          content_type: { content_type: ['image/jpeg', 'image/jpg', 'image/png', 'image/gif'] },
          size: { less_than: 5.megabytes }            

has_many :projects
has_attached_file :avatar, :styles => { :medium => "300x300>", :thumb => "100x100>" },  :default_url => "/images/:style/missing.png"
has_attached_file :background, :styles => { :medium => "300x300>", :thumb => "100x100>" },  :default_url => "/images/:style/missing.png"
end

And here's the code from the form to upload the files...

<%= f.input :avatar, label: "Upload Avatar", class: "btn btn-sm btn-info m-b-sm file-input" %>

<%= f.input :background, label: "Upload Background", class: "btn btn-sm btn-info m-b-sm file-input" %>

I'm not getting an error in the logs. So, I'm not what I'm doing wrong.

Thanks in advance for any help you can offer.

i usual have a /app/uploaders/ directory with a file names photo_uploader.rb and it looks like # encoding: utf-8 class PhotoUploader < CarrierWave::Uploader::Base def store_dir "uploads/#{model.class.to_s.underscore}/#{mounted_as} /#{model.id}" end def extension_white_list %w(jpg jpeg gif png) end end — MZaragoza

Ethan Denney Ethan Denney · Accepted Answer · 2013-10-01T03:23:01

I figured it out.

It was something really simple.

Before, the image sizes were both :medium. So, that for some reason was causing the user avatar image to also appear as the background image in the profile, and vice versa.

When, I changed the background image size to :large and changed the dimensions, it displayed both images correctly on the profile.

has_attached_file :avatar, :styles => { :medium => "300x300>", :thumb => "100x100>" }, :default_url => "/images/:style/missing.png"
has_attached_file :background, :styles => { :large => "400x600>", :thumb => "100x100>" }, :default_url => "/images/:style/missing.png"

User has 2 image attachments in model. But, after upload of a single image (i.e. avatar), it replaces both

1 Answers