Permalink
Browse files

Rails 3.1 Asset Pipeline compatibility (Fixes #563)

* removed formtastic_changes.css
* moved formtastic.css into app/assets/stylesheets/formtastic.css
* changed install generator to only copy formtastic.css in Rails < 3.1
* changed install generator to source the stylesheet template from new location
* added formtastic/engine.rb, which seems to be needed to trigger asset pipeline
* updated documentation

Also modified install instructions in README to include bundling from master.

For Rails 3.1, instead of copying the styles across with a generator, simply add them to your application.css with sprockets:

`*= require formtastic`
  • Loading branch information...
1 parent a3713e8 commit 4f4b069f48daf86529d04846ef9e76e7b5cff455 @justinfrench committed May 30, 2011
View
@@ -91,15 +91,19 @@ RDoc documentation _should_ be automatically generated after each commit and mad
h2. Installation
-Formtastic edge (2.0) will be compatible with Rails 3 only, and the gem is "hosted":http://rubygems.org/gems/formtastic on RubyGems.org.
-
Simply add Formtastic to your Gemfile and bundle it up:
<pre>
gem 'formtastic', '~> 1.2.3'
</pre>
-Optionally, run the generator to copy some stylesheets and a configuration initializer into your application:
+If you want to try out our work towards Formtastic 2.0 (Rails >= 3 only), bundle in Formtastic directly from Github with the @:git@ option instead:
+
+<pre>
+ gem 'formtastic', :git => 'http://github.com/justinfrench/formtastic', :branch => 'master'
+</pre>
+
+Optionally, run the generator to copy a stylesheet (Rails 3.0.x only) and a configuration initializer into your application:
<pre>
$ rails generate formtastic:install
@@ -108,14 +112,26 @@ Optionally, run the generator to copy some stylesheets and a configuration initi
h2. Stylesheets
-A proof-of-concept stylesheet is provided which you can include in your layout. Customization is best achieved by overriding these styles in an additional stylesheet so that the Formtastic styles can be updated without clobbering your changes. If you want to use these stylesheets, add both to your layout with this helper:
+A proof-of-concept stylesheet is provided which you can include in your layout. Customization is best achieved by overriding these styles in an additional stylesheet.
+
+h3. Stylesheet usage in Rails < 3.1:
<pre>
- <head>
- ...
- <%= stylesheet_link_tag 'formtastic', 'formtastic_changes' %>
- ...
- </head>
+ $ rails generate formtastic:install
+</pre>
+
+<pre>
+ # app/views/layouts/application.html.erb
+ <%= stylesheet_link_tag 'formtastic', 'my_formtastic_changes' %>
+</pre>
+
+h3. Stylesheet usage in Rails >= 3.1:
+
+Rails 3.1 introduces an asset pipeline that allows plugins like Formtastic to serve their own Stylesheets, Javascripts, etc without having to run generators that copy them accross to the host application.
+
+<pre>
+ # app/assets/stylesheets/application.css
+ *= require formtastic
</pre>
View
@@ -1,5 +1,6 @@
# encoding: utf-8
-require 'formtastic/railtie.rb' if defined?(Rails)
+require 'formtastic/railtie' if defined?(::Rails)
+require 'formtastic/engine' if defined?(::Rails)
module Formtastic
extend ActiveSupport::Autoload
View
@@ -0,0 +1,7 @@
+# Configure Rails 3.1 to have assert_select_jquery() in tests
+module Formtastic
+ # Required for formtastic.css to be discoverable in the asset pipeline
+ # @private
+ class Engine < ::Rails::Engine
+ end
+end
@@ -1,23 +1,30 @@
# encoding: utf-8
module Formtastic
- # Copies formtastic.css and formtastic_changes.css to public/stylesheets/ and a config initializer
- # to config/initializers/formtastic_config.rb.
+ # Copies formtastic.css to public/stylesheets/ (Rails 3.0.x only) and a config initializer
+ # to config/initializers/formtastic.rb (all Rails versions).
#
# @example
# $ rails generate formtastic:install
#
- # @todo Revisit in Rails 3.1 where public assets are treated differently
+ # @todo Test with Rails 3.0
class InstallGenerator < Rails::Generators::Base
- desc "Copies formtastic.css and formtastic_changes.css to public/stylesheets/ and a config initializer to config/initializers/formtastic_config.rb"
-
+
source_root File.expand_path('../../../templates', __FILE__)
-
- def copy_files
- template 'formtastic.rb', 'config/initializers/formtastic.rb'
-
- template 'formtastic.css', 'public/stylesheets/formtastic.css'
- template 'formtastic_changes.css', 'public/stylesheets/formtastic_changes.css'
+
+ if ::Rails::VERSION::MAJOR == 3 && ::Rails::VERSION::MINOR >= 1
+ # Rails 3.1.x has the asset pipeline, no need to copy CSS files any more
+ desc "Copies a config initializer to config/initializers/formtastic.rb"
+ def copy_files
+ template 'formtastic.rb', 'config/initializers/formtastic.rb'
+ end
+ else
+ # Rails 3.0 doesn't have an asset pipeline, so we copy in CSS too
+ desc "Copies formtastic.css to public/stylesheets/ and a config initializer to config/initializers/formtastic.rb"
+ def copy_files
+ template 'formtastic.rb', 'config/initializers/formtastic.rb'
+ template '../../../app/assets/stylesheets/formtastic.css', 'public/stylesheets/formtastic.css'
+ end
end
end
end
@@ -42,7 +42,7 @@
# Formtastic::FormBuilder.inline_errors = :sentence
# Formtastic uses the following classes as default for hints, inline_errors and error list
-# If you override the class here, please ensure to override it in your formtastic_changes.css stylesheet as well
+# If you override the class here, please ensure to override it in your stylesheets as well
# Formtastic::FormBuilder.default_hint_class = "inline-hints"
# Formtastic::FormBuilder.default_inline_error_class = "inline-errors"
# Formtastic::FormBuilder.default_error_list_class = "errors"
@@ -1,14 +0,0 @@
-/* -------------------------------------------------------------------------------------------------
-
-Load this stylesheet after formtastic.css in your layouts to override the CSS to suit your needs.
-This will allow you to update formtastic.css with new releases without clobbering your own changes.
-
-For example, to make the inline hint paragraphs a little darker in color than the standard #666:
-
-form.formtastic fieldset > ol > li p.inline-hints { color:#333; }
-
-HINT:
-The following style may be *conditionally* included for improved support on older versions of IE(<8)
-form.formtastic fieldset ol li fieldset legend { margin-left: -6px;}
-
---------------------------------------------------------------------------------------------------*/

0 comments on commit 4f4b069

Please sign in to comment.