// the document is ready
$(function(){
	
	// change some config colors from hex to strings and stuff
	TT_CONF.background_color = '#'+TT_CONF.background_color.toString(16);
	TT_CONF.font_color = '#'+TT_CONF.font_color.toString(16);
	TT_CONF.opacity = TT_CONF.opacity / 100;
	
	// is this flash version supported?
	var can_flash = $.fn.flash.hasFlash(8,0,0);
	
	// get and set the width of the tooltip
	var set_tooltip_widths = function(dd) {
		
		// show it again, by default through css it's hidden ;)
		dd.show();
		
		// get the tooltip width/height
		tt_height = dd.height();
		tt_width = dd.width();
				
		// are the width/height smaller than the minimums?
		tt_height = tt_height < TT_CONF.min_text_height ? TT_CONF.min_text_height : tt_height;
		tt_width = tt_width < TT_CONF.min_text_width ? TT_CONF.min_text_width : tt_width;
	
		// add in padding for the height/width
		tt_height += 2 * TT_CONF.text_pad;
		tt_width += 2 * TT_CONF.text_pad;
		
		// set the width and height of the tooltip
		dd
			.css('height', tt_height+'px')
			.css('width', tt_width+'px');
		
		return {width:tt_width,height:tt_height};
	};
	
	// by ppk from quirksmode.com, thanks!
	var get_viewport_size = function() {
		var x,y;
		if (self.innerHeight) // all except Explorer
		{
			x = self.innerWidth;
			y = self.innerHeight;
		}
		else if (document.documentElement && document.documentElement.clientHeight)
			// Explorer 6 Strict Mode
		{
			x = document.documentElement.clientWidth;
			y = document.documentElement.clientHeight;
		}
		else if (document.body) // other Explorers
		{
			x = document.body.clientWidth;
			y = document.body.clientHeight;
		}
		return {width:x,height:y};
	};
	
	// loop over each definition list that has a class
	// name of 'tooltip'
	$("dl.tooltip").each(function(){
		
		// keep track of some important variables
		var tt_width = 0,
			tt_height = 0;
		
		// replace the dd's with their flash
		// equivalents
		var tooltip = $("dd",this)
			.css('font-family', TT_CONF.font_face)
			.css('font-size', TT_CONF.font_size+'px') // even tho the flash measurement is pt :P
			.css('position', 'absolute');
		
		// yay, we have flash 8
		if(can_flash) {
			
			// add in the flash tooltip
			tooltip
				.flash({
					src: TT_CONF.flash_file,
					width: '100%', // this is key for being able to properly change
					height: '100%', // the size of the tooltip with the stage
					wmode: 'transparent'
				},{
					version: 8, // version 8 has ExternalInterface
					update: false // degrade to normal javascript tooltip gracefully :)
				},function(html_opts){
			
					// jquerified version of the <dd> (tooltip)
					var dd = $(this);
			
					// set the tooltip text to flash
					html_opts.flashvars.tt_text = this.innerHTML;
				
					// get and set the width for this flash tooltip
					var dims = set_tooltip_widths(dd);
					
					// set the width/height
					tt_width = dims.width;
					tt_height = dims.height;
			
					// append the flash object to the dd
					dd
						.html($.fn.flash.transform(html_opts)) // add in the flash object
						.hide() // hide it :)
				});
			
		// whoops, no flash 8!
		} else {
			
			// get and set the width for this dhtml tooltip
			var dims = set_tooltip_widths(tooltip);
			
			// set the width/height
			tt_width = dims.width;
			tt_height = dims.height;

			// set some background and other things
			tooltip
				.css('background-color', TT_CONF.background_color)
				.css('color', TT_CONF.font_color)
				.css('padding', TT_CONF.text_pad+'px')
				.hide();
		}
		
		// look for the definition title within this definition list
		$("dt",this).hover(function(e){
			
			// get some stuff!
			var view = get_viewport_size(), // unfortunately we need to do this every time
										    // to make sure that if the window is resized we
										    // capture those changes
				tt_left = e.clientX + TT_CONF.offset_mouse, // default tooltip left
				tt_top = e.clientY + TT_CONF.offset_mouse; // default tooltip top
			
			// lets move this left
			if((tt_left + tt_width) > view.width)
				tt_left = view.width - tt_width - 10;
			
			// lets move this up
			if((tt_top + tt_height) > view.height)
				tt_top = view.height - tt_height - 10;
			
			// move/position the tooltip
			tooltip.show().css('left', tt_left+'px').css('top', tt_top+'px');
			
			// should we apply the opacity?
			if(!can_flash)
				tooltip.fadeTo('fast', TT_CONF.opacity);
			
		},function(){
			tooltip.hide();
		});
	});
});