Class: Mack::JavaScript::Framework::PrototypeSelector

Inherits:
Selector show all
Defined in:
lib/mack-javascript/helpers/prototype_helper.rb

Instance Attribute Summary

Attributes inherited from Selector

#session_id

Instance Method Summary collapse

Methods inherited from Selector

#add, #initialize, #to_s

Methods included from ViewHelpers::StringHelpers

#escape_javascript

Constructor Details

This class inherits a constructor from Mack::JavaScript::Selector

Instance Method Details

#add_class(klass) ⇒ Object

– Attributes –#



192
193
194
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 192

def add_class(klass)
  invoke ["addClassName", klass]
end

#all_next ⇒ Object

gets every next sibling for each element selected



180
181
182
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 180

def all_next
  invoke ["nextSiblings"], :flatten_uniq => true
end

#all_previous ⇒ Object

gets every previous sibling for each element selected



185
186
187
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 185

def all_previous
  invoke ["previousSiblings"], :flatten_uniq => true
end

#ancestors ⇒ Object

returns a collection of every parent up the chain to the root of the document for each selected element.



158
159
160
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 158

def ancestors
 invoke ["ancestors"], :flatten_uniq => true
end

#children ⇒ Object

Will give you the immediate children underneath the selected elements

Example: say you have the following html:

<div class=‘rakim’>

<ul>
  ...
</ul>

</div>

<div class=‘rakim’>

<p>Eric B</p>
<div id='technique'>
  ...
</div>

</div>

page.select(‘.rakim’).children would give you a collection consisting of the ul element, the p element, and the div with id ‘technique’



147
148
149
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 147

def children
 invoke ["childElements"], :flatten_uniq => true
end

#draggable(options = nil) ⇒ Object

github.com/madrobby/scriptaculous/wikis/draggable

:revert

if true, will revert after being dropped. ‘failure’

will instruct the draggable not to revert if 
successfully dropped in a droppable.
:ghosting

if true, will clone the element and drag the clone

:zindex

The css z-index of the draggable item.



403
404
405
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 403

def draggable(options = nil)
  each "new Draggable(elem, #{options_for_effects(options)})"
end

#droppable(options = nil, &block) ⇒ Object

:accept

if set to a css class, the selected elements will only accept elements dragged to it with that class.

:hoverclass

a droppable element will have this class added to it when an element is dragged over it.

:remote

takes a hash of ajax options, the same as given to page.ajax if this options is, an ajax call is made using the specified options along. Added to the url is an id parameter which has the id of the element that was dropped

if a block is given, the blocks code will be executed when a succesful drop is done.

Example

