window.addEvent('domready', function() {
	var scroll = new Fx.GridScroll('classes', {
		transition: Fx.Transitions.Quad.easeInOut
	});

	var classNames = $('classes').getChildren('dt').map ( function (dt) {
		return dt.getFirst('a').get('id');
	});

	classNames.each ( function ( className ) {
		var scrollIt = function(event) {
			if ( event )
				event.stop();
			scroll.toElement( className );

			classNames.each( function ( calendar ) {
				$$( '.' + calendar ).each ( function (calendar){
					calendar.getParent().get('tween').cancel();
					calendar.getParent().erase('style');
				});
			});

			$$( '.' + className ).each ( function (calendar){
				calendar.getParent().set('tween', { duration: 2000 } );
				calendar.getParent().tween('background-color', '#f0f0f0', '#67a7e3');
			});
		};

		$$('.' + className).each( function (calendarObject) {
			calendarObject.erase ("href");
			calendarObject.getParent().addEvent('click', scrollIt);
		});
	});

	//is an outside link looking for a certain class?  Simulate a click.
	if(window.location.hash.substring(1)){
			var index = classNames.indexOf(window.location.hash.substring(1));
			if (index >= 0)
				$$('.'+ classNames[index]).getParent().fireEvent('click');
	}
});
