I created an interactive plot to look at the results for the 2009 season, team by team.

Take Boston. Seen below, Boston started slow, but pretty quickly arrived at their ultimate winning level.

On the other hand, the Yankees started even slower, and in fact didn’t reach their ultimate winning level until very late in the season.

See the results for the other teams on the visualization page.

The visualization was created using Javascript and the Raphaël JS library.

I’d recommend anyone looking for a popup window solution at least consider Livepipe. There are downsides however, chiefly that the project is pretty immature – technically I suppose this is an alpha release since Beta One is being worked on, so the community remains small. While there are some folks already submitting patches, progress on merging the patches is alarmingly slow, as one can see from their lighthouse page.

If you’re doing RESTful stuff in Rails however, you will need the contents of ticket #10 which modifies the popup window to accept an option to use different HTTP verbs.

I was creating a method to scroll the viewport so that the contents of an AJAX-loaded div would be fully visible on the screen – the (still undocumented) Effect.ScrollTo doesn’t quite do it because it doesn’t consider the height of the element it scrolls to, but in doing so I stumbled over Tween in the code. Once the math to figure out how much scrolling is needed, its easy to use Effect.Tween to smoothly scroll the window by repeatedly calling window.scrollBy();

This certainly isn’t rocket science, but here’s an outline of how to do it (this code only deals with downward vertical scrolling):

var elementHeight = element.getHeight();
var screenHeight = document.viewport.getHeight();
var elementScreenPos =element.viewportOffset()[1];
var amountToScroll = elementHeight - (screenHeight - elementScreenPos);
if (amountToScroll > 0){
var scrollPos = document.viewport.getScrollOffsets().top;
new Effect.Tween(null,scrollPos,scrollPos+amountToScroll,{},function(n) { window.scrollTo(0,n);});
}
}

This isn’t rocket science and has been done forever, but I didn’t find a single good reference on how to select just part of the text in a text box. Scriptaculous and prototype don’t support it at the present time, and like anything good in browser-land, there’s at least two different ways to skin this cat. The IE way, and everyone else’s way (actually I don’t know which way safari and opera work, but the code here does work for them too).

I saw one of the YUI widgets supported “typeahead” so I looked through its code to find the relevent javascript calls – for IE its “createTextRange” and for firefox its “setSelectionRange”. Combine those and you get the following, which I’ve tested as working on IE 6 (or was it 7?), Firefox (mac), opera (mac) and safari.

function selectSomeText(element,begin,end)
{
	if (element.setSelectionRange)
	{
		element.setSelectionRange(begin,end);
	}
	else if (element.createTextRange)
	{
		var range = element.createTextRange();
		range.moveStart("character",begin);
		range.moveEnd("character",end);
		range.select();
	}
}

One of these days I’ll refactor the code I wrote to test this with scriptactulous and throw that up here as well.