Friday, December 14th, 2007

GWT Can Do Spinners?

Category: GWT, JavaScript

I’m not really accustomed to seeing a lot of UI press about GWT so I was pleasantly surprised when Dietrich Kappe showed me the new spinner control he’s been working on. Most of you have probably seen Flash-based implementations, especially on Amazon, where images spin on a type of carousel. It’s a very cool effect.

The widget uses projection geometry (a view point and calculating image size and position based on where lines pass through the z=0 plane) and a little bit of trigonometry for the circle. Also, zIndex is set based on an object’s z coordinate. At this stage the implementation definitely performs differently based on machine horsepower and browser platform. It performs pretty well on IE7 and Safari 3, less well on Firefox.

This is still a work in progress but Dietrich already has plans for adding DnD and setting up clickable elements. GWT developers should love this control. Check out the demo here.

Posted by Rey Bango at 5:30 pm

3.9 rating from 65 votes


Comments feed TrackBack URI

seriously, a spin animation down to the basic it isn’t that hard.

Comment by bizsimon — December 14, 2007

The blog correctly identified this as “DHTML” but the demo page confusing calls it “AJAX” even though there isn’t any XHR in it.

Comment by Jordan — December 15, 2007

Right Jordan. In addition, I don’t get why I’d need a serverside-framework to do something that looks like it can be done in pure JavaScript. And supposedly, adding a GWT wrapper to existing JS stuff is easy… so whats the point exactly? It doesn’t even stop when I hover it.

Comment by Jörn Zaefferer — December 15, 2007

@bizsimon: Agreed. It’s just a matter of some basic trigonometry.

Comment by Andy — December 15, 2007

The Google Bible, Book of GWT, in the chapter on UI we find a verse about spinners…..Can I get an ‘Amen!’?!

….next time we’ll look at the Book of Knol [and learn more about Google’s various quests for the grail].

Comment by ujuxiun — December 15, 2007

@Jörn Zaefferer
Some people don’t know javascript? Check!. Subset of these know GWT? Check!

Yes, I too can’t figure out why this was needed.

Comment by Viktor Kojouharov — December 16, 2007

last week, we actually just started toying around with something similar to simulate a funky magazine rack. tried to make it interactive (and reflective).

this is my first attempt at something like this, it’s still a little buggy, and i had to disable in safari last minute. spent a while trying to optimize the event handler (this thing is a cpu hog), and if anyone has any feedback on how to speed it up, i’d be much obliged. The Expander class is inline. need to clean it up for sure.


Comment by khatibda — December 17, 2007

Something to note here is how far behind we are in comparison to the actionscript people. I’ve been a pretty hardcore javascript junkie now for about a year but I just moved to into Flash agency as their backend and architecture guy. Gotta tell ya the Flash people coding actionscript have been doing this kinda stuff for eons, and they do it much better. As much
as I despise most sites using Flash, it and Flex are light years ahead of us.

Comment by vance Dubberly — December 17, 2007

Leave a comment

You must be logged in to post a comment.