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 http://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 http://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 http://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