Rails 3.2: jQuery UI icons are missing - jquery-ui

I've migrated to Rails 3.2.2, deployed all changes to the production server. Now all my jQuery UI icons are missing.
After deploy I did compiled all the resources using this:
bundle exec rake assets:precompile
I've also added //= require jquery-ui to the application.js.
The icons work fine in development env, but doesn't show after deploying to the production server.

Did you move the jquery-UI images to the appropriate directory under
app/assets/images/
?

Ok, the reason was that I forgot to modify the jQuery UI custom css to use assets pipeline. Here is the fix:
--rename jquery-ui-custom...css to .css.erb
--append <%= assets_pipeline '...png' %> to every place where images are used.

Related

Ruby on Rails: Adding jQueryUI and Bootstrap icons on production environment

I have problem with showing icons on production environment. I located files jQueryUI and Bootstrap in /vendor/ directory, then i add config.assets.paths in assets.rb:
Rails.application.config.assets.paths << Rails.root.join("vendor/bootstrap-3.3.7-dist") Rails.application.config.assets.paths << Rails.root.join("vendor/jquery-ui-1.12.1")
I also added 'require' statements in app/assets/stylesheets/application.css and app/assets/javascripts/application.js. After that i try:
RAILS_ENV=production bundle exec rake assets:precompile
and restart apache.
Bootstrap and jQueryUI works fine but i can't add icons (or glyphicons from Bootstrap). When i change environment to development icons works fine. The problem is only on production environment. I have tried add png files with icons and fonts files with glyphicons to /vendor/assets/images/ and app/assets/images/ and then change url addresses in css files to assests/images/file_name.png but it doesn't work. Could it be some issue with configuration config/environments/production.rb or something like that? It is strange that everything works fine on development, but production not.

Rails 4, Heroku, Bootstrap - Overrides not working in Production

I've converted my Rails app to Rails 4. I'm using the Twitter Bootstrap Rails gem 2.2.6.
My application is working fine locally and in production. When I deploy everything looks fine. I'm not seeing any errors in my Heroku logs when browsing the site.
However, while my dev environment is displaying my color customizations properly, in production it's using the Bootstrap defaults.
I've tried recompiling my assets before each deployment using:
RAILS_ENV=production bundle exec rake assets:precompile
My application.css contains the usual:
*= require_self
*= require_tree .
My overrides are in bootstrap_and_overrides.css.less and look like this:
#navbarBackground: #4466af;
#navbarBackgroundHighlight: #4E7AC7;
#navbarText: #white;
#navbarLinkColor: #white;
#navbarLinkColorHover: #7FB2F0;
All of my other overrides are working correctly. It's just the navbar that's causing problems.
I've cleared my browser cache/history/etc. and that hasn't fixed it either.
Any ideas? I'm completely stumped.
I found the answer. When I checked my git repo I saw that there was a misspelling of a file which I had accidentally committed. I'd removed this from my file system, but it was still in my git repo. Removing this file, deleting all assets, recompiling and redeploying fixed it.

jquery-ui asset not found. How to incorporate assets from rails pipeline into jquery-ui css?

I noticed that locally we were getting errors about 7 different jquery-ui images, e.g. ActionController::RoutingError (No route matches [GET] "/public/ui-bg_highlight-soft_100_eeeeee_1x100.png")
These assets do actually exist within the jquery-ui file structure.
I have found that changing the url's used within the jquery-ui framework css itself from "url(/images/ui-bg_highlight-soft_100_eeeeee_1x100.png" to "url(/assets/ui-bg_highlight-soft_100_eeeeee_1x100.png " or "url(ui-bg_highlight-soft_100_eeeeee_1x100.png " removes the error (though I had to also do a rake assets:precompile locally). However this seems like a bad approach and not the right thing to do.
What is the right approach to resolving these errors?
First off, I highly recommend using the jquery-ui-rails gem to easily roll jquery ui into the assets pipeline.
In your Gemfile:
group :assets do
gem 'jquery-ui-rails' # jquery ui
end
In your app/assets/stylesheets/application.css:
*= require jquery.ui.all
Note that you can only require the parts of jquery ui you use, like the progressbar or datepicker, ala jquery.ui.progressbar
And in app/assets/javascripts/application.js:
//= require jquery.ui.all
Now run bundle install and voila! You're set!
The final result was:
delete my local versions.
add the items to the jquery js and css manifest files.
use the jquery-ui-rails gems
Observe what path is 404 Not Found in your browser, and then make sure the query-ui theme's /images directory is either moved or linked to that path in the Rails app.
Example
I experience 404 for:
http://localhost:3000/assets/images/ui-icons_ffffff_256x240.png
My jquery-ui theme directory is in /vendor, so the real path to the images is:
RAILS_ROOT/vendor/assets/stylesheets/ui-lightness/images
So, to fix the 404, put a symbolic link to that directory where it's expected:
% cd vendor/assets/stylesheets
% ln -s ui-lightness/images images
Now, that URL serves the images.

