2007-01-28 02:16:55 -05:00
|
|
|
require 'action_view/helpers/tag_helper'
|
|
|
|
require 'action_view/helpers/prototype_helper'
|
2005-03-11 21:42:48 -05:00
|
|
|
|
2005-03-11 21:59:12 -05:00
|
|
|
module ActionView
|
|
|
|
module Helpers
|
2005-11-14 17:28:47 -05:00
|
|
|
# Provides functionality for working with JavaScript in your views.
|
2008-06-21 17:54:10 -04:00
|
|
|
#
|
2005-11-14 17:28:47 -05:00
|
|
|
# == Ajax, controls and visual effects
|
2008-06-21 17:54:10 -04:00
|
|
|
#
|
|
|
|
# * For information on using Ajax, see
|
2005-11-14 17:28:47 -05:00
|
|
|
# ActionView::Helpers::PrototypeHelper.
|
|
|
|
# * For information on using controls and visual effects, see
|
|
|
|
# ActionView::Helpers::ScriptaculousHelper.
|
2005-03-22 07:33:47 -05:00
|
|
|
#
|
2005-11-14 17:28:47 -05:00
|
|
|
# == Including the JavaScript libraries into your pages
|
2005-10-15 01:08:59 -04:00
|
|
|
#
|
2005-11-14 17:28:47 -05:00
|
|
|
# Rails includes the Prototype JavaScript framework and the Scriptaculous
|
|
|
|
# JavaScript controls and visual effects library. If you wish to use
|
|
|
|
# these libraries and their helpers (ActionView::Helpers::PrototypeHelper
|
|
|
|
# and ActionView::Helpers::ScriptaculousHelper), you must do one of the
|
|
|
|
# following:
|
2005-10-15 01:08:59 -04:00
|
|
|
#
|
2008-06-21 17:54:10 -04:00
|
|
|
# * Use <tt><%= javascript_include_tag :defaults %></tt> in the HEAD
|
|
|
|
# section of your page (recommended): This function will return
|
2005-11-14 17:28:47 -05:00
|
|
|
# references to the JavaScript files created by the +rails+ command in
|
|
|
|
# your <tt>public/javascripts</tt> directory. Using it is recommended as
|
2008-06-21 17:54:10 -04:00
|
|
|
# the browser can then cache the libraries instead of fetching all the
|
2005-11-14 17:28:47 -05:00
|
|
|
# functions anew on every request.
|
2008-06-21 17:54:10 -04:00
|
|
|
# * Use <tt><%= javascript_include_tag 'prototype' %></tt>: As above, but
|
2005-11-14 17:28:47 -05:00
|
|
|
# will only include the Prototype core library, which means you are able
|
2008-06-21 17:54:10 -04:00
|
|
|
# to use all basic AJAX functionality. For the Scriptaculous-based
|
|
|
|
# JavaScript helpers, like visual effects, autocompletion, drag and drop
|
2005-11-14 17:28:47 -05:00
|
|
|
# and so on, you should use the method described above.
|
2005-03-22 07:41:34 -05:00
|
|
|
#
|
2008-06-21 17:54:10 -04:00
|
|
|
# For documentation on +javascript_include_tag+ see
|
2005-11-14 17:28:47 -05:00
|
|
|
# ActionView::Helpers::AssetTagHelper.
|
|
|
|
module JavaScriptHelper
|
|
|
|
unless const_defined? :JAVASCRIPT_PATH
|
2005-03-20 19:57:08 -05:00
|
|
|
JAVASCRIPT_PATH = File.join(File.dirname(__FILE__), 'javascripts')
|
|
|
|
end
|
2006-04-19 14:08:15 -04:00
|
|
|
|
|
|
|
include PrototypeHelper
|
2008-06-21 17:54:10 -04:00
|
|
|
|
2008-07-16 08:00:36 -04:00
|
|
|
# Returns a link of the given +name+ that will trigger a JavaScript +function+ using the
|
2005-03-20 19:57:08 -05:00
|
|
|
# onclick handler and return false after the fact.
|
2005-03-12 12:00:03 -05:00
|
|
|
#
|
2008-07-16 08:00:36 -04:00
|
|
|
# The first argument +name+ is used as the link text.
|
|
|
|
#
|
|
|
|
# The next arguments are optional and may include the javascript function definition and a hash of html_options.
|
|
|
|
#
|
2006-04-19 14:08:15 -04:00
|
|
|
# The +function+ argument can be omitted in favor of an +update_page+
|
|
|
|
# block, which evaluates to a string when the template is rendered
|
2008-06-21 17:54:10 -04:00
|
|
|
# (instead of making an Ajax request first).
|
2006-04-19 14:08:15 -04:00
|
|
|
#
|
2008-07-16 08:00:36 -04:00
|
|
|
# The +html_options+ will accept a hash of html attributes for the link tag. Some examples are :class => "nav_button", :id => "articles_nav_button"
|
|
|
|
#
|
|
|
|
# Note: if you choose to specify the javascript function in a block, but would like to pass html_options, set the +function+ parameter to nil
|
|
|
|
#
|
|
|
|
#
|
2005-03-12 12:00:03 -05:00
|
|
|
# Examples:
|
|
|
|
# link_to_function "Greeting", "alert('Hello world!')"
|
2006-09-02 15:41:04 -04:00
|
|
|
# Produces:
|
|
|
|
# <a onclick="alert('Hello world!'); return false;" href="#">Greeting</a>
|
|
|
|
#
|
2006-04-19 14:08:15 -04:00
|
|
|
# link_to_function(image_tag("delete"), "if (confirm('Really?')) do_delete()")
|
2006-09-02 15:41:04 -04:00
|
|
|
# Produces:
|
|
|
|
# <a onclick="if (confirm('Really?')) do_delete(); return false;" href="#">
|
|
|
|
# <img src="/images/delete.png?" alt="Delete"/>
|
|
|
|
# </a>
|
|
|
|
#
|
2006-04-19 14:08:15 -04:00
|
|
|
# link_to_function("Show me more", nil, :id => "more_link") do |page|
|
|
|
|
# page[:details].visual_effect :toggle_blind
|
|
|
|
# page[:more_link].replace_html "Show me less"
|
|
|
|
# end
|
2006-09-02 15:41:04 -04:00
|
|
|
# Produces:
|
|
|
|
# <a href="#" id="more_link" onclick="try {
|
|
|
|
# $("details").visualEffect("toggle_blind");
|
|
|
|
# $("more_link").update("Show me less");
|
2008-06-21 17:54:10 -04:00
|
|
|
# }
|
|
|
|
# catch (e) {
|
|
|
|
# alert('RJS error:\n\n' + e.toString());
|
2006-09-02 15:41:04 -04:00
|
|
|
# alert('$(\"details\").visualEffect(\"toggle_blind\");
|
|
|
|
# \n$(\"more_link\").update(\"Show me less\");');
|
2008-06-21 17:54:10 -04:00
|
|
|
# throw e
|
2006-09-02 15:41:04 -04:00
|
|
|
# };
|
|
|
|
# return false;">Show me more</a>
|
|
|
|
#
|
2006-09-05 21:31:04 -04:00
|
|
|
def link_to_function(name, *args, &block)
|
2008-06-24 02:41:21 -04:00
|
|
|
html_options = args.extract_options!.symbolize_keys
|
2008-06-21 17:54:10 -04:00
|
|
|
|
|
|
|
function = block_given? ? update_page(&block) : args[0] || ''
|
|
|
|
onclick = "#{"#{html_options[:onclick]}; " if html_options[:onclick]}#{function}; return false;"
|
|
|
|
href = html_options[:href] || '#'
|
|
|
|
|
|
|
|
content_tag(:a, name, html_options.merge(:href => href, :onclick => onclick))
|
2005-03-11 21:59:12 -05:00
|
|
|
end
|
2008-06-21 17:54:10 -04:00
|
|
|
|
2008-07-16 08:00:36 -04:00
|
|
|
# Returns a button with the given +name+ text that'll trigger a JavaScript +function+ using the
|
2006-01-02 23:11:51 -05:00
|
|
|
# onclick handler.
|
|
|
|
#
|
2008-07-16 08:00:36 -04:00
|
|
|
# The first argument +name+ is used as the button's value or display text.
|
|
|
|
#
|
|
|
|
# The next arguments are optional and may include the javascript function definition and a hash of html_options.
|
|
|
|
#
|
2006-04-19 14:08:15 -04:00
|
|
|
# The +function+ argument can be omitted in favor of an +update_page+
|
|
|
|
# block, which evaluates to a string when the template is rendered
|
2008-06-21 17:54:10 -04:00
|
|
|
# (instead of making an Ajax request first).
|
2006-04-19 14:08:15 -04:00
|
|
|
#
|
2008-07-16 08:00:36 -04:00
|
|
|
# The +html_options+ will accept a hash of html attributes for the link tag. Some examples are :class => "nav_button", :id => "articles_nav_button"
|
|
|
|
#
|
|
|
|
# Note: if you choose to specify the javascript function in a block, but would like to pass html_options, set the +function+ parameter to nil
|
|
|
|
#
|
2006-01-02 23:11:51 -05:00
|
|
|
# Examples:
|
|
|
|
# button_to_function "Greeting", "alert('Hello world!')"
|
2006-04-19 14:08:15 -04:00
|
|
|
# button_to_function "Delete", "if (confirm('Really?')) do_delete()"
|
|
|
|
# button_to_function "Details" do |page|
|
|
|
|
# page[:details].visual_effect :toggle_slide
|
|
|
|
# end
|
2006-09-05 21:31:04 -04:00
|
|
|
# button_to_function "Details", :class => "details_button" do |page|
|
|
|
|
# page[:details].visual_effect :toggle_slide
|
|
|
|
# end
|
|
|
|
def button_to_function(name, *args, &block)
|
2008-06-24 02:41:21 -04:00
|
|
|
html_options = args.extract_options!.symbolize_keys
|
2008-06-21 17:54:10 -04:00
|
|
|
|
|
|
|
function = block_given? ? update_page(&block) : args[0] || ''
|
|
|
|
onclick = "#{"#{html_options[:onclick]}; " if html_options[:onclick]}#{function};"
|
|
|
|
|
|
|
|
tag(:input, html_options.merge(:type => 'button', :value => name, :onclick => onclick))
|
2006-01-02 23:11:51 -05:00
|
|
|
end
|
2005-03-11 21:42:48 -05:00
|
|
|
|
2008-06-21 17:54:10 -04:00
|
|
|
JS_ESCAPE_MAP = {
|
|
|
|
'\\' => '\\\\',
|
|
|
|
'</' => '<\/',
|
|
|
|
"\r\n" => '\n',
|
|
|
|
"\n" => '\n',
|
|
|
|
"\r" => '\n',
|
|
|
|
'"' => '\\"',
|
|
|
|
"'" => "\\'" }
|
|
|
|
|
2005-06-29 04:09:00 -04:00
|
|
|
# Escape carrier returns and single and double quotes for JavaScript segments.
|
2005-03-20 19:57:08 -05:00
|
|
|
def escape_javascript(javascript)
|
2008-06-21 17:54:10 -04:00
|
|
|
if javascript
|
|
|
|
javascript.gsub(/(\\|<\/|\r\n|[\n\r"'])/) { JS_ESCAPE_MAP[$1] }
|
|
|
|
else
|
|
|
|
''
|
|
|
|
end
|
2005-03-20 19:57:08 -05:00
|
|
|
end
|
2005-03-26 09:03:55 -05:00
|
|
|
|
2005-06-29 04:09:00 -04:00
|
|
|
# Returns a JavaScript tag with the +content+ inside. Example:
|
2006-10-08 20:15:28 -04:00
|
|
|
# javascript_tag "alert('All is good')"
|
|
|
|
#
|
|
|
|
# Returns:
|
|
|
|
# <script type="text/javascript">
|
|
|
|
# //<![CDATA[
|
|
|
|
# alert('All is good')
|
|
|
|
# //]]>
|
|
|
|
# </script>
|
2006-10-08 20:50:11 -04:00
|
|
|
#
|
|
|
|
# +html_options+ may be a hash of attributes for the <script> tag. Example:
|
2008-06-21 17:54:10 -04:00
|
|
|
# javascript_tag "alert('All is good')", :defer => 'defer'
|
2007-09-15 17:34:25 -04:00
|
|
|
# # => <script defer="defer" type="text/javascript">alert('All is good')</script>
|
|
|
|
#
|
|
|
|
# Instead of passing the content as an argument, you can also use a block
|
|
|
|
# in which case, you pass your +html_options+ as the first parameter.
|
|
|
|
# <% javascript_tag :defer => 'defer' do -%>
|
|
|
|
# alert('All is good')
|
|
|
|
# <% end -%>
|
|
|
|
def javascript_tag(content_or_options_with_block = nil, html_options = {}, &block)
|
2008-06-06 20:59:41 -04:00
|
|
|
content =
|
|
|
|
if block_given?
|
|
|
|
html_options = content_or_options_with_block if content_or_options_with_block.is_a?(Hash)
|
|
|
|
capture(&block)
|
|
|
|
else
|
|
|
|
content_or_options_with_block
|
|
|
|
end
|
|
|
|
|
2008-06-21 17:54:10 -04:00
|
|
|
tag = content_tag(:script, javascript_cdata_section(content), html_options.merge(:type => Mime::JS))
|
2007-09-15 17:34:25 -04:00
|
|
|
|
2008-06-21 17:54:10 -04:00
|
|
|
if block_called_from_erb?(block)
|
|
|
|
concat(tag)
|
|
|
|
else
|
|
|
|
tag
|
|
|
|
end
|
2005-06-26 08:03:43 -04:00
|
|
|
end
|
|
|
|
|
2005-10-12 18:47:39 -04:00
|
|
|
def javascript_cdata_section(content) #:nodoc:
|
|
|
|
"\n//#{cdata_section("\n#{content}\n//")}\n"
|
|
|
|
end
|
2008-06-21 17:54:10 -04:00
|
|
|
|
2005-11-14 17:28:47 -05:00
|
|
|
protected
|
2005-06-26 08:03:43 -04:00
|
|
|
def options_for_javascript(options)
|
2008-06-21 17:54:10 -04:00
|
|
|
if options.empty?
|
|
|
|
'{}'
|
|
|
|
else
|
|
|
|
"{#{options.keys.map { |k| "#{k}:#{options[k]}" }.sort.join(', ')}}"
|
|
|
|
end
|
2005-06-26 08:03:43 -04:00
|
|
|
end
|
2008-06-21 17:54:10 -04:00
|
|
|
|
2005-07-17 05:15:41 -04:00
|
|
|
def array_or_string_for_javascript(option)
|
2008-06-21 17:54:10 -04:00
|
|
|
if option.kind_of?(Array)
|
2005-07-17 05:15:41 -04:00
|
|
|
"['#{option.join('\',\'')}']"
|
|
|
|
elsif !option.nil?
|
|
|
|
"'#{option}'"
|
|
|
|
end
|
|
|
|
end
|
2005-03-11 21:42:48 -05:00
|
|
|
end
|
2005-03-11 21:59:12 -05:00
|
|
|
end
|
2005-03-14 07:47:38 -05:00
|
|
|
end
|