I am very excited to announce that local.ch granted us the possibility to open source the coverflow clone we created for them under the â Simplified BSD Licenseâ. So first of all a big thanks to them, you guys rock!
âOh noes! Not another coverflow clone!â
Fear not! This one is actually quite different.
âYet Another Coverflow Cloneâ, or lovingly YACC for short, is built in Actionscript 2, which makes it compatible with Flash Player 6 and newer to ensure that a broad userbase can be served. It's been built to be dimensions independent. That means you can use whatever size of pictures you want and embed the flash with whatever size you can think of.
Under the Hood
YACC sports horsepower provided by the open source Papervision3D engine which allows for smooth 3d presentations. Animation is realized through the also open source Tweener which gives you the power to easily change the coverflow animation to whatever your heart desires. Best of all, even though it is Actionscript 2, it's more performant than many of the other clones we've encountered. Even some of the AS3 versions and with 33kb it's not a burden on your site either!
âIs that all that is to it?â
Of course not! YACC loads its Dataset and many customization settings through a simple, yet extendable XML.
âHow is it extendable?â
Glad you asked! YACC implements a variety of heavily customizable and bi-directional javascript calls that allow you to interact with this coverflow like with no other.
Development Challenges
During development I was faced with a couple problems that needed to be solved. Of which two I think are of interest to other developers as well.
As you may or may not know, the Actionscript 2 version of the Papervision3D library does not include a possiblity to dynamically load images on runtime and assign them as a material to 3D objects (in our case planes). So it was neccessary to create a BitmapLoader class capable of loading and creating Papervision compatible materials.
(If you are in need of such a class yourself, feel free to use the BitmapLoader Class in any of your own Projects.)
Pretty soon into development we also realized that the Mac Flash Player has quite some performance issues with the intensive displayrendering that Papervision3D required. We came up with 3 steps to solve this problem:
- The BitmapLoader Class allows you to preload a certain amount of pictures before even starting to display the coverflow and silently loads the rest then in the background.
- The Application only displays a user-defined (yes, in the xml :) ) number of planes at once.
Thus allowing us to have a less render intensive animation cycle.
- To ensure the Flashplayer doesn't just hog system resources while no interaction is happening in the coverflow, the 3D Engine is instructed to stop rendering until a new interaction happens.
I hope this information can be useful to someone else struggling with similar problems.
Where to get YACC
- You can download the whole shabang here
(incl. sourcecode, example, required 3rd party libraries)
- Or you can get the latest build from SVN
Additional Ressources
- Papervision3D @Google Code
- Tweener @Google Code
If you have questions, suggestions feel free to chat me up in #liip on freenode and i'll try to respond to you in a timely manner :)