Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Already on GitHub? Sign in to your account

Figure out how to support something like asset-pipeline-aware `{{imageURL}}` #114

Open
wycats opened this Issue Jan 8, 2013 · 10 comments

Comments

Projects
None yet
7 participants
Owner

wycats commented Jan 8, 2013

No description provided.

Owner

machty commented Feb 27, 2013

Not sure I follow... you mean something to convert src="{{imageURL hello.jpg}}" to src="/assets/hello-98werfegerg.jpg" ?

Member

bradleypriest commented Feb 27, 2013

I've got a very naive implementation of this I've been working on.
It involves an {{imageTag}} helper which looks up an Ember.Images hash.
Currently loading in the Ember.Images hash via the HTML, but was planning on looking into the feasibility of using Sprockets, once I get sometime to clean it up

Owner

machty commented Feb 27, 2013

What problem does this solve? Why wouldn't the image urls be available as part of a model or some other dynamic data?

Member

bradleypriest commented Feb 27, 2013

Site images, I've extracted as much as I can to CSS background images, but there's only so far you can go.

jcypret commented Aug 25, 2014

Is there any recommendation for this issue? I first ran into this when attempting to add logo.svg to my application.hbs template.

I can place the logo image in app/assets/images/logo.svg and then reference it using <img src="/assets/logo.svg">, but when the app is precompiled, the compiled handlebars js file still references /assets/logo.svg instead of the actual /assets/logo-64240dd6f2216d4dfac944c2165531b5.svg.

Member

bradleypriest commented Aug 26, 2014

I'm currently loading it via an ENV variable, stripped down example below:

application_helper.rb

  def preload_env
     env = {}
     env["ASSETS"] = asset_hash
     ...
     env
  end

  def asset_hash
    {
      wysihtml5:            javascript_path("wysihtml5-0.3.0"),
      blank_avatar:         image_path("avatars/avatar-blank.png"),
      vendor_avatar:        image_path("avatar-vendor-big.png"),
      user_avatar:          image_path("avatar-user-big.png"),
      company_avatar:       image_path("avatar-company-big.png"),
      product_placeholder:  image_path("product-placeholder.png")
    }
  end

index.html.erb

<%= javascript_tag("window.ENV = #{preload_env.to_json.html_safe}") %>

application.hbs

<img src="{{unbound Ember.ENV.ASSETS.blank_avatar}}"/>

jcypret commented Aug 26, 2014

I appreciate your help on this @bradleypriest. Very nice solution; tried it out and it worked perfectly!

This is an interesting approach but why is it necessary? We're in Rails, just append .erb to the end of your handlebars template name and use the asset_path helper. Unless I'm missing something :)

<img src="<%= asset_path('special-image.png') %>" class="icon" alt="special image">

daniely commented Oct 24, 2014

👍 to @supairish

Don't know why something so obvious was stumping me. Thanks for the tip!

@supairish solution is simple and pragmatic, but for various reasons it wouldn't work for us. So, if you really need an asset-path helper like I did: https://github.com/botandrose/ember-rails-assets

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment