Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

Import observe_field and observe_form

  • Loading branch information...
commit 7bf4ca4b4f5c917cedba372a31845da4c3d80d98 1 parent 2cf9d99
@josh josh authored
Showing with 144 additions and 3 deletions.
  1. +109 −0 lib/prototype_legacy_helper.rb
  2. +35 −3 test/test_prototype_legacy_helper.rb
View
109 lib/prototype_legacy_helper.rb
@@ -1,2 +1,111 @@
module PrototypeLegacyHelper
+ # Observes the field with the DOM ID specified by +field_id+ and calls a
+ # callback when its contents have changed. The default callback is an
+ # Ajax call. By default the value of the observed field is sent as a
+ # parameter with the Ajax call.
+ #
+ # Example:
+ # # Generates: new Form.Element.Observer('suggest', 0.25, function(element, value) {new Ajax.Updater('suggest',
+ # # '/testing/find_suggestion', {asynchronous:true, evalScripts:true, parameters:'q=' + value})})
+ # <%= observe_field :suggest, :url => { :action => :find_suggestion },
+ # :frequency => 0.25,
+ # :update => :suggest,
+ # :with => 'q'
+ # %>
+ #
+ # Required +options+ are either of:
+ # <tt>:url</tt>:: +url_for+-style options for the action to call
+ # when the field has changed.
+ # <tt>:function</tt>:: Instead of making a remote call to a URL, you
+ # can specify javascript code to be called instead.
+ # Note that the value of this option is used as the
+ # *body* of the javascript function, a function definition
+ # with parameters named element and value will be generated for you
+ # for example:
+ # observe_field("glass", :frequency => 1, :function => "alert('Element changed')")
+ # will generate:
+ # new Form.Element.Observer('glass', 1, function(element, value) {alert('Element changed')})
+ # The element parameter is the DOM element being observed, and the value is its value at the
+ # time the observer is triggered.
+ #
+ # Additional options are:
+ # <tt>:frequency</tt>:: The frequency (in seconds) at which changes to
+ # this field will be detected. Not setting this
+ # option at all or to a value equal to or less than
+ # zero will use event based observation instead of
+ # time based observation.
+ # <tt>:update</tt>:: Specifies the DOM ID of the element whose
+ # innerHTML should be updated with the
+ # XMLHttpRequest response text.
+ # <tt>:with</tt>:: A JavaScript expression specifying the parameters
+ # for the XMLHttpRequest. The default is to send the
+ # key and value of the observed field. Any custom
+ # expressions should return a valid URL query string.
+ # The value of the field is stored in the JavaScript
+ # variable +value+.
+ #
+ # Examples
+ #
+ # :with => "'my_custom_key=' + value"
+ # :with => "'person[name]=' + prompt('New name')"
+ # :with => "Form.Element.serialize('other-field')"
+ #
+ # Finally
+ # :with => 'name'
+ # is shorthand for
+ # :with => "'name=' + value"
+ # This essentially just changes the key of the parameter.
+ #
+ # Additionally, you may specify any of the options documented in the
+ # <em>Common options</em> section at the top of this document.
+ #
+ # Example:
+ #
+ # # Sends params: {:title => 'Title of the book'} when the book_title input
+ # # field is changed.
+ # observe_field 'book_title',
+ # :url => 'http://example.com/books/edit/1',
+ # :with => 'title'
+ #
+ #
+ def observe_field(field_id, options = {})
+ if options[:frequency] && options[:frequency] > 0
+ build_observer('Form.Element.Observer', field_id, options)
+ else
+ build_observer('Form.Element.EventObserver', field_id, options)
+ end
+ end
+
+ # Observes the form with the DOM ID specified by +form_id+ and calls a
+ # callback when its contents have changed. The default callback is an
+ # Ajax call. By default all fields of the observed field are sent as
+ # parameters with the Ajax call.
+ #
+ # The +options+ for +observe_form+ are the same as the options for
+ # +observe_field+. The JavaScript variable +value+ available to the
+ # <tt>:with</tt> option is set to the serialized form by default.
+ def observe_form(form_id, options = {})
+ if options[:frequency]
+ build_observer('Form.Observer', form_id, options)
+ else
+ build_observer('Form.EventObserver', form_id, options)
+ end
+ end
+
+ protected
+ def build_observer(klass, name, options = {})
+ if options[:with] && (options[:with] !~ /[\{=(.]/)
+ options[:with] = "'#{options[:with]}=' + encodeURIComponent(value)"
+ else
+ options[:with] ||= 'value' unless options[:function]
+ end
+
+ callback = options[:function] || remote_function(options)
+ javascript = "new #{klass}('#{name}', "
+ javascript << "#{options[:frequency]}, " if options[:frequency]
+ javascript << "function(element, value) {"
+ javascript << "#{callback}}"
+ javascript << ")"
+ javascript_tag(javascript)
+ end
end
View
38 test/test_prototype_legacy_helper.rb
@@ -1,8 +1,40 @@
require 'test/unit'
require 'prototype_legacy_helper'
-class TestPrototypeLegacyHelper < Test::Unit::TestCase
- def test_truth
- assert true
+class TestPrototypeLegacyHelper < ActionView::TestCase
+ def test_observe_form
+ assert_dom_equal %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Observer('cart', 2, function(element, value) {new Ajax.Request('http://www.example.com/cart_changed', {asynchronous:true, evalScripts:true, parameters:value})})\n//]]>\n</script>),
+ observe_form("cart", :frequency => 2, :url => { :action => "cart_changed" })
+ end
+
+ def test_observe_form_using_function_for_callback
+ assert_dom_equal %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Observer('cart', 2, function(element, value) {alert('Form changed')})\n//]]>\n</script>),
+ observe_form("cart", :frequency => 2, :function => "alert('Form changed')")
+ end
+
+ def test_observe_field
+ assert_dom_equal %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Element.Observer('glass', 300, function(element, value) {new Ajax.Request('http://www.example.com/reorder_if_empty', {asynchronous:true, evalScripts:true, parameters:value})})\n//]]>\n</script>),
+ observe_field("glass", :frequency => 5.minutes, :url => { :action => "reorder_if_empty" })
+ end
+
+ def test_observe_field_using_with_option
+ expected = %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Element.Observer('glass', 300, function(element, value) {new Ajax.Request('http://www.example.com/check_value', {asynchronous:true, evalScripts:true, parameters:'id=' + encodeURIComponent(value)})})\n//]]>\n</script>)
+ assert_dom_equal expected, observe_field("glass", :frequency => 5.minutes, :url => { :action => "check_value" }, :with => 'id')
+ assert_dom_equal expected, observe_field("glass", :frequency => 5.minutes, :url => { :action => "check_value" }, :with => "'id=' + encodeURIComponent(value)")
+ end
+
+ def test_observe_field_using_json_in_with_option
+ expected = %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Element.Observer('glass', 300, function(element, value) {new Ajax.Request('http://www.example.com/check_value', {asynchronous:true, evalScripts:true, parameters:{'id':value}})})\n//]]>\n</script>)
+ assert_dom_equal expected, observe_field("glass", :frequency => 5.minutes, :url => { :action => "check_value" }, :with => "{'id':value}")
+ end
+
+ def test_observe_field_using_function_for_callback
+ assert_dom_equal %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Element.Observer('glass', 300, function(element, value) {alert('Element changed')})\n//]]>\n</script>),
+ observe_field("glass", :frequency => 5.minutes, :function => "alert('Element changed')")
+ end
+
+ def test_observe_field_without_frequency
+ assert_dom_equal %(<script type=\"text/javascript\">\n//<![CDATA[\nnew Form.Element.EventObserver('glass', function(element, value) {new Ajax.Request('http://www.example.com/', {asynchronous:true, evalScripts:true, parameters:value})})\n//]]>\n</script>),
+ observe_field("glass")
end
end
Please sign in to comment.
Something went wrong with that request. Please try again.