options = => {:url => ‘/stuff’} page.select(‘#bucket’).droppable options do |p|

p.alert('you dropped it!')

end

This code will make the element with id ‘bucket’ droppable. If an element is dropped onto it, an ajax call to the url ‘/stuff’ will be sent with an id parameter of the id of the dropped element. Then an js alert box with the message ‘you dropped it’ will appear.



434
435
436
437
438
439
440
441
442
443
444
445
446
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 434

def droppable(options = nil, &block)
  remote_options = options.delete(:remote)
  if remote_options || block_given?
    func =  Mack::JavaScript::Function.new(session_id, 'elem')
    if remote_options
	remote_options[:with] ||= "'id=' + elem.id"
	func << Mack::JavaScript::ScriptGenerator.new(session_id).ajax(remote_options)
end
func.body(&block) if block_given?
options.merge!(:onDrop => func)
  				end
  each "Droppables.add(elem, #{options_for_effects(options)})"
end

#each(func, options = {}) ⇒ Object 



119
120
121
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 119

def each(func, options = {})
  add "each(function(elem){#{func}})",  options
end

#effect(name, options = nil) ⇒ Object

Custom visual effects. Supports the following effect names: highlight, scale, opacity, move, fade, appear, blindUp, blindDown, slideUp, slideDown, dropOut, grow, shrink, puff, switchOff, squish, fold, pulsate, shake, scrollTo



340
341
342
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 340

def effect(name, options = nil)
  invoke ['visualEffect', name.to_s, options_for_effects(options)]
end

#hide ⇒ Object 



349
350
351
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 349

def hide()
  invoke ['hide']
end

#insert(position, html) ⇒ Object

:top

HTML is inserted inside the element, before the element’s existing content.

:bottom

HTML is inserted inside the element, after the element’s existing content.

:before

HTML is inserted immediately preceding the element.

:after

HTML is inserted immediately following the element.

Example

<div class=‘rakim’>

<ul>
  ...
</ul>

</div>

<div class=‘rakim’>

<p>Eric B</p>
<div id='technique'>
  ...
</div>

</div>

page.select(‘.rakim’).insert(:before, “<h1> The R </h1>”) would result in:

<h1> The R </h2> <div class=‘rakim’>

<ul>
  ...
</ul>

</div>

<h1> The R </h2> <div class=‘rakim’>

<p>Eric B</p>
<div id='technique'>
  ...
</div>

</div>

Tip: use this with a partial containing your html: page.select(‘.rakim’).insert(:before, render(:partial, ‘the_r’, :format => :html))



260
261
262
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 260

def insert(position, html)
  invoke ["insert", "{#{position.to_s}: '#{escape_javascript(html)}'}"]
end

#invoke(arr, options = {}) ⇒ Object 



106
107
108
109
110
111
112
113
114
115
116
117
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 106

def invoke(arr, options = {})
  arr.collect! do |arg| 
    if !arg.is_a?(String) || arg =~ /^function/ || arg =~ /^null$/ || arg =~ /^\{.*\}$/ 
      arg
    else
      "'#{arg}'"
    end
  end
  function = "invoke(#{arr.compact.join(',')})"
  function << '.flatten().uniq()' if options.delete(:flatten_uniq)
  add function, options
end

#morph(hsh, options = nil) ⇒ Object

linear, sinoidal, reverse, flicker, wobble, pulse, spring, none, full



332
333
334
335
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 332

def morph(hsh, options = nil)
 #hsh is an object of style values
 invoke ['morph', options_for_javascript(hsh), options_for_effects(options)]
end

#next(selector = nil) ⇒ Object

gets the next immediate sibling for each element selected Takes an optional selector as an argument



169
170
171
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 169

def next(selector = nil)
  invoke ["next", selector], :flatten_uniq => true
end

#parent ⇒ Object

returns a collection of the immediate parent of each selected element



152
153
154
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 152

def parent
 invoke ["up"], :flatten_uniq => true
end

#peep(event_name, options = {}, &block) ⇒ Object

adds an event listener to the selected elements. If options == true the default behavior of the event isn’t taken

Example

page.select(‘.rakim a’).peep ‘click’, :prevent_default => true do |p|

p.select('#sucka_mcs').effect(:fade)

end

After running this code, if you click any a tag under any element with the class ‘rakim’, the element with id “sucka_mcs” will fade. Because of the option :prevent_default => true, the default action when clicking the a tag (the browser goes to its href url) isn’t done. This can also be used in conjunction with trigger to make and call custom events.



375
376
377
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 375

def peep(event_name, options = {}, &block)
  invoke ["observe", event_name, event_function(options[:prevent_default], &block)]
end

#previous(selector = nil) ⇒ Object

gets the previous immediate sibling for each element selected Takes an optional selector as an argument



175
176
177
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 175

def previous(selector = nil)
  invoke ["prev", selector], :flatten_uniq => true
end

#remove ⇒ Object

removes the selected elements from the DOM



307
308
309
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 307

def remove
  invoke ['remove']
end

#remove_attribute(name) ⇒ Object 



205
206
207
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 205

def remove_attribute(name)
  set_attribute(name, nil)
end

#remove_class(klass = '') ⇒ Object 



196
197
198
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 196

def remove_class(klass = '')
  invoke ["removeClassName", klass]
end

#replace(replace, html) ⇒ Object

replaces the selected html.

repace may be:

:inner

The inner html of the selected elements are replaced

:outer

the selected elements themselves are replaced

Example

<div class=‘rakim’>

<p>Dont Sweat the Techinique</p>

</div> <div class=‘rakim’>

<p>Follow the Leader</p>

</div>

page.select(‘.rakim’).replace(:inner, “<p>Paid in Full</p>”) would result in

<div class=‘rakim’>

<p>Paid in Full</p>

</div> <div class=‘rakim’>

<p>Paid in Full</p>

</div>

if we then did: page.select(‘.rakim’).replace(:outer, “<div class=‘schoolyD’><p>SaturdayNight</p></div>”) the result would be

<div class=‘schoolyD’>

<p>SaturdayNight</p>

</div> <div class=‘schoolyD’>

<p>SaturdayNight</p>

</div>



301
302
303
304
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 301

def replace(replace, html)
  function =  {:inner =>"update",:outer => 'replace'}[replace.to_sym]
  invoke [function, escape_javascript(html)]
end

#select ⇒ Object 



102
103
104
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 102

def select
  "$$(#{@selector})"
end

#set_attribute(name, value) ⇒ Object 



200
201
202
203
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 200

def set_attribute(name, value)
  value = "null" if value.nil?
  invoke ["writeAttribute", name, value]
end

#show ⇒ Object

show() shows an element, hide() hides it, and toggle() shows a hidden and hides a shown.



345
346
347
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 345

def show()
  invoke ['show']
end

#siblings(selector = nil) ⇒ Object

gets all siblings for each element selected



163
164
165
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 163

def siblings(selector = nil)
 invoke ["siblings", selector], :flatten_uniq => true
end

#stop_peeping(event_name) ⇒ Object

takes away any event listeners on the ‘event_name’ event fot the selected elements



380
381
382
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 380

def stop_peeping(event_name)
  invoke ["stopObserving", event_name]
end

#toggle ⇒ Object 



353
354
355
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 353

def toggle()
  invoke ['toggle']
end

#trigger(event_name) ⇒ Object

triggers the ‘event_name’ event on the selected elements.



385
386
387
 
# File 'lib/mack-javascript/helpers/prototype_helper.rb', line 385

def trigger(event_name)
  invoke ["fire", event_name]
end