[ANN] Unobtrusive Javascript for Rails


#1

I made a brief post on here the other day about this and now I can
proudly present the initial release of our unobtrusive_javascript
plugin for Rails. We’ll be working with Dan W. of Vivabit to roll in
much of the functionality in his own as-yet unreleased
unobtrusive_javascript plugin into a single plugin.

This is essentially a preview release and probably not suitable for
use on a production site just yet but we hope it will be production
ready ASAP.

So here’s the important details!

The blog post:
http://www.lukeredpath.co.uk/index…ript-for-rails/

The documentation/information:
http://opensource.agileevolved.com/...usiveJavascript

The source:
http://opensource.agileevolved.com/...avascript/trunk

All comments and ideas are welcome. Enjoy!

** Apologies if this ends up here twice but gmail is acting up


#2

Sorry, here’s the fixed URLs:

The blog post:
http://www.lukeredpath.co.uk/index.php/2006/06/06/introducing-unobtrusive-javascript-for-rails

The documentation/information:
http://opensource.agileevolved.com/trac/wiki/UnobtrusiveJavascript

The source:
http://opensource.agileevolved.com/svn/root/rails_plugins/unobtrusive_javascript/trunk


#3

Very very cool.


#4

I get invalid links for those… 404 for the first, and nothing useful
for the other two.
Is it just me?


#5

Hello,

I too am having a problem with this plugin. I found the
event-selectors.js file in the assets folder of the plugin and put it
into the “public/behaviours” folder which worked for it but I am getting
an error when it looks for dynamic.js in the same location. I am using
the latest version of Prototype. The exact errors I am getting (in
Firefox 1.5.0.4) is “EventSelectors is not defined.” Thank you for your
help.

Sincerely,

Robert D.


#6

Robert D. wrote:

Hello,

I too am having a problem with this plugin. I found the
event-selectors.js file in the assets folder of the plugin and put it
into the “public/behaviours” folder which worked for it but I am getting
an error when it looks for dynamic.js in the same location. I am using
the latest version of Prototype. The exact errors I am getting (in
Firefox 1.5.0.4) is “EventSelectors is not defined.” Thank you for your
help.

Sincerely,

Robert D.

Hi Robert - there is no need to copy anything into your public folders -
both the event-selectors.js and dynamic.js contents are rendered at
runtime by a built-in controller that comes with the plugin.

There was a bug where the controller action responsible for rendering
the contents of event-selectors.js was looking for it in the wrong
place. I fixed this earlier so please run an update and have another go.

Cheers
Luke


#7

Luke,

That fixed the problem. Thank you very much for such a quick fix. Works
like a charm! I intend on using it asap. Much obliged.

  • Robert D.

Luke R. wrote:

Hi Robert - there is no need to copy anything into your public folders -
both the event-selectors.js and dynamic.js contents are rendered at
runtime by a built-in controller that comes with the plugin.

There was a bug where the controller action responsible for rendering
the contents of event-selectors.js was looking for it in the wrong
place. I fixed this earlier so please run an update and have another go.

Cheers
Luke


#8

Hi Luke

I like the idea of this plugin very much. However, I have no luck
getting it to work. Here’s what I’m trying to do:

I have a partial that renders several boxes containing some text. Each
box is in a div with a unique id like this:

... </div

I would like to apply some effect for a mouseover and I tried it like
this:

<% register_js_behaviour “#entry9:mouseover”, visual_effect(:highlight,
“entry9”, :duration => 0.5) %>

The selector is hardcoded for testing purposes and there is a div with
id “entry9” on the page. But nothing happens :frowning: What am I doing wrong
here ?

The prototype-scripts are installed and working, I am using effects in
my rjs-files.

Any help would be very appreciated

Best regards

Gernot


#9

Hi Gernot,

I’m not sure why it isn’t working - can I advise you to try loading up
your page in Firefox using the Firebug extension? You’ll be able to
select the dynamic.js file and view the javascript that has been
generated.

Once you’ve tried this, please submit a bug on our Trac at
http://opensource.agileevolved.com

Cheers
Luke

Gernot K. wrote:

Hi Luke

I like the idea of this plugin very much. However, I have no luck
getting it to work. Here’s what I’m trying to do:

I have a partial that renders several boxes containing some text. Each
box is in a div with a unique id like this:

... </div

I would like to apply some effect for a mouseover and I tried it like
this:

<% register_js_behaviour “#entry9:mouseover”, visual_effect(:highlight,
“entry9”, :duration => 0.5) %>

The selector is hardcoded for testing purposes and there is a div with
id “entry9” on the page. But nothing happens :frowning: What am I doing wrong
here ?

The prototype-scripts are installed and working, I am using effects in
my rjs-files.

Any help would be very appreciated

Best regards

Gernot