Best practice on Javascript and rails

Hi, I get constantly nervy whenever trying to implement any javascript /
jquery in rails, basically because I’m not sure where to put things in
the project!

I know the people at rails have thought long and hard about how to best
structure an app, so I’d like to learn the correct way.

I’m using rails 3.2, ruby 1.9.3

/////////////
1st situation - using a gem to include a javascript package :

By default now I notice this is included in the gemfile : gem
‘jquery-rails’

there’s also these lines in application.js
//= require jquery
//= require jquery_ujs

and there’s this in my layout view

<%= javascript_include_tag “application” %>

do I have to do anything at all to use jQuery in my application?
If I want to use some jQuery on a page, where’s the place to put it? in
the controller.js.coffee? Or on the page between
can I use js / jquery in this strange .coffee file?

//////////////
2nd situation - now I want to use JQUery-UI

What is the best way to use jQuery UI, and where should I put it.

I downloaded the minimised version from jQuery website, but which folder
do I put it in? public/…?
What am I meant to add to application.js?
and do I need to add anything extra to the layout?

//////////
3rd Situation - now I want to use the jQuery-ui CSS to make it look nice

Do I link to the online page at
http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/themes/base/jquery-ui.css
in my layout, pulling in the css dynamically
or copy and paste that to a file and include it in the project?
if I include this in the project where do I put it?
Do I need to add anything to application.css, and or my layout?

That’s enough for now! I know these questions might seem a bit
pointless, but I want to know the right way to do this. I had an app
looking and functioning perfectly on my local system, but then when I
uploaded it to heroku all jquery-ui stuff and some of the css didn’t
work, even after a ‘rake assets:precompile’ I’ve now got a project with
lots of extra includes, and js / css files repeated in different places
just to get it to work on heroku.

Very annoying, and I’m sure if I just knew the right way to organise
everything it’d be much easier.

Thanks

This might not be what you’re looking for but I’d start by reading up on
the Asset Pipeline http://guides.rubyonrails.org/asset_pipeline.html.
Then there are useful railscasts http://railscasts.com/ on both
subjects.

On Jun 28, 1:03pm, Michael B. [email protected] wrote:

1st situation - using a gem to include a javascript package :
<%= javascript_include_tag “application” %>

do I have to do anything at all to use jQuery in my application?
If I want to use some jQuery on a page, where’s the place to put it? in
the controller.js.coffee? Or on the page between
can I use js / jquery in this strange .coffee file?

coffeescript compiles to javascript. If you don’t want to use coffee
script (I’d give it a go if I were you) rename controller.js.coffee to
just controller.js.
Be aware that (by default at least) all of those js files will be
loaded together, so make sure the code you write there won’t interfere
with pages it’s not supposed to act on (it’s up to you to come up with
something to handle this)

//////////
3rd Situation - now I want to use the jQuery-ui CSS to make it look nice

I use the gem ‘jquery-ui-rails’ for the last 2. As you might imagine
it vendors jquery ui but it splits it up so that you only load the
components you need, i.e. you can stick in your application.js

//= require jquery.ui.tabs

and it will only load that bit (it knows about dependencies and will
pull in whatever bits of jquery-ui are needed to make ui.tabs work.
This gem does the same for stylesheets too, you can add

/*
*= require jquery.ui.tabs
*= require jquery.ui.slider
*/

to your css manifest to only include those bits.