Module: ActionView::Helpers::PrototypeHelper::JavaScriptGenerator::GeneratorMethods
- Defined in:
- lib/action_view/helpers/prototype_helper.rb
Overview
JavaScriptGenerator generates blocks of JavaScript code that allow you to change the content and presentation of multiple DOM elements. Use this in your Ajax response bodies, either in a <script> tag or as plain JavaScript sent with a Content-type of “text/javascript”.
Create new instances with PrototypeHelper#update_page or with ActionController::Base#render, then call #insert_html, #replace_html, #remove, #show, #hide, #visual_effect, or any other of the built-in methods on the yielded generator in any order you like to modify the content and appearance of the current page.
Example:
update_page do |page|
page.insert_html :bottom, 'list', "<li>#{@item.name}</li>"
page.visual_effect :highlight, 'list'
page.hide 'status-indicator', 'cancel-link'
end
generates the following JavaScript:
new Insertion.Bottom("list", "<li>Some item</li>");
new Effect.Highlight("list");
["status-indicator", "cancel-link"].each(Element.hide);
Helper methods can be used in conjunction with JavaScriptGenerator. When a helper method is called inside an update block on the page
object, that method will also have access to a page
object.
Example:
module ApplicationHelper
def update_time
page.replace_html 'time', Time.now.to_s(:db)
page.visual_effect :highlight, 'time'
end
end
# Controller action
def poll
render(:update) { |page| page.update_time }
end
You can also use PrototypeHelper#update_page_tag instead of PrototypeHelper#update_page to wrap the generated JavaScript in a <script> tag.
Instance Method Summary collapse
-
#<<(javascript) ⇒ Object
Writes raw JavaScript to the page.
-
#[](id) ⇒ Object
Returns a element reference by finding it through
id
in the DOM. -
#alert(message) ⇒ Object
Displays an alert dialog with the given
message
. -
#assign(variable, value) ⇒ Object
Assigns the JavaScript
variable
the givenvalue
. -
#call(function, *arguments, &block) ⇒ Object
Calls the JavaScript
function
, optionally with the givenarguments
. -
#delay(seconds = 1) ⇒ Object
Executes the content of the block after a delay of
seconds
. -
#draggable(id, options = {}) ⇒ Object
Creates a script.aculo.us draggable element.
-
#drop_receiving(id, options = {}) ⇒ Object
Creates a script.aculo.us drop receiving element.
-
#hide(*ids) ⇒ Object
Hides the visible DOM elements with the given
ids
. -
#insert_html(position, id, *options_for_render) ⇒ Object
Inserts HTML at the specified
position
relative to the DOM element identified by the givenid
. -
#literal(code) ⇒ Object
Returns an object whose
#to_json
evaluates tocode
. -
#redirect_to(location) ⇒ Object
Redirects the browser to the given
location
, in the same form asurl_for
. -
#remove(*ids) ⇒ Object
Removes the DOM elements with the given
ids
from the page. -
#replace(id, *options_for_render) ⇒ Object
Replaces the “outer HTML” (i.e., the entire element, not just its contents) of the DOM element with the given
id
. -
#replace_html(id, *options_for_render) ⇒ Object
Replaces the inner HTML of the DOM element with the given
id
. -
#select(pattern) ⇒ Object
Returns a collection reference by finding it through a CSS
pattern
in the DOM. -
#show(*ids) ⇒ Object
Shows hidden DOM elements with the given
ids
. -
#sortable(id, options = {}) ⇒ Object
Creates a script.aculo.us sortable element.
-
#to_s ⇒ Object
:nodoc:.
-
#toggle(*ids) ⇒ Object
Toggles the visibility of the DOM elements with the given
ids
. -
#visual_effect(name, id = nil, options = {}) ⇒ Object
Starts a script.aculo.us visual effect.
Dynamic Method Handling
This class handles dynamic methods through the method_missing method
#method_missing(method, *arguments) ⇒ Object (private)
631 632 633 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 631 def method_missing(method, *arguments) JavaScriptProxy.new(self, method.to_s.camelize) end |
Instance Method Details
#<<(javascript) ⇒ Object
Writes raw JavaScript to the page.
553 554 555 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 553 def <<(javascript) @lines << javascript end |
#[](id) ⇒ Object
Returns a element reference by finding it through id
in the DOM. This element can then be used for further method calls. Examples:
page['blank_slate'] # => $('blank_slate');
page['blank_slate'].show # => $('blank_slate').show();
page['blank_slate'].show('first').up # => $('blank_slate').show('first').up();
403 404 405 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 403 def [](id) JavaScriptElementProxy.new(self, id) end |
#alert(message) ⇒ Object
Displays an alert dialog with the given message
.
529 530 531 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 529 def alert() call 'alert', end |
#assign(variable, value) ⇒ Object
Assigns the JavaScript variable
the given value
.
548 549 550 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 548 def assign(variable, value) record "#{variable} = #{javascript_object_for(value)}" end |
#call(function, *arguments, &block) ⇒ Object
Calls the JavaScript function
, optionally with the given arguments
.
If a block is given, the block will be passed to a new JavaScriptGenerator; the resulting JavaScript code will then be wrapped inside function() { ... }
and passed as the called function’s final argument.
543 544 545 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 543 def call(function, *arguments, &block) record "#{function}(#{arguments_for_call(arguments, block)})" end |
#delay(seconds = 1) ⇒ Object
Executes the content of the block after a delay of seconds
. Example:
page.delay(20) do
page.visual_effect :fade, 'notice'
end
562 563 564 565 566 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 562 def delay(seconds = 1) record "setTimeout(function() {\n\n" yield record "}, #{(seconds * 1000).to_i})" end |
#draggable(id, options = {}) ⇒ Object
Creates a script.aculo.us draggable element. See ActionView::Helpers::ScriptaculousHelper for more information.
584 585 586 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 584 def draggable(id, = {}) record @context.send(:draggable_element_js, id, ) end |
#drop_receiving(id, options = {}) ⇒ Object
Creates a script.aculo.us drop receiving element. See ActionView::Helpers::ScriptaculousHelper for more information.
590 591 592 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 590 def drop_receiving(id, = {}) record @context.send(:drop_receiving_element_js, id, ) end |
#hide(*ids) ⇒ Object
Hides the visible DOM elements with the given ids
.
519 520 521 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 519 def hide(*ids) loop_on_multiple_args 'Element.hide', ids end |
#insert_html(position, id, *options_for_render) ⇒ Object
Inserts HTML at the specified position
relative to the DOM element identified by the given id
.
position
may be one of:
: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 preceeding the element.
:after
-
HTML is inserted immediately following the element.
options_for_render
may be either a string of HTML to insert, or a hash of options to be passed to ActionView::Base#render. For example:
# Insert the rendered 'navigation' partial just before the DOM
# element with ID 'content'.
insert_html :before, 'content', :partial => 'navigation'
# Add a list item to the bottom of the <ul> with ID 'list'.
insert_html :bottom, 'list', '<li>Last item</li>'
460 461 462 463 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 460 def insert_html(position, id, *) insertion = position.to_s.camelize call "new Insertion.#{insertion}", id, render(*) end |
#literal(code) ⇒ Object
Returns an object whose #to_json
evaluates to code
. Use this to pass a literal JavaScript expression as an argument to another JavaScriptGenerator method.
409 410 411 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 409 def literal(code) ActiveSupport::JSON::Variable.new(code.to_s) end |
#redirect_to(location) ⇒ Object
Redirects the browser to the given location
, in the same form as url_for
.
534 535 536 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 534 def redirect_to(location) assign 'window.location.href', @context.url_for(location) end |
#remove(*ids) ⇒ Object
Removes the DOM elements with the given ids
from the page.
509 510 511 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 509 def remove(*ids) loop_on_multiple_args 'Element.remove', ids end |
#replace(id, *options_for_render) ⇒ Object
Replaces the “outer HTML” (i.e., the entire element, not just its contents) of the DOM element with the given id
.
options_for_render
may be either a string of HTML to insert, or a hash of options to be passed to ActionView::Base#render. For example:
# Replace the DOM element having ID 'person-45' with the
# 'person' partial for the appropriate object.
replace 'person-45', :partial => 'person', :object => @person
This allows the same partial that is used for the insert_html
to be also used for the input to replace
without resorting to the use of wrapper elements.
Examples:
<div id="people">
<%= render :partial => 'person', :collection => @people %>
</div>
# Insert a new person
page.insert_html :bottom, :partial => 'person', :object => @person
# Replace an existing person
page.replace 'person_45', :partial => 'person', :object => @person
504 505 506 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 504 def replace(id, *) call 'Element.replace', id, render(*) end |
#replace_html(id, *options_for_render) ⇒ Object
Replaces the inner HTML of the DOM element with the given id
.
options_for_render
may be either a string of HTML to insert, or a hash of options to be passed to ActionView::Base#render. For example:
# Replace the HTML of the DOM element having ID 'person-45' with the
# 'person' partial for the appropriate object.
replace_html 'person-45', :partial => 'person', :object => @person
474 475 476 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 474 def replace_html(id, *) call 'Element.update', id, render(*) end |
#select(pattern) ⇒ Object
Returns a collection reference by finding it through a CSS pattern
in the DOM. This collection can then be used for further method calls. Examples:
page.select('p') # => $$('p');
page.select('p.welcome b').first # => $$('p.welcome b').first();
page.select('p.welcome b').first.hide # => $$('p.welcome b').first().hide();
You can also use prototype enumerations with the collection. Observe:
page.select('#items li').each do |value|
value.hide
end
# => $$('#items li').each(function(value) { value.hide(); });
Though you can call the block param anything you want, they are always rendered in the javascript as ‘value, index.’ Other enumerations, like collect() return the last statement:
page.select('#items li').collect('hidden') do |item|
item.hide
end
# => var hidden = $$('#items li').collect(function(value, index) { return value.hide(); });
434 435 436 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 434 def select(pattern) JavaScriptElementCollectionProxy.new(self, pattern) end |
#show(*ids) ⇒ Object
Shows hidden DOM elements with the given ids
.
514 515 516 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 514 def show(*ids) loop_on_multiple_args 'Element.show', ids end |
#sortable(id, options = {}) ⇒ Object
Creates a script.aculo.us sortable element. Useful to recreate sortable elements after items get added or deleted. See ActionView::Helpers::ScriptaculousHelper for more information.
578 579 580 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 578 def sortable(id, = {}) record @context.send(:sortable_element_js, id, ) end |
#to_s ⇒ Object
:nodoc:
387 388 389 390 391 392 393 394 395 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 387 def to_s #:nodoc: returning javascript = @lines * $/ do if ActionView::Base.debug_rjs source = javascript.dup javascript.replace "try {\n#{source}\n} catch (e) " javascript << "{ alert('RJS error:\\n\\n' + e.toString()); alert('#{source.gsub('\\','\0\0').gsub(/\r\n|\n|\r/, "\\n").gsub(/["']/) { |m| "\\#{m}" }}'); throw e }" end end end |
#toggle(*ids) ⇒ Object
Toggles the visibility of the DOM elements with the given ids
.
524 525 526 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 524 def toggle(*ids) loop_on_multiple_args 'Element.toggle', ids end |
#visual_effect(name, id = nil, options = {}) ⇒ Object
Starts a script.aculo.us visual effect. See ActionView::Helpers::ScriptaculousHelper for more information.
570 571 572 |
# File 'lib/action_view/helpers/prototype_helper.rb', line 570 def visual_effect(name, id = nil, = {}) record @context.send(:visual_effect, name, id, ) end |