Friday, August 24th, 2007
Amazing Ajax Solitaire
Category: Framework
, Fun, Games, Showcase, Yahoo!
In the “I-can’t-believe-it’s-not-Flash” category, Robert Schultz pointed us to his amazing World of Solitaire website, implemented with YUI, MochiKit and PlotKit:
It’s hard to single out a favorite feature, from it’s ability to rescale the size of the cards when you resize the browser window to its impressive animations and smooth drag-and-drop. Definitely worth a look!
Robert gave an interview to the YUI blog that discusses implementation details.
3.3 rating from 122 votes
Project Freehweel, http://freewheel.labs.autodesk.com, is also NOT Flash.
Now that’s impressive. Good work..
Really nicely done, the UI is playful and entertaining. Will be cool to read about implementation details.
Really good job …but I don’t see any ajax..just Javascript.
You are right there is a large amount of large amount of javascript.
We use AJAX to get essential design data underneath the covers, most of it happens when you first load the site. AJAX is also used extensively for collaboration.
That is outstanding. AJAX or not… just very well done. Dying to read about how he did it.
Thanks all for the good comments!
The game itself is all done in JavaScript. The only places AJAX plays a role in saving and retrieving statistics and logging in or registering takes place via AJAX as well.
Its OK, but I think a lot of developers still do not understand about polishing sites like this for IE and other browsers. They all have nuances once you get into real DHTML pages. For instance, i can still select elements on this page as if i’m selecting text in a document. It totally breaks the illusion of ‘cool’. Its a bit awkward in some instances trying to drag cards around and have elements get selected on the page. The sad thing is its really just a few simple properties such as ondrag=”return false” and unselectable=”on” in the right places that can really help improve the user experience on these types of sites, at least for IE users, which - correct me if I am wrong - is still the dominant browser in the world. If you have any hope of being ‘cross browser’ you must tailor to IE and FireFox and all the nuances of every browser you are targeting. It is a fact of life that “standards” in the browser industry are a pie-in-the-sky dream that won’t ever come true in any real sense.
Damien, I routinely test the game in IE6, IE7, Firefox, Konqueror, Opera and Safari. I’ve never noticed elements being selected when dragging cards. I have accidentally missed clicking on a card and dragged in the page itself, which causes text to be selected. I didn’t exactly view this as a ‘bug’ or a major problem since maybe they want to select text on the page, in the dialog or what not. It doesn’t seem to happen when dragging cards which would be my primary concern.
Regardless, I’ve put your thoughts on my to-do list and will examine it more in the future.
Really nice work. :-)
Jeffrey
Really impressive work, Robert!
Out of curiosity, why did you use the Yahoo javascript library over all of the other available choices? Does it offer something that you couldn’t find in other frameworks, or were you just most familiar with that one?
@Briand, I talk about why I choose it in the interview I gave to yuiblog.com
Basically I was familiar with it as I started using it shortly after it was released. In addition I still believe YUI is one of the best JS toolkits out there and I knew it would be up to the task.
Excellent collection of card games here
Just like solitaire, a heart without love plays a lonely game.
this web is very good . I think will have a good way.