I'm making a small gem to help me out with further development which creates a small javascript function based on some database resutls. That piece of javascript must be added to the page somehow but I'm not sure of the best way of doing it.
Do the assets pipeline have some magic code that I can add javascript/css code to it somehow? I checked the docs but found nada yet.
In your Gemfile:
place your js file in vendor/assets/javascripts
In application
add to file app/assets/javascripts/application.js lines:
#= require your_js_file_name
if you have dynamic pieses of code add extension .erb to your js file
for example: your_js_file_name.js.erb
Related
How can I use a theme from Bulmaswatch in my rails app? I'm currently using the bulma-rails gem. Bulmaswatch recommend using their CDN but how to get it work with the asset pipeline? What's the simplest easier way to get it done?
(Supposition is you have routes, controllers, views sorted)
Add the bulma gem (cdn not needed)
Add any number of Boostrap gems that play well with sass
Bundle
Add #import "bulma"; into application file
Restart the server
IMHO the easiest way is:
Under app/assets/stylesheets delete application.css and create a new file called application.css.scss
Then in that file copy paste the code from your favorite theme on bulmaswatch.
There you go, you've got a unique theme working in bulma.
This question is somewhat similar to: How to customize bulma variables in rails
I'm guessing this is a silly question, but i'm a bit of a newb...
I've added the chosen gem to my rails app by adding it to my Gemfile and requiring chosen-jquery in my application.js file.
My question is: where can i find the actual javascript file for chosen? Is it downloading it automatically?
Simply include the JS and CSS files like described in the documentation on the main page of the Github project and it will be included when precompiling your assets. The files are not within your project directory but rather within the gem and will be resolved by the pipeline when the gem is included.
If you need to get to the file directly (for modifications), you need to put the JS in there manually. You can then still include it in the main application.js for the pipeline and have better control of the version in use. To me, this is the preferred method.
However, may I suggest switching to Select2 which is originally based on Chosen but under much more active development and better documentation:
http://ivaynberg.github.io/select2/
https://github.com/ivaynberg/select2
There's also a gem for it if you like:
https://github.com/argerim/select2-rails
It's in a gem itself. If you look at vendor/assets/javascripts in gem root, you'll see all javascripts that come with chosen gem. They are added by assets pipeline, with
//= require chosen-jquery
line in your application.js.
Look up your assets load path. Like this:
in terminal cd to your app root
then open rails console
then run Rails.application.config.assets.paths
Your chosen-jquery is in one of those folders.
I have a best practices question regarding one-off javascript plugins and their role in the Rails asset pipeline.
I'm new to Rails, and am working on a new project. The site template I'm using uses a large collection of js plugins for added functionality. (eq chartjs.org, ckeditor, and about 40 others) Since these are needed on a page-by-page basis, I'm not sure if I should really load them all in the application.js manifest.
Currently, I have the template's assets under the /vendor directory and only the core assets are being loaded from my application.js manifest.
Thoughts on how/where to include the plugins?
As i know that rails default added all js file include in application.js by //= require_tree . so, you can remove it and add only those file which you want to added. and if you want to run only specific function then you can use location.pathname with condition and it will work for only that specific page.
I've got a Ruby on Rails app running with Bootstrap, which I installed using the gem twitter-bootstrap-rails.
I'd now like to integrate a new Bootswatch theme, but I'm having trouble figuring out what to do.
There are four possible downloads for each theme - a bootstrap.css file, a bootstrap.min.css file, a variables.less file, and a bootswatch.less. My question is: do I need to download and add them ALL to my ~/app/assets/stylesheets folder? or do I just need a subset of those? Currently inside ~/app/assets/stylesheets are just two files: application.css and boostrap_and_overrides.css.less. LESS really throws me off here so I'm totally confused with how it works and what I need to do to add new css files with this setup. Any help is appreciated.
You only need to download the bootstrap.css file, and rename it. The bootstrap.min.css is the same as the css file just a minified version of it. Less is just another way of writing css and accessing each property differently. Check out less. Add css file and begin integrating into html, also point html to new stylesheet.
Here's a twitter bootstrap gem for easy Bootswatch theme integration/customization for rails:
https://github.com/scottvrosenthal/twitter-bootswatch-rails
I'm trying to find the twitter-bootstrap files in my rails app ('bootstrap-sass', '2.0.0'), as I need to make a change directly to the bootstrap-responsive.css file, however, I can't find it.
I have bootstrap up and running, but can't seem to find the bootstrap files. How do I locate the bootstrap-responsive.css file?
Thank you!
The bootstap-sass gem uses the Rails 3.2 asset pipeline to inject the necessary stylesheets into your app. The actual stylesheet files are located in the gem installation directory, not in your project itself.
Depending on what you want to change, you can either:
Copy the _bootstrap-responsive.scss file from the gem into your app/assets directory and edit it there.
Customize the necessary Bootstrap variables before loading up Bootstrap in your application.scss file:
$btnPrimaryBackground: #f00;
#import "bootstrap";
Edit: Try looking under
app/assets/stylesheets
Here's an example
https://github.com/joliss/solitr/tree/master/app/assets/stylesheets
I'm not too familiar with the structure of rails apps but did you create a local copy or are you using the bootstrap files being hosted directly by github? You should be able to figure that out by checking one of your launched html pages and viewing the source, looking for something like
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css">
If it's a local page, there should be a directory somewhere in your rails app where the files are stored - perhaps there's a 'static' folder or something similar? Try file-searching for it, good chance you might find it.
(I use Django/Python for web projects but I'll look into Rails a bit and see if I find anything)