Update 18-08-2016 – the YouTube API that this demo was using has been deprecated and is no longer active. If you feel like downloading the source and fixing it up to use the new API then I’d be happy to link to your blog/site.
After a LOT of requests for the source files for this Vine/blog post I have finally got around to creating a nicely commented Coverflow tutorial/demo in Adobe Edge Animate.
As always the functionality’s foundation is the ever rock solid Greensock GSAP (where Jack kindly features some of my work) and without which none of this would work very well at all.
YouTube Coverflow works like this:
- It loads a YouTube user’s feed (this can be edited either inside EA (Edge Animate) or as part of the query string like this http://gannon.tv/edge_demos/youtubecoverflow/?techcrunch or http://gannon.tv/edge_demos/youtubecoverflow/?topgear )
- If you put in a user that doesn’t exist (or has been suspended etc) it will alert you and direct you to the default user (declared inside EA).
- It then creates the ‘covers’ from symbol instances (and reflections if you want them) from EA’s library and populates them with the returned JSON data.
- The app responds to swipe gestures (although in the Vine I posted it was also responding to Leap Motion gestures but I haven’t included that functionality).
- You click/tap a cover and it launches the video in a new window.
There is so much more functionality I could have included but in the interests of simplicity I’ve kept the functionality down to a minimum – I think it’s pretty cool as it is 🙂
Ooh, whilst you’re here, if you like this then please do check out my templates on CodeCanyon. I’ve created three (so far) so if you or your boss or company want some exclusive templates at amazing prices then check them out.
1. 3D Video Cube – (this one is particularly awesome!)
2. Swiss Clock
So please feel warmly invited to view the Coverflow demo and download the source files – don’t forget you can change the user content by adding the user on the end as a query string. And don’t forget to leave a message in the comments if you like it/use it/are friendly/like options separated by slashes.