YAHOO.namespace("yuiblog");
YAHOO.yuiblog.Pageweight = function(){
	var Event = YAHOO.util.Event;
	var Dom = YAHOO.util.Dom;
	var infographic = Dom.get("infographic");
	var escapePanel = function() {YAHOO.yuiblog.Pageweight.apanel.hide();};
	
	return {
		dismissPanel: function(e) {
			if(Event.getTarget(e).id != "infographic") {
				this.apanel.hide();
			}
		},
		keyListener: new YAHOO.util.KeyListener(document, {keys: [27]}, {fn:escapePanel}),
		init: function() {
			this.keyListener.enable();
			this.atooltip = new YAHOO.widget.Tooltip("pageweightTooltip", {
														context:infographic,
														text:"Click for an enlarged view of this image.",
														showdelay:500
													} ) ;
			this.apanel = new YAHOO.widget.Panel("pageweightPanel", {
														draggable: false,
														modal: true,
														fixedcenter:true,
														underlay:"shadow",
														visible:false,
														"close":"true",
														width:"908px",
														height:"642px"
													} ) ;
			this.apanel.setBody("<img src='http://yuiblog.com/assets/pageweight/infographic_900.gif' alt='A la Carte  Pageweight of Individual YUI JavaScript Components, Including All Dependencies' longdesc='http://yuiblog.com/assets/pageweight/infographic.html' height='609' width='900' />");
			this.apanel.setHeader("<em>&Agrave; la Carte</em> Pageweight of Individual YUI JavaScript Components, Including All Dependencies");
			this.apanel.render(Dom.get(document.body));
			Event.on(infographic, "click", this.apanel.show, this.apanel, true);
			Dom.setStyle(infographic, "cursor", "pointer");
		}
	}
}()
YAHOO.util.Event.on(window, "load", YAHOO.yuiblog.Pageweight.init, YAHOO.yuiblog.Pageweight, true);
YAHOO.util.Event.on(document, "click", YAHOO.yuiblog.Pageweight.dismissPanel, YAHOO.yuiblog.Pageweight, true);