Rails Engines: Accessing an images under an engine

Question

We have a view under an engine that is supposed to show an image. this image (Button-Blank-Red-icon.png) is saved under the engine's path of "app/assets/images/engine_name/Button-Blank-Red-icon.png

I am getting the below error when trying to display this view.

ActionController::RoutingError (No route matches [GET] "/images/<>engine_name>/Button-Blank-Red-icon.png"):

What's the right way to display an image stored under engine's app/assets/images/engine_name/?

Here is the view code:

<img src="<%= RED_GREEN_YELLOW_CLS[r.step_qties.last.ontime_indicator] %>"  height="15" width="15" />

r.step_qties.last.ontime_indicator returns one of 'green', 'red' and 'yellow'

The definition of constant RED_GREEN_YELLOW_CLS is in my_constant.rb under engine's config/initializers/:

RED_GREEN_YELLOW_CLS = {
                         'green'  => '/Button-Blank-Green-icon.png',
                         'red'    => '/Button-Blank-Red-icon.png',
                         'yellow' => '/Button-Blank-Yellow-icon.png'
                        }

One working solution with image tag (refers to episode#277 in railscasts.com):

<%=image_tag(RED_GREEN_YELLOW_CLS[r.step_qties.last.ontime_indicator], size: '23x23') %>

There is no need of block .

The my_constant.rb is:

RED_GREEN_YELLOW_CLS = {
                         'green'  => 'engine_name/Button-Blank-Green-icon.png',
                         'red'    => 'engine_name/Button-Blank-Red-icon.png',
                         'yellow' => 'engine_name/Button-Blank-Yellow-icon.png'
                        }

Answer 1

It looks like you're displaying your image via an AssetUrlHelpers. Your view code needs to be changed to the following:

<img src="<%= image_path(RED_GREEN_YELLOW_CLS[r.step_qties.last.ontime_indicator]) %>" 
  height="15" width="15" />

image_path is going to properly add the assets portion of the path, along with the hash generated by the asset pipeline, so that you get a correct url.

Answer 2

The correct url should be "/assets/<>engine_name>/Button-Blank-Red-icon.png" because when rails compiles the assets it will just mix all the content of /images /stylesheets and /javascript for all the gems and your app/assets dir inside public/assets. It will just copy "<>engine_name>" folder and it's content there.

It's not clear where this: "/images/<>engine_name>/Button-Blank-Red-icon.png" comes from, I'm not sure how to get that from the code you show.

Try to change what you use to "/assets/<>engine_name>/..." and it should work.

You can try to compile your assets manually and look where the files go, just do "bundle exec rake assets:compile RAILS_ENV=production", you can safely delete /public/assets after that test to keep it clean.

Answer 3

Have you tried asset_path helper?

<%= image_tag(asset_path("engine_name/#{RED_GREEN_YELLOW_CLS[r.step_qties.last.ontime_indicator]}"), size: '23x23') %>

replace engine_name with the actual name of the engine app.

Answer 4

Images from engine are accessible via:

http://localhost:3000/assets/engine_name/image.png

So as you said

<img src="<%= asset_path(RED_GREEN_YELLOW_CLS[r.step_qties.last.ontime_indicator]) %>"  height="15" width="15" />

RED_GREEN_YELLOW_CLS = {
                         'green'  => 'engine_name/Button-Blank-Green-icon.png',
                         'red'    => 'engine_name/Button-Blank-Red-icon.png',
                         'yellow' => 'engine_name/Button-Blank-Yellow-icon.png'
                        }

Will work.

p.s. I find r.step_qties.last.ontime_indicator personally insulting train wreck. :)