How to store javascript in app/controllers? - ruby-on-rails

I would like to keep Javascript controllers (Angular) next to Rails 4 controllers, in the same folder. I added this line to the config/initializers/assets.rb
Rails.application.config.assets.paths << Rails.root.join('app', 'controllers')
And restarted server (development env), but it didn't help. Javascript files are written in Coffee and work when in standard assets/javascripts folder.


Solved by adding one line in assets/javascripts/application.js
//= require_tree ../../controllers
I's because default require_tree . doesn't autoload all javascript files in asset pipeline, but only those in the "dot" folder of application.js, which is standard javascripts folder.


add this line to the application.js
//= require_directory .
It will include all js files in the app/assets/javascript directory recursively

Related

How to add vendor resources to application.css and reference it in web page?

I'm using rails 4, and using bower install resource in vendor/assets/bower_components directory, for example, bootstrap is in /vendor/assets/bower_components/bootstrap/dist/css/bootstrap.css.
I add require bootstrap/dist/css/bootstrap to app/assets/stylesheets/application.css, but when i view a page, it shows couldn't find file 'bootstrap/dist/css/bootstrap'
(in /home/vagrant/Share/webapp/app/assets/stylesheets/application.css:15)
And I wonder how to reference those resource in rails.

Try with this in your application.css file. Hope it helps.
*= require_tree ../../../vendor/assets/bower_components/.

Add config.assets.paths << Rails.root.join('vendor', 'assets', 'bower_components') to config/application.rb and retry.

Rails asset pipeline require

In rails to require a file in the vendor directory I know that I can do this in my application.j file.
//=require vendor/assets/javascripts/me.js
Am wondering how does one require the entire javascript folder in the vendor directory

//= require_tree ../../../vendor/assets/javascripts/include/.

See http://guides.rubyonrails.org/asset_pipeline.html#asset-organization
Try
//=require me
Vendor should be loaded by default
Assets are not namespaced
You might need to restart your dev server after adding to vendor

Rails assets pipeline - not precompiling subdirectory

In both assets/stylesheets and assets/javascripts, I have a folder called admin, which has a handful of appropriate Coffeescript and SASS files.
$ cat app/assets/javascripts/admin.js
//= require jquery
//= require jquery_ujs
//= require_tree ./admin
$ cat app/assets/stylesheets/admin.css
/*
*= require_self
*= require_tree ./admin
*/
$ cat config/application.rb | grep 'assets.paths'
config.assets.paths << "#{Rails.root}/app/assets/stylesheets/admin"
config.assets.paths << "#{Rails.root}/app/assets/javascripts/admin"
After precompiling, the admin folders (and their contents) are nowhere to be seen in public/assets.
I'm probably making a fundamental mistake here; I've done very little playing with the pipeline besides the basics of images, application.js etc.
Can anyone point out what I'm doing wrong?

From what i can see, they are manifests. By default only application.css and application.js are precompiled. Other need need to be added.
You need to add them to the production.rb environment as follows (comment is from the file itself):
# Precompile additional assets (application.js, application.css, and all non-JS/CSS are already added)
config.assets.precompile += %w( admin.css admin.js )
Also, you can ditch the config.assets.paths in your application.rb, because those paths are loaded by default.

How do I require subdirectories of /app/assets/javascripts in Rails 3.1

I want to separate out my javascripts into separate subdirectories in my Rails 3.1 app.
For instance I have a /modules directory inside /app/assets/javascripts
A way to either require all the contents of the directory or each file individually would be helpful.
Edit: To clarify, I want to do this from my application.js coffeescript file.

I believe the way to do this in Sprockets is
#= require_tree modules
or
#= require_tree ./modules
if you want to select a subdirectory relative to the CoffeeScript file, rather than relative to app/assets/javascripts (see this issue).

Rails 3.1 and jquery-ui assets

This was asked in another question, but none of the solutions appear to work for me in 3.1rc1.
I'm trying to use the new assets stuff in rails 3.1 - I have the files:
./vendor/assets/stylesheets/jquery-ui-1.8.13.custom.css
./vendor/assets/javascripts/jquery-ui-1.8.13.custom.min.js
I then added:
//= require jquery-ui to app/assets/javascripts/application.js
*= require jquery-ui to app/assets/stylesheets/application.css
The jquery-ui javascript file loads just fine, but the css file says:
Sprockets::FileNotFound (couldn't find file 'jquery-ui'
(in /home/xanview2/xancar/app/assets/stylesheets/application.css):6):
Any ideas?

Example of a working setup:
$ cat app/assets/javascripts/application.js
//= require jquery
//= require jquery-ui
$ cat app/assets/stylesheets/application.css
/*
*= require vendor
*
*/
$ cat vendor/assets/stylesheets/vendor.css
/*
*= require_tree ./jquery_ui
*
*/
vendor/assets/ $ tree
stylesheets
vendor.css
jquery_ui
     jquery-ui-1.8.13.custom.css
...
images
   jquery_ui
   ui-bg_flat_0_aaaaaa_40x100.png
...
Finally run this command:
vendor/assets/images $ ln -s jquery_ui/ images
Enjoy your jQuery UI

This is a great article to read about Rails 3.1's asset pipeline and jQuery UI: JQuery-UI css and images, and Rails Asset Pipeline

You might have more luck with the jquery-ui-rails gem (see announcement), which packages the jQuery UI JavaScripts, stylesheets and images as assets for you.

This topic comes up a lot, and now that a significant amount of time has passed, things may be different.
In Rails 3.1.2, I found something that works without symbolic links.
Follow the steps above, but put the images for the theme right next to the jquery-ui-xxx.css file in an images/ folder. This saved me quite a few headaches.
Yes, this would mean the images would reside in a stylesheets/ folder in vendor/assets, but it works and it is quick to do.

Have you tried using the rails-asset-jqueryui gem? It vendors jquery-ui and the standard themes (currently v1.8.16) and makes them available via the asset pipeline. The following example calls for the Smoothness theme.
Gemfile:
....
gem 'rails-asset-jqueryui'
...
app/assets/javascripts/application.js:
...
//= require jqueryui
...
app/assets/stylesheets/application.css:
...
= require smoothness
...

If you're using the jquery-ui-rails gem:
application.css
/*
*= require jquery.ui.all
*/
application.js
//= require jquery.ui.all

It seems to me that a lot of confusion can be avoided by keeping these library assets out of assets/javascripts and assets/stylesheets dirs, where sprockets et al have some opinions about what should happen.
Say you've downloaded a customized jquery-ui zipfile from the themeroller. Try this:
unpack the zip file into an subdir of an assets dir, something like
vendor/assets/jquery-ui-1.8.23.custom
in application.rb add:
config.assets.paths << Rails.root.join('vendor', 'assets', 'jquery-ui-1.8.23.custom').to_s
add manifest files in the usual places:
vendor/assets/javascripts/jquery-ui.js:
//= require_tree ../jquery-ui-1.8.23.custom
vendor/assets/stylesheets/jquery-ui.css:
*= require_tree ../jquery-ui.1.8.23.custom
in config/environments/production.rb, add (referring to manifest filenames):
config.assets.precompile += %w(jquery-ui.js jquery-ui.css)
in views:
<%= stylesheet_link_tag 'jquery-ui' %>
<%= javascript_include_tag 'jquery-ui' %>

if you use this:
https://github.com/carlhoerberg/sprockets-urlrewriter
i believe you can just dump the whole shebang in a directory and require the css file... it will smoothly rewrite the relative urls.
you just have to install the gem and add a config line to application.rb

Resources