My search for a Prototype based date picker went far and wide, and saw a lot of them with jQuery, animations, effects and some with own implementations, and yet others with prototype, all or most was really complicated or somehow did not serve the purpose. Till I found the clean calendar by Marc Grabanski. The demo onsite was promising, and I proceeded with downloading the kit. Once I read through the code, I was sure that this was the base for me to work with. There was some small kinks, though, and mostly it was because the script did not use any library atall. That is it is on its own, for just a date picker, this would be fine, but since we were heavily onto prototype library, I started to port Marc’s logic to prototype.
Marc had a method popUpCal.setupLinks which was collecting all ‘a’ tags and attaching observers to the same whenever the calendar was redrawn. It is just a matter of preference, and I prefer to reduce the number of observers, so I added an observer to the window.click and tested the target of the event. Thus effectively reducing the observer to a single one as compared to a minimum of 34 in Marc’s implementation. Also I know my code is a bit bigger than Marc’s. The port depends on prototype.js, but has features like active range, and is more familiar to my team for making mods.
Our testers found some bugs while browsing using our dear Internet Explorer, and those are corrected now. The demo has a select box to show that it does not punch through the calendar and create a visual interference. Also my original version had a window observer to track clicks on the whole visible area, which did not work out in IE. So I had to switch to document observer, and calendar element observer.