Rails / Heroku / Assets not being included

I have an application that uses redactor (a wysiwyg editor) it works perfectly locally, and it also works when I upload it, except the config file, which is located in a subfolder doesent do anything, when pushing to Heroku. I tried precompiling, using:
RAILS_ENV=production bundle exec rake assets:precompile
and
bundle exec rake assets:precompile
I have config.assets.enabled = false
The config.js file, that is not working on Heroku, is included in application.js as redactor-rails/config
What can be the problem ?
Have you added config.js to your local git repository before pushing?
[Edit]
A couple more things to check. Are you using the redactor-rails gem, and if so, is it in your gemfile?
gem 'jquery-rails'
gem 'redactor-rails'
Is your gemfile.lock checked into git?
[Edit 2]
I've now tested this out, and indeed, there's an issue with redactor-rails, which causes custom config to be overwritten by the gem's default.
On the github repo, there is a solution, which I've tested on heroku, and copied here:
rails generate redactor:config generates the file app\assets\redactor-rails\config.js.
This will not work in the asset pipeline correctly as the rake assets:precompile task
will still take config.js from the gem instead of the app (not that it'll work fine in
development though). See Overriding backend assets in production environment
The solution is to create your own config.js (or any file name) and put it anywhere in your >app's assets. Then when requiring redactor, instead of //= require redactor-rails, use:
//= require redactor-rails/redactor.min
//= require path/to/custom/config
Works for me. Hope that helps. https://github.com/SammyLin/redactor-rails/issues/16

rails 3.1.3 app on Heroku doesn't find (or precompile) vendor/assets

My rails 3.1 app runs fine locally, but when I run it on Heroku the logs show Rails is not finding javascripts inside the vendors/assets/javascripts directory even though browsing them manually works.
I am using the plupload-rails3 gem, and the gem's javascripts are not loading on Heroku, but do load fine on my local dev machine.
In my assets/javascripts/application.js I have:
//= require_tree ../../../vendor/assets/javascripts/plupload-rails3
//= require_tree ../../../vendor/assets/stylesheets/plupload-rails3
//= require_tree ../../../vendor/assets/images/plupload-rails3
When I run my app on Heroku the logs show Rails trying to load and failing with each of the plupload javascripts, with a token identifier:
ActionController::RoutingError (No route matches [GET] "/assets/plupload-rails3/plupload/js/plupload.full-f4741a878138cea127e6b38b6a08cf12.js"):
So the plupload widget does not display on the page on Heroku (but does when I run locally).
However, if I manually browse that location (without the ID token):
http://MYAPPNAME.herokuapp.com/assets/plupload-rails3/plupload/js/plupload.full.js
I do see the file.
I have also tried precompiling the assets locally, then pushing to Heroku, with same result.
So something in my app is broken with Rails on Heroku accessing the vendor/assets pipeline.
(I do have config.assets.compile = true in my production.rb file. The original setting of false caused the app to crash when it failed to find the precompiled assets, at least now it doesn't crash, but it ignores the javascript widget.)
Application.js is a manifest file for javascript, you don't want to include images or css in it.
vendor/assets/javascripts should already be in the path it is searching so just include:
//= require_tree ./plupload-rails3
Edit:
you can do similar to include the css in application.css, images do not need to be included in a manifest.
Check out the Rails Guide: http://guides.rubyonrails.org/asset_pipeline.html and Ryan Bates Railscast http://railscasts.com/episodes/279-understanding-the-asset-pipeline for more info.
Edit2: just looked through the gem, did you run
bundle exec rake plupload_rails3:install_assets
To install the assets? If not, run that, then try the code above.

Resources