edifice-forms 0.4.0 → 0.5.0

data/README.md

@@ -1,10 +1,27 @@
 Unobtrusive Javascript Form Extensions for Rails 3
 ==================================================
 
-edifice-forms the part of the [edifice project](https://github.com/tmeasday/edifice) which improves your experience with forms inside rails.
+Edifice-widgets is a companion gem to [edifice](/tmeasday/edifice) which improves and simplifies your experience writing forms for rails.
 
 Note that it does not depend on edifice, although it complements it well.
 
+Installation
+------------
+
+To install, simply add to your Gemfile:
+
+```ruby
+gem 'edifice-forms'
+```
+
+To include the javascript, add to your application.js:
+
+```js
+/*
+ *= require edifice-forms
+ */
+```
+
 Extending remote forms to handle errors
 ---------------------------------------
 
@@ -105,9 +122,11 @@ class Feedback < Edifice::Forms::FormModel
   validates :email, :presence => true, :format => {:with => /^.+@.+\..+$/}
   validates :message, :presence => true
   
+  after_save :deliver_feedback
+  
   # if validations pass and we successfully save, go ahead and deliver the 
   # feedback email to us, so we can read it.
-  def save
+  def deliver_feedback
     SelfMailer.feedback(self).deliver
   end
 end
@@ -143,4 +162,4 @@ Simple, huh?
 License
 -------
 
-Edifice is crafted by [Percolate Studio](http://percolatestudio.com) and released under the [MIT license](www.opensource.org/licenses/MIT)
+[Edifice](http://edifice-rails.com) is crafted by [Percolate Studio](http://percolatestudio.com) and released under the [MIT license](www.opensource.org/licenses/MIT)

data/Rakefile

@@ -1,3 +1,9 @@
 require 'rubygems'
 require 'bundler'
 Bundler::GemHelper.install_tasks
+
+require 'rspec/core/rake_task'
+RSpec::Core::RakeTask.new(:spec)
+
+task :test => :spec
+task :default => :spec

data/app/assets/javascripts/edifice-forms/jquery-escape.js

@@ -0,0 +1,15 @@
+// jquery.escape 1.0 - escape strings for use in jQuery selectors
+// http://ianloic.com/tag/jquery.escape
+// Copyright 2009 Ian McKellar <http://ian.mckellar.org/>
+// Just like jQuery you can use it under either the MIT license or the GPL
+// (see: http://docs.jquery.com/License)
+(function() {
+escape_re = /[#;&,\.\+\*~':"!\^\$\[\]\(\)=>|\/\\]/;
+jQuery.escape = function jQuery$escape(s) {
+  var left = s.split(escape_re, 1)[0];
+  if (left == s) return s;
+  return left + '\\' + 
+    s.substr(left.length, 1) + 
+    jQuery.escape(s.substr(left.length+1));
+}
+})();

data/app/assets/javascripts/edifice-forms/rails_form.js

@@ -16,7 +16,7 @@ $.fn.rails_form = function(method) {
 // in these 'this' is the $form
 var methods = {
   fields: function() {
-    return this.find('input, textarea, select');
+    return this.find('input:not([type=hidden]):not([type=submit]), textarea, select');
   },
   
   field: function(name_or_field) {

data/app/assets/javascripts/edifice-forms/show-errors.js

@@ -14,7 +14,15 @@
         
       } else if (/json/.test(contentType)) {
         // we will be receiving an error object back, we can pass it straight into rails_form.js
-        $(this).rails_form('set_errors', $.parseJSON(request.responseText));
+        $('body').append('<pre>' + request.responseText + '</pre>');
+        var errors = $.parseJSON(request.responseText);
+        
+        // they are using namespaced JSON
+        if ('errors' in errors && !$.isArray(errors['errors'])) {
+          errors = errors['errors']
+        }
+        
+        $(this).rails_form('set_errors', errors);
       } else {
         throw "edifice-forms/show-errors: Don't know how to handle dataType " + request.dataType;
       }

data/edifice-forms.gemspec

@@ -7,7 +7,8 @@ Gem::Specification.new do |s|
   s.platform = Gem::Platform::RUBY
   s.author  = 'Tom Coleman'
   s.email   = 'tom@percolatestudio.com'
-  s.summary = 'Unobtrusive JS Form extensions'
+  s.summary = 'Unobtrusive Rails JS Form extensions'
+  s.description = 'Edifice-widgets is a companion gem to edifice which improves and simplifies your experience writing forms for rails.'
 
   s.add_dependency 'jquery-rails'
 
@@ -15,4 +16,9 @@ Gem::Specification.new do |s|
   s.test_files    = `git ls-files -- {test,spec,features}/*`.split("\n")
   s.executables   = `git ls-files -- bin/*`.split("\n").map{ |f| File.basename(f) }
   s.require_paths = ["lib"]
+  
+  s.add_development_dependency 'rake'
+  s.add_development_dependency 'rails'
+  s.add_development_dependency 'rspec-rails'
+  s.add_development_dependency 'capybara'
 end

data/lib/edifice-forms/responder.rb

@@ -4,14 +4,15 @@ module Edifice
     class Responder < ActionController::Responder
     protected 
       # add the :u_e header to xhr error requests
-      def to_html
+      def navigation_behavior(error)
+        ::Rails.logger.warn '>>>>>>> has_errors? is: ' + (has_errors? ? 'true' : 'false')
         if controller.request.xhr? && !get? and has_errors? && default_action
           render :action => default_action, :status => :unprocessable_entity, :layout => nil
         else
-          super
+          super(error)
         end
       end
-    
+      
       # actually render something on successful updates
       def to_format
         unless get? or has_errors? or post?

data/lib/edifice-forms/version.rb

@@ -1,5 +1,5 @@
 module Edifice
   module Forms
-    VERSION = "0.4.0"
+    VERSION = "0.5.0"
   end
 end

data/spec/error_handling_spec.rb

@@ -0,0 +1,54 @@
+require File.dirname(__FILE__) + '/spec_helper'
+
+shared_examples_for :form_that_shows_errors do
+  it "should show errors when validation fails" do
+    page.click_button('Submit')
+    
+    page.should have_error_on 'user_name'
+  end
+  
+  it "should show errors when validation fails in .errors" do
+    page.click_button('Submit')
+    
+    page.should have_rendered_error_on 'user_name'
+  end
+  
+  it "not change when validation succeeds" do
+    page.fill_in 'Name', :with => 'whatever'
+    page.click_button('Submit')
+    
+    page.should have_no_error_on 'user_name'
+  end
+end
+
+describe 'html forms with show_errors', :type => :request, :js => true do
+  before(:each) do
+    page.visit('/users/new?type=html&ajax=false')
+  end
+  
+  it_behaves_like :form_that_shows_errors
+end
+
+describe 'json forms with show_errors', :type => :request, :js => true do
+  before(:each) do
+    page.visit('/users/new?type=json&ajax=false')
+  end
+  
+  it_behaves_like :form_that_shows_errors
+end
+
+describe 'ajax html forms with show_errors', :type => :request, :js => true do
+  before(:each) do
+    page.visit('/users/new?type=html&ajax=true')
+  end
+  
+  it_behaves_like :form_that_shows_errors
+end
+
+describe 'ajax json forms with show_errors', :type => :request, :js => true do
+  before(:each) do
+    page.visit('/users/new?type=json&ajax=true')
+  end
+  
+  it_behaves_like :form_that_shows_errors
+end

data/spec/form_model_spec.rb

@@ -0,0 +1,25 @@
+require File.dirname(__FILE__) + '/spec_helper'
+
+describe UsersController do
+  include RSpec::Rails::ControllerExampleGroup
+  
+  it 'should return new' do
+    get 'new'
+    
+    response.should render_template(:new)
+  end
+  
+  it 'should behave correctly on validation errors' do
+    post 'create', :user => {:name => ''}
+    
+    response.should render_template(:new)
+  end
+  
+  it 'should update successfully' do
+    User.should_receive(:model_saved)
+    
+    post 'create', :user => {:name => 'a lengthy name'}
+    
+    response.should redirect_to(users_path)
+  end
+end

data/spec/rails3.1/app/assets/javascripts/application.js

@@ -0,0 +1,10 @@
+// This is a manifest file that'll be compiled into including all the files listed below.
+// Add new JavaScript/Coffee code in separate files in this directory and they'll automatically
+// be included in the compiled file accessible from http://example.com/assets/application.js
+// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+// the compiled file.
+//
+//= require jquery
+//= require jquery_ujs
+//= require edifice-forms
+//= require_tree .

data/spec/rails3.1/app/assets/javascripts/test/base.js

@@ -0,0 +1,11 @@
+(function($) {
+  window.testBase = {
+    onReady: function() {
+      $('body').append('<h1 class="ready">');
+    },
+    
+    onLoad: function() {
+      $('body').append('<h1 class="load">');
+    }
+  }
+}(jQuery));

data/spec/rails3.1/app/assets/javascripts/vendor/jquery-pjax.js

@@ -0,0 +1,264 @@
+// jquery.pjax.js
+// copyright chris wanstrath
+// https://github.com/defunkt/jquery-pjax
+
+(function($){
+
+// When called on a link, fetches the href with ajax into the
+// container specified as the first parameter or with the data-pjax
+// attribute on the link itself.
+//
+// Tries to make sure the back button and ctrl+click work the way
+// you'd expect.
+//
+// Accepts a jQuery ajax options object that may include these
+// pjax specific options:
+//
+// container - Where to stick the response body. Usually a String selector.
+//             $(container).html(xhr.responseBody)
+//      push - Whether to pushState the URL. Defaults to true (of course).
+//   replace - Want to use replaceState instead? That's cool.
+//
+// For convenience the first parameter can be either the container or
+// the options object.
+//
+// Returns the jQuery object
+$.fn.pjax = function( container, options ) {
+  if ( options )
+    options.container = container
+  else
+    options = $.isPlainObject(container) ? container : {container:container}
+
+  // We can't persist $objects using the history API so we must use
+  // a String selector. Bail if we got anything else.
+  if ( options.container && typeof options.container !== 'string' ) {
+    throw "pjax container must be a string selector!"
+    return false
+  }
+
+  return this.live('click', function(event){
+    // Middle click, cmd click, and ctrl click should open
+    // links in a new tab as normal.
+    if ( event.which > 1 || event.metaKey )
+      return true
+
+    var defaults = {
+      url: this.href,
+      container: $(this).attr('data-pjax'),
+      clickedElement: $(this),
+      fragment: null
+    }
+
+    $.pjax($.extend({}, defaults, options))
+
+    event.preventDefault()
+  })
+}
+
+
+// Loads a URL with ajax, puts the response body inside a container,
+// then pushState()'s the loaded URL.
+//
+// Works just like $.ajax in that it accepts a jQuery ajax
+// settings object (with keys like url, type, data, etc).
+//
+// Accepts these extra keys:
+//
+// container - Where to stick the response body. Must be a String.
+//             $(container).html(xhr.responseBody)
+//      push - Whether to pushState the URL. Defaults to true (of course).
+//   replace - Want to use replaceState instead? That's cool.
+//
+// Use it just like $.ajax:
+//
+//   var xhr = $.pjax({ url: this.href, container: '#main' })
+//   console.log( xhr.readyState )
+//
+// Returns whatever $.ajax returns.
+var pjax = $.pjax = function( options ) {
+  var $container = $(options.container),
+      success = options.success || $.noop
+
+  // We don't want to let anyone override our success handler.
+  delete options.success
+
+  // We can't persist $objects using the history API so we must use
+  // a String selector. Bail if we got anything else.
+  if ( typeof options.container !== 'string' )
+    throw "pjax container must be a string selector!"
+
+  options = $.extend(true, {}, pjax.defaults, options)
+
+  if ( $.isFunction(options.url) ) {
+    options.url = options.url()
+  }
+
+  options.context = $container
+
+  options.success = function(data){
+    if ( options.fragment ) {
+      // If they specified a fragment, look for it in the response
+      // and pull it out.
+      var $fragment = $(data).find(options.fragment)
+      if ( $fragment.length )
+        data = $fragment.children()
+      else
+        return window.location = options.url
+    } else {
+        // If we got no data or an entire web page, go directly
+        // to the page and let normal error handling happen.
+        if ( !$.trim(data) || /<html/i.test(data) )
+          return window.location = options.url
+    }
+
+    // Make it happen.
+    this.html(data)
+
+    // If there's a <title> tag in the response, use it as
+    // the page's title.
+    var oldTitle = document.title,
+        title = $.trim( this.find('title').remove().text() )
+    if ( title ) document.title = title
+
+    // No <title>? Fragment? Look for data-title and title attributes.
+    if ( !title && options.fragment ) {
+      title = $fragment.attr('title') || $fragment.data('title')
+    }
+
+    var state = {
+      pjax: options.container,
+      fragment: options.fragment,
+      timeout: options.timeout
+    }
+
+    // If there are extra params, save the complete URL in the state object
+    var query = $.param(options.data)
+    if ( query != "_pjax=true" )
+      state.url = options.url + (/\?/.test(options.url) ? "&" : "?") + query
+
+    if ( options.replace ) {
+      window.history.replaceState(state, document.title, options.url)
+    } else if ( options.push ) {
+      // this extra replaceState before first push ensures good back
+      // button behavior
+      if ( !pjax.active ) {
+        window.history.replaceState($.extend({}, state, {url:null}), oldTitle)
+        pjax.active = true
+      }
+
+      window.history.pushState(state, document.title, options.url)
+    }
+
+    // Google Analytics support
+    if ( (options.replace || options.push) && window._gaq )
+      _gaq.push(['_trackPageview'])
+
+    // If the URL has a hash in it, make sure the browser
+    // knows to navigate to the hash.
+    var hash = window.location.hash.toString()
+    if ( hash !== '' ) {
+      window.location.href = hash
+    }
+
+    // Invoke their success handler if they gave us one.
+    success.apply(this, arguments)
+  }
+
+  // Cancel the current request if we're already pjaxing
+  var xhr = pjax.xhr
+  if ( xhr && xhr.readyState < 4) {
+    xhr.onreadystatechange = $.noop
+    xhr.abort()
+  }
+
+  pjax.options = options
+  pjax.xhr = $.ajax(options)
+  $(document).trigger('pjax', [pjax.xhr, options])
+
+  return pjax.xhr
+}
+
+
+pjax.defaults = {
+  timeout: 650,
+  push: true,
+  replace: false,
+  // We want the browser to maintain two separate internal caches: one for
+  // pjax'd partial page loads and one for normal page loads. Without
+  // adding this secret parameter, some browsers will often confuse the two.
+  data: { _pjax: true },
+  type: 'GET',
+  dataType: 'html',
+  beforeSend: function(xhr){
+    this.trigger('pjax:start', [xhr, pjax.options])
+    // start.pjax is deprecated
+    this.trigger('start.pjax', [xhr, pjax.options])
+    xhr.setRequestHeader('X-PJAX', 'true')
+  },
+  error: function(xhr, textStatus, errorThrown){
+    if ( textStatus !== 'abort' )
+      window.location = pjax.options.url
+  },
+  complete: function(xhr){
+    this.trigger('pjax:end', [xhr, pjax.options])
+    // end.pjax is deprecated
+    this.trigger('end.pjax', [xhr, pjax.options])
+  }
+}
+
+
+// Used to detect initial (useless) popstate.
+// If history.state exists, assume browser isn't going to fire initial popstate.
+var popped = ('state' in window.history), initialURL = location.href
+
+
+// popstate handler takes care of the back and forward buttons
+//
+// You probably shouldn't use pjax on pages with other pushState
+// stuff yet.
+$(window).bind('popstate', function(event){
+  // Ignore inital popstate that some browsers fire on page load
+  var initialPop = !popped && location.href == initialURL
+  popped = true
+  if ( initialPop ) return
+
+  var state = event.state
+
+  if ( state && state.pjax ) {
+    var container = state.pjax
+    if ( $(container+'').length )
+      $.pjax({
+        url: state.url || location.href,
+        fragment: state.fragment,
+        container: container,
+        push: false,
+        timeout: state.timeout
+      })
+    else
+      window.location = location.href
+  }
+})
+
+
+// Add the state property to jQuery's event object so we can use it in
+// $(window).bind('popstate')
+if ( $.inArray('state', $.event.props) < 0 )
+  $.event.props.push('state')
+
+
+// Is pjax supported by this browser?
+$.support.pjax =
+  window.history && window.history.pushState && window.history.replaceState
+  // pushState isn't reliable on iOS yet.
+  && !navigator.userAgent.match(/(iPod|iPhone|iPad|WebApps\/.+CFNetwork)/)
+
+
+// Fall back to normalcy for older browsers.
+if ( !$.support.pjax ) {
+  $.pjax = function( options ) {
+    window.location = $.isFunction(options.url) ? options.url() : options.url
+  }
+  $.fn.pjax = function() { return this }
+}
+
+})(jQuery);

data/spec/rails3.1/app/assets/stylesheets/application.css

@@ -0,0 +1,7 @@
+/*
+ * This is a manifest file that'll automatically include all the stylesheets available in this directory
+ * and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
+ * the top of the compiled file, but it's generally better to create a new file per style scope.
+ *= require_self
+ *= require_tree . 
+*/

data/spec/rails3.1/app/controllers/application_controller.rb

@@ -0,0 +1,3 @@
+class ApplicationController < ActionController::Base
+  protect_from_forgery
+end

data/spec/rails3.1/app/controllers/users_controller.rb

@@ -0,0 +1,18 @@
+class UsersController < ApplicationController
+  respond_to :html, :json
+  
+  def new
+    @type = params[:type] || 'html'
+    @ajax = params[:ajax] || false
+    
+    respond_with @user = User.new
+  end
+  
+  def create
+    respond_with @user = User.create(params[:user])
+  end
+  
+  def index
+    head :ok
+  end
+end

data/spec/rails3.1/app/models/user.rb

@@ -0,0 +1,15 @@
+class User < Edifice::Forms::FormModel
+  attr_accessor :name, :location, :description
+    
+  validates :name, :length => {:minimum => 3}, :presence => true
+  
+  after_save :log_save
+  
+  def log_save
+    User.model_saved
+  end
+  
+  # this is just here so we can easily test for it.
+  def self.model_saved
+  end
+end

data/spec/rails3.1/app/views/layouts/application.html.erb

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Rails31</title>
+  <%= stylesheet_link_tag    "application" %>
+  <%= javascript_include_tag "application" %>
+  <%= csrf_meta_tags %>
+</head>
+<body>
+
+<%= yield %>
+
+</body>
+</html>

data/spec/rails3.1/app/views/users/new.html.erb

@@ -0,0 +1,15 @@
+<%= form_for @user, :remote => @ajax, 
+      :html => {:'data-form' => 'show_errors', :'data-type' => @type} do |f| %>
+  <%= render_errors(f) %>
+  
+  <%= f.label :name %>
+  <%= f.text_field :name %>
+
+  <%= f.label :location %>
+  <%= f.text_field :location %>
+
+  <%= f.label :description %>
+  <%= f.text_field :description %>
+  
+  <button type="submit">Submit</button>
+<% end %>

data/spec/rails3.1/config/application.rb

@@ -0,0 +1,55 @@
+require File.expand_path('../boot', __FILE__)
+
+require "action_controller/railtie"
+require "sprockets/railtie"
+
+require 'jquery-rails'
+require 'edifice-forms'
+
+if defined?(Bundler)
+  # If you precompile assets before deploying to production, use this line
+  Bundler.require(*Rails.groups(:assets => %w(development test)))
+  # If you want your assets lazily compiled in production, use this line
+  # Bundler.require(:default, :assets, Rails.env)
+end
+
+module Rails31
+  class Application < Rails::Application
+    # don't know how i was supposed to set this
+    config.root = ENV['RAILS_ROOT']
+    
+    # Settings in config/environments/* take precedence over those specified here.
+    # Application configuration should go into files in config/initializers
+    # -- all .rb files in that directory are automatically loaded.
+
+    # Custom directories with classes and modules you want to be autoloadable.
+    # config.autoload_paths += %W(#{config.root}/extras)
+
+    # Only load the plugins named here, in the order given (default is alphabetical).
+    # :all can be used as a placeholder for all plugins not explicitly named.
+    # config.plugins = [ :exception_notification, :ssl_requirement, :all ]
+
+    # Activate observers that should always be running.
+    # config.active_record.observers = :cacher, :garbage_collector, :forum_observer
+
+    # Set Time.zone default to the specified zone and make Active Record auto-convert to this zone.
+    # Run "rake -D time" for a list of tasks for finding time zone names. Default is UTC.
+    # config.time_zone = 'Central Time (US & Canada)'
+
+    # The default locale is :en and all translations from config/locales/*.rb,yml are auto loaded.
+    # config.i18n.load_path += Dir[Rails.root.join('my', 'locales', '*.{rb,yml}').to_s]
+    # config.i18n.default_locale = :de
+
+    # Configure the default encoding used in templates for Ruby 1.9.
+    config.encoding = "utf-8"
+
+    # Configure sensitive parameters which will be filtered from the log file.
+    config.filter_parameters += [:password]
+
+    # Enable the asset pipeline
+    config.assets.enabled = true
+
+    # Version of your assets, change this if you want to expire all your assets
+    config.assets.version = '1.0'
+  end
+end

data/spec/rails3.1/config/boot.rb

@@ -0,0 +1,6 @@
+require 'rubygems'
+
+# Set up gems listed in the Gemfile.
+ENV['BUNDLE_GEMFILE'] ||= File.expand_path('../../Gemfile', __FILE__)
+
+require 'bundler/setup' if File.exists?(ENV['BUNDLE_GEMFILE'])

data/spec/rails3.1/config/environment.rb

@@ -0,0 +1,5 @@
+# Load the rails application
+require File.expand_path('../application', __FILE__)
+
+# Initialize the rails application
+Rails31::Application.initialize!