public Method

ScriptaculousHelper.visual_effect(name, element_id = false, js_options = {})

Returns a JavaScript snippet to be used on the Ajax callbacks for starting visual effects.

Example:

<%= link_to_remote "Reload", :update => "posts",
      :url => { :action => "reload" },
      :complete => visual_effect(:highlight, "posts", :duration => 0.5)

If no element_id is given, it assumes "element" which should be a local variable in the generated JavaScript execution context. This can be used for example with drop_receiving_element:

<%= drop_receiving_element (...), :loading => visual_effect(:fade) %>

This would fade the element that was dropped on the drop receiving element.

For toggling visual effects, you can use :toggle_appear, :toggle_slide, and :toggle_blind which will alternate between appear/fade, slidedown/slideup, and blinddown/blindup respectively.

You can change the behaviour with various options, see script.aculo.us for more documentation.

Source Code

# File action_view/helpers/scriptaculous_helper.rb, line 44
def visual_effect(name, element_id = false, js_options = {})
  element = element_id ? element_id.to_json : "element"

  js_options[:queue] = if js_options[:queue].is_a?(Hash)
    '{' + js_options[:queue].map {|k, v| k == :limit ? "#{k}:#{v}" : "#{k}:'#{v}'" }.join(',') + '}'
  elsif js_options[:queue]
    "'#{js_options[:queue]}'"
  end if js_options[:queue]

  [:endcolor, :direction, :startcolor, :scaleMode, :restorecolor].each do |option|
    js_options[option] = "'#{js_options[option]}'" if js_options[option]
  end

  if TOGGLE_EFFECTS.include? name.to_sym
    "Effect.toggle(#{element},'#{name.to_s.gsub(/^toggle_/,'')}',#{options_for_javascript(js_options)});"
  else
    "new Effect.#{name.to_s.camelize}(#{element},#{options_for_javascript(js_options)});"
  end
end
Comments

Have your say
Please use Textile formatting (click here for a cheat sheet). Use <code/> and <pre/> for code samples.
Click here to login with OpenID to to post comments.