Rails 3.1 assets pipeline, how does it handle files with the same name? priority? - ruby-on-rails-3.1

This is problem, I'm using Typus, which includes a fancybox jquery plugin under /vendor/assets. That fancybox version is too old (1.3.4) and it does not work with rails 1.9.x so I need to replace that with fancybox 2.x that works with that version of jquery because the rest of my site uses jquery 1.9.
Typus's application.js manifest loads fancybox this way
//= require jquery.fancybox-1.3.4.pack
so I thought I could just add fancybox 2 with that file name and the asset pipeline would use that version instead but it's not, it's loading the file inside /vendor/assets.
So, my question is, how does rails handle that case when there's more than one file with the same name? is there any priority? and most important, can I change that so the files under /app/assets have more priority?
I've read it uses the first file it finds with the name but I don't know how to tell rails to look in some folder first.
I've tried
config.assets.paths = [Rails.root.join('app','assets')]
or
config.assets.paths = [Rails.root.join('app','assets'),Rails.root.join('vendor','assets')]
on my config/application.rb but it keeps using the file under /vendor/assets
I don't want to fork>modify Typus, I want to tell rails to use my jquery.fancybox-1.3.4.pack.js version of the file
I've seen on github that the last commit on Typus downgrades jquery to 1.8.x but I can't do that, I need jquery 1.9.
I'm also trying to override Typus's application.js inside my project but with no luck.

Related

No route error for images refereed to by javascript stylesheets

I just migrated my rails 2.3 application to rails 3.2 (a bit late but I did it)
Everything else seem to work fine except I get no route error for images which are referred to by javascript stylesheets.
The rake assets:precompile task creates all the image names with appended hash also for images which are required by js stylesheets for example jquery dialog etc.
How can I fix this?

livereload only responding to css changes, not html

I have installed livereload gem, which I'm using with a ruby middleman application. However, it's only autoloading changes to the css. If I make changes to the html files, I still have to restart the server to view the changes. Is there somehow I can make it autoload html changes?
It seems that this feature doesn't work on all versions of livereload and also depends on the browser and it's extensions. Try to also change a css file when you change the html so that the refresh occurs. Also, have you looked at https://github.com/guard/guard-livereload ? That has an example watching the change of html.
guard 'livereload' do
watch(%r{app/views/.+\.(erb|haml|slim)})
watch(%r{app/helpers/.+\.rb})
watch(%r{public/.+\.(css|js|html)})
watch(%r{config/locales/.+\.yml})
# Rails Assets Pipeline
watch(%r{(app|vendor)(/assets/\w+/(.+\.(css|js|html))).*}) { |m| "/assets/#{m[3]}" }
end

Is there any way to instantly see the edit to the erb file?

I am using Sinatra and erb on Passenger/Apache. Every time I made edit to the erb file, I have to restart Apache and refresh in the browser.
Is there any way to edit the file and sinatra can instantly update it? I mean simply by clicking the refresh button in the browser can one view the update?
Conclusion:
If you are in dev on sinatra, you can use shotgun or SinatraLoader.
If you are using Passenger, you can create an empty file: tmp\always_restart.txt
Yes, you can use Sinatra::Reloader.
Sinatra::Reloader
Extension to reload modified files. Useful during development, since it will automatically require files defining routes, filters, error handlers and inline templates, with every incoming request, but only if they have been updated.
You can use Shotgun for that: https://github.com/rtomayko/shotgun
Shotgun
This is an automatic reloading version of the rackup command that's shipped with
Rack. It can be used as an alternative to the complex reloading logic provided
by web frameworks or in environments that don't support application reloading.

asset pipeline javascript structure files

At the moment my application.js file looks like this:
//= require_tree ./vendor
//= require_directory ./lib
I also have individual JavaScript files for individual views, e.g. home.js, user.js etc.
Do people put these files in the application.js? If so how do they activate them? Most of my JavaScript is executed from the jQuery ready event handler $(function (){ });
Obviously this does not work if they are all in the same file. How could I minify these files and access the correct ready event if they are all in the same file?
Any help or tips greatly appreciated.
It's fine to have multiple jQuery document ready handlers as you shouldn't care about the order between them. You'll need to check that the elements they work on exist before trying to attach any handlers, though.
For example, in home.js, you might have something like
if ($("#home_div").length) { // do some stuff on the home page }
Doing this is better than splitting up your JS and only serving some pieces on some pages, since with the compiled approach your users only have to download JS once. I think the default rails 3.1 config should minify and concatenate all of your JS in production but not in dev. If you want to enable it manually,
config.assets.compress = true # compress js into one file
config.assets.js_compressor = :uglifier # minify the JS (need the uglifier gem)
config.assets.digest = true # append hashes to filenames so you can set far-expiry headers for caching
some more info, check out the "customizing the pipeline section" of the docs http://guides.rubyonrails.org/asset_pipeline.html#customizing-the-pipeline
and this related question
How to properly work with jQuery in Rails 3.1 asset pipeline?

Rails 3.1/Sprockets: Injecting controller variables (or helpers) into javascript assets

I have an action with
def new
#test_var = 'i want this to show'
end
All I want to do is inject that into the javascript called for that page. For example:
#app/assets/javascript/my_model.js.coffee.erb
$ ->
console.log('<%= #test_var %>')
I'm guessing this doesn't work because that the coffeescript/erb is compiled before the controller is accessed...so, if I wanted to inject controller variables into a JavaScript file (client side - NOT accessed via ajax) in 3.1, how should I go about doing it?
I believe the problem is that you're thinking about the asset pipeline all wrong...
asset being the operative word.
It's not a view pipeline. Other things which are assets? images & css files, things which can be preprocessed and then served as-is. The erb/preprocessing of your assets doesn't occur on each pageload/request, rather it occurs on startup/filechange so in production said assets can be optimised, cached and served statically.
You could probably figure out a way to achieve it using Live Compilation (see section 4.2 of http://guides.rubyonrails.org/asset_pipeline.html) but as the docs say:
This mode uses more memory and is lower performance than the default. It is not recommended.
The bad answer would be 'inject the javascript into your view', but decoupling your javascript from your rails controllers/views is a good idea.
A better answer would be to have an asset folder containing all of your controller javascripts, and use some "what page am I on?" javascript to determine whether to run the code or not.
Here's some answers that explain various approaches to this:
Rails 3.1 asset pipeline: how to load controller-specific scripts?
Using Rails 3.1, where do you put your "page specific" javascript code?

Resources