The Glass is Too Big - Home

Script.aculo.us, Prototype and Making Things Clear as Mud

Originally published on: 12/16/2005 6:18:01 AM

Earlier this week, I mentioned the Script.aculo.us visual effects library. And, aside from being part of the scourge of dotcom-ish misspellings and word mutilation that the .us top level domain has brought us, it's a pretty cool thing. However, when Tim asked about it, I realized it might not have been entirely clear. See, Tim's a pretty sharp guy and if something doesn't make sense to him, it usually means that 90% of you were scratching your head too.



So, what is Scriptaculous (yeah, I'm not going to look up where the dots go every time I type it)? Well, if you've heard of Ruby on Rails, the web application framework for Ruby (the programming language out of Japan, not the gemstone), it's actually the visual effects library from that.

Being the nicely organized programmers that the Rails folks are, they took their AJAX, visual effects and Javascript libraries and bundled them up seperately for those of us who don't use Rails to use as well. Since they function independently of Rails, you can just drop them into your PHP or other projects easily as well.

So, what is it exactly now that we know its parentage? It does all of the neat transitions, showing and hiding of elements, animation, drag and drop and moving around of HTML elements. For instance, if you look at the bottom of this post, the new design of this site is using the effects from this library. Click the "Show" button and you'll see a section appear. That transition is an example. They also have a demo page you'll want to check out.

All of those transitions and visual effects are made much easier by the Prototype Javascript library. Prototype gives you easier access to XmlHTTPRequest (fetching remote content straight from Javascript) as well as a general framework for working with the DOM objects in a document. My favorite utility included in Prototype is the function that lets you ditch doing:

document.getElementById(element)

for

$(element)

Because Prototype makes manipulating the DOM so much easier, the Scriptaculous people were able to whip up really nice transitions relatively easily. And, given how they put it together, extending even the visual effects they provided is fairly easy (relatively speaking).

Overall, are these tools going to revolutionize everything? No. We're not talking the invention of the wheel or agriculture here. However, we are talking about a nice evolution out of some of the limitations that the web has had to live with in comparison to the rest of the average desktop.

Comments

BillyBLOGirlardo » Clearing Script.aculo.us Up For Me
commented on 12/17/2005
[...] To be honest, I haven’t had a chance to even go there, but thanks to well-written articles like this from Mr. Wynia, I know I won’t be wasting time figuring out how all this Ruby stuff is pieced together. Thanks. [...]
Tim
commented on 12/26/2006
Thanks for the description. that helps a great deal. I think my non-understanding was due to not actually taking the time to visit the site and read it. I like being on the same team as 90% of readers. we wield a lot of influence.

Does s12us get used along with other ajax frameworks or no?

blog comments powered by Disqus
© 2003- 2010 J Wynia. Very Few Rights Reserved.