MooTools ThreeSixty Viewer Featuring the iPad

By Ryan Florence, published 2010-02-01

Part of the issue Migrated Articles From Original Site Structure..

I thought Apple’s new 360 degree product viewer was flippin’ awesome. So I created a feature light version in mootools last night. I hope to add more (like throwing) and clean up the api a bit, but still, this is sweet.

As you can see in the source I created two classes. The first MouseWatcher is a sort of drag class that listens to the mouse position (clientX and clienY) after a mousedown event. I hope to extend this class to provide the “throwing” logic. Then in ThreeSixty I just extend MouseWatcher with a drag method, so on every mousemove the image src gets changed out.

Eventually this will make it into the forge, as soon as I get throwing to work, package it with some grabbing cursors and preload the images a bit more gracefully, of course.

Hi, I'm Ryan!

Location:
South Jordan, UT
Github:
rpflorence
Twitter:
ryanflorence
Freenode:
rpflo

About Me

I'm a front-end web developer from Salt Lake City, Utah and have been creating websites since the early 90's. I like making awesome user experiences and leaving behind maintainable code. I'm active in the JavaScript community writing plugins, contributing to popular JavaScript libraries, speaking at conferences & meet-ups, and writing about it on the web. I work as the JavaScript guy at Instructure.