7. RR JavaScript Interface

Utilizing common ajax operations RightRails tries to balance between obtrusive and non-obtrusive javascript responses. It provides a simple javascript interface for the most common operations like inserting, updating, removing, and then in the responses it creates the scripts that just calls the interface with your strings.

This way there is nothing really behind the RJS scripts building, all the content generating happens in your templates where it can be easily tested and debugged and all the actual manipulations happens in a standalone javascript interface where it can also be easily debugged and tested in your browser. So that we have all the advantages and no disadvantages of using JavaScript responses.

RR Interface

RR library is situated in the public/javascripts/right/rails(-src).js file and has a simple interface, which you free to use in your scripts too

• RR.update_flash(content) – replaces the #flashes element with the new content
• RR.hide_flash() – hides the #flashes element
• RR.highlight(id_or_element) – highlights the element according to the interface settings
• RR.insert(where, content) – inserts the content into the element, then highlights the insertion according to the settings and rescans new elements for updates
• RR.replace(what, content) – replaces the element with new content, then highlights the update and rescans new elements
• RR.remove(id_or_element) – removes the element according to the settings (vis visual effect)
• RR.remotize_form(id_or_element) – makes the given form remote
• RR.replace_form(id, content) – replaces the given form with new content and tries to make it remote
• RR.show_form_for(id, content) – inserts the form content into the given element

RR Options

You can customize the RR interface behavior by altering the options like this

$ext(RR.Options, {
  highlightUpdates: false,
  ...
});

There is the following list of options

• format – 'js' – the working format for remote requests over the application
• flashId – 'flashes' – the flashes element id
• flashHideFx – 'slide' – use null if you don’t want any visual effect for the action
• flashHideDelay – 3200 – use -1 to disable the flash element hiding
• highlightUpdates – true – a flag if it should highlight new and updated elements
• removeFx – 'fade' – elements removing visual effect name, use null to switch it off
• insertFx – 'fade' – new elements inserting visual effect name, use null to switch it off
• insertPosition – 'bottom' – default ajax new elements insert position