Module: BivouacHelpers::ScriptAculoUsView

Defined in:
lib/bivouac/helpers/view/goh/scriptaculous.rb

Constant Summary collapse

TOGGLE_EFFECTS = 
[:toggle_appear, :toggle_slide, :toggle_blind]

Instance Method Summary collapse

Instance Method Details

#draggable_element(element_id, options = {}) ⇒ Object

Makes the element with the DOM ID specified by element_id draggable.

Example:

draggable_element("my_image", :revert => true)

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



98
99
100
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 98

def draggable_element(element_id, options = {})
  javascript_tag(draggable_element_js(element_id, options) + ";\n")
end

#draggable_element_js(element_id, options = {}) ⇒ Object

:nodoc:



102
103
104
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 102

def draggable_element_js(element_id, options = {}) #:nodoc:
  %(new Draggable(#{element_id.inspect}, #{options_for_javascript(options)}))
end

#drop_receiving_element(element_id, options = {}) ⇒ Object

Makes the element with the DOM ID specified by element_id receive dropped draggable elements (created by draggable_element). and make an AJAX call. By default, the action called gets the DOM ID of the element as parameter.

Example:

drop_receiving_element("my_cart", :onDrop => {
  :url => R(CartAdd),
  :update => 'drop-info'
} )

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



119
120
121
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 119

def drop_receiving_element(element_id, options = {})
  javascript_tag(drop_receiving_element_js(element_id, options) + ";\n")
end

#drop_receiving_element_js(element_id, options = {}) ⇒ Object

:nodoc:



123
124
125
126
127
128
129
130
131
132
133
134
135
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 123

def drop_receiving_element_js(element_id, options = {}) #:nodoc:
  if options[:onDrop].is_a?( Hash)
    options[:onDrop][:with] = "'id=' + encodeURIComponent(element.id)"
    options[:onDrop] = "function(element){" + remote_function(options[:onDrop]) + "}"
  elsif options[:onDrop].is_a?( String )
    options[:onDrop] = "function(){" + options[:onDrop] + ";}"
  end

  options[:accept] = array_or_string_for_javascript(options[:accept]) if options[:accept]    
  options[:hoverclass] = "'#{options[:hoverclass]}'" if options[:hoverclass]
  
  %(Droppables.add(#{element_id.inspect}, #{options_for_javascript(options)}))
end

#sortable_element(element_id, options = {}) ⇒ Object

Makes the element with the DOM ID specified by element_id sortable by drag-and-drop and make an Ajax call whenever the sort order has changed. By default, the action called gets the serialized sortable element as parameters.

See script.aculo.us for avalaible options.

If you wan’t to use onChange and/or onUpdate you can pass a javascript string or a Hash, if you want to call a remote function.

Important: For this to work, the elements contained in your Sortable must have id attributes in the following form:

id="string_identifier"

Example:

ul( :id => 'my_list' ) do
  li "Google", :id => "crawler_1"
  li "Yahoo", :id => "crawler_2"
  li "Accoona", :id => "crawler_3"
  li "Ask.com", :id => "crawler_4"
  li "Baidu", :id => "crawler_5"
  li "Exalead", :id => "crawler_6"
  li "Voila", :id => "crawler_7"
  li "Lycos", :id => "crawler_8"
end
sortable_element( 'my_list', 
  :onChange => { 
    :url => R(SaveListOrder), 
    :success => visual_effect( :highlight, 'my_list' ) 
  } 
)



58
59
60
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 58

def sortable_element( element_id, options = {} )
  javascript_tag( sortable_element_js( element_id, options ) + ";\n" )
end

#sortable_element_js(element_id, options = {}) ⇒ Object

:nodoc:



62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 62

def sortable_element_js( element_id, options = {} ) #:nodoc:
  if options[:onUpdate].is_a?( Hash )
    options[:onUpdate][:with] ||= "Sortable.serialize('#{element_id}')"
    options[:onUpdate] = "function(){" + remote_function(options[:onUpdate]) + "}"
  elsif options[:onUpdate].is_a?( String )
    options[:onUpdate] = "function(){" + options[:onUpdate] + ";}"
  end
  
  if options[:onChange].is_a?( Hash )
    options[:onChange][:with] ||= "Sortable.serialize('#{element_id}')"
    options[:onChange] = "function(){" + remote_function(options[:onChange]) + "}"
  elsif options[:onChange].is_a?( String )
    options[:onChange] = "function(){" + options[:onChange] + ";}"
  end

  [:tag, :overlap, :constraint, :handle].each do |option|
    options[option] = "'#{options[option]}'" if options[option]
  end

  options[:containment] = array_or_string_for_javascript(options[:containment]) if options[:containment]
  options[:only] = array_or_string_for_javascript(options[:only]) if options[:only]
  
  %(Sortable.create(#{element_id.inspect}, #{options_for_javascript(options)}))
end

#unsortable_element_js(element_id) ⇒ Object

:nodoc:



87
88
89
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 87

def unsortable_element_js( element_id ) #:nodoc:
  %(Sortable.destroy(#{element_id.inspect}))
end

#visual_effect(name, element_id = false, js_options = {}) ⇒ Object

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



11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
 
# File 'lib/bivouac/helpers/view/goh/scriptaculous.rb', line 11

def visual_effect(name, element_id = false, js_options = {})
  element = element_id ? element_id : "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]

  if TOGGLE_EFFECTS.include? name.to_sym
    %(Effect.toggle(#{element.inspect},'#{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