Ruby Rails Images & Lowpro

Rails
1

I’ve been reading around and found out lowpro but with few examples. I
was wondering if anyone here could give elaborate examples of some AJAX
calls and lowpro. How about a mouseover an image? Also how about
link_to_remote and update a div with a partial?

2

All the things you list are very easy with LowPro. I will provide some
psuedo-code / aircoded.

  1. Mouseover an image

// options ‘hovered’ : ‘path/to/image’
HoverImage = Behavior.create({
initialize : function(options) {
this.options = options || {};
this.options.idle = this.element.src;
},
onmouseover : function(e) {
this.element.src = this.options.hovered;
},
onmouseout : function(e) {
this.element.src = this.options.idle;
}
})

Use:

Event.addBehavior({
‘#img1’ : HoverImage({ hovered : “/images/somepic.png” })
})

  1. Link to Remote (Request)

HTML:

= link_to “caption”, some_action_url, :class => “remote-request”

JS:

Event.addBehavior({
‘.remote-request’ : Remote.Link
})

  1. Link to Remote (update a div)

HTML:

= link_to “caption”, some_action_url, :class => “remote-update”

JS:

Event.addBehavior({
‘.remote-request’ : Remote.Link({ “update” : “some_div_to_update” })
})

Or you can even do complex remote links with stuff happening before and
after:

HTML:

= link_to “Delete”, delete_something_url, :id => “delete_link”

JS:

DeleteRemoteItem = Remote.Link({
onLoading : function() {
$(‘someid’).doSomething();
},
onComplete : function(e) {
$(‘someid’).doSomething();
}
})

Event.addBehavior({
‘#delete_link’ : DeleteRemoteItem
})