Wednesday, February 15, 2006

Grokking the Dock...

Mostly it happens with me that Ideas regarding something come up suddenly when thinking about some other thing!

Same thing happened today, i was thinking of adding a few images from my treks and trips to the blog and was thinking of spicing up the thumbnail view displayed to make it an eye candy as i usually do with most of the stuff ;-)

Checked out some regular JavaScript effects used for displaying thumbnails and slideshows which did not look like much of a visual delight for me, started *brainstorming* so that i could create some unique effect and in some time got an idea of creating a new effect for displaying the thumbnails... :-) the idea was... to put the thumbnails in the dock that i had created before! and providing two arrows/buttons on either side of the dock and giving the dock a 3D look. The arrow keys could be used to scroll the images across, and the dock functions as a normal dock, zooming the images when mouse rolls over!

As of now, this is what it looks like... I haven't seen any such thumbnail viewer till now which doubles up as a dock... this can also serve as a normal dock and can come in handy when there are lots of items in the dock and they overflow out of the visible area!

There are lots of challenges in making this idea functional, this is really going to be a killer script if implemented according to the idea. The main challenge is to make the dock icons be able to vary in size since an image can be either a landscape or a portrait, also making the whole thing a scrollable unit adds lot of complexity... will post again once i progress on this.

Along with this, i am also continuing the work on the original JavaScript dock that i coded since i got some new ideas regarding the dock while thinking to fit it into the needs of a thumbnail viewer! Currently trying to make the whole dock itself dragable anywhere on the page and providing a configurable zooming direction, that is if the dock is docked at the bottom of the page, icons will zoom towards top and if it is docked at the top, icons will zoom towards bottom. Also working on making the dock's orientation configureable so that it can be docked towards the left/right of the page also if needed but unfortunately this again involves lot of complexity!

Just now i added the dock to the blog just for fun... If you did not notice it till now, look at the top of the page where the Blogger Bar is displayed! If you are using Internet Explorer, you would be probably be blaming me for making the blog look ugly. Firefox displays it properly, but Internet Explorer makes it look ugly, it doesn't play well with DIV height's and transparent PNG images!!!
So for the sake of people using Internet explorer, i have put up an image below showing how it renders in Firefox ;-)

//the lines below are offtrack! ;-) and any -ve comments on these will be ignored!
/**And a final bit for those of you who have seen all my posts regarding the Javascript Dock and are thinking of me as a JavsScript professional who deals with JS most of the time, I am not a JS pro, just doing these things for fun! I am actually a fanatic and follower of the JAVA programming language! And i spend most of my idle time hacking on my pet projects[most are in java;-)] like this one which are spread across several programming lanuages... actually most of them ;-)

I was not a child prodigy, because a child prodigy is a child who knows as much when it is a child as it does when it grows up. - Will Rogers