Phew! Just finished building out documentation and examples for my first ever YUI 3 gallery contributions. The motivation for all three is roughly the same — take existing, popular, awesome JavaScript packages built on other JavaScript libraries and bring them to YUI. So the three I decided on include two that I’ve always wished YUI had and one more that I wanted to play with (Lightbox).
And I’m happy to say all three are ready to go. Here’s a quick break down of what’s being released. You can go to http://projects.sophomoredev.com for information about all three.
Effects
http://projects.sophomoredev.com/yui-gallery-effects/
I’ve always loved how you can quickly add slick animations in jQuery and other JavaScript library with a simple $("#elephant").fade() and other similar commands. Now YUI 3′s Anim module can definitely handle a simple fade and a bunch more, but the code you have to write is a little verbose. The “gallery-effects” module is meant to provide a simple framework and API for using the YUI 3 Anim utility that will allow you to quickly and easily animate nodes. You’ll see that the framework and API are derived from Scriptaculous (heck, even the examples are taken from their documentation). The goal is to make animation with YUI as easy, if not easier, than with other JavaScript libraries.
In addition, I’ve tested this thoroughly on all Grade-A browser so it will “just work”
Lightbox
http://projects.sophomoredev.com/yui-gallery-lightbox/
Lightbox and it’s numerous spin-offs and in use all over the Web. YUI 3 has great support for overlays and the widget framework is great, but no Lightbox yet. So I’ve taken care of that with a literal port of Lightbox to YUI and plans to make it more flexible going forward (think non-image content, slideshow support, etc.). Although if you’re looking for immediate slideshow support, there are some great module already available in the YUI 3 Gallery.
Data Storage
http://projects.sophomoredev.com/yui-gallery-data-storage/
Finally, although you never feel like you’ll need it, I’ve been constantly wishing YUI had support for data storage on individual nodes ala jQuery. It feels like every jQuery plugin I look at uses it in some way and it’s just an awesome convenience. Well no more, I’ve ported it to YUI so it can be used natively with Y.Node instances and any old JavaScript object. Also, the YUI 3 Node class has begun to introduce support for this already, so all I really had to do was build on top of that.
Anyway, that’s all for today. Definitely let me know if you have questions, issues, whatever. I’ll document any progress on these modules as I go. Also, if anyone has any suggestions for the best way to document code with examples, I’m all ears. I felt it was a pretty painful exercise for this project, but I could just be complaining since my bracket was busted while I was documenting.
Social Links