/**
 *
 *	dIRT Image Replacement Technique
 *
 */

var DIRT_GENERATOR = '/wp-content/themes/whistlebinkies/dirt/dirt.php';


//if (!/WebKit/i.test(navigator.userAgent)) return;
		

	
$(document).ready(function()
{
	// Javascript is enabled so add 'active' class to all dIRT elements
	$(".dIRT").each(function()
	{
		$(this).addClass('active').css('height', '27px');
	});
	
	
	if (/WebKit/i.test(navigator.userAgent)) // sniff
	{ 
		var _timer = setInterval(function()
		{
			if (/loaded|complete/.test(document.readyState))
			{
				clearInterval(_timer);
				dIRT(); // call the onload handler
			}
		}, 10);
	}
	else
	{
		// go!
		dIRT();
	}

});


/* $(window).load(function()
{
	dIRT();
}); */


function dIRT()
{
	
	$(".dIRT").each(function()
	{
		var fontSize = parseInt( ($(this).css('font-size')), 10);
		var actualWidth = parseInt( ($(this).width()), 10);
		var fonts = $(this).css('font-family').split(',');
		var lineHeight = parseInt( $(this).css('line-height'), 10);
		
		var top = parseInt( $(this).css('padding-top'), 10);
		var left = parseInt( $(this).css('padding-left'), 10);

		// lineHeight as percentage
		lineHeight = Math.ceil( ( lineHeight / fontSize ) * 100 );
		
		var textContent = escape( $(this).text() );
		var color = escape( $(this).css('color') );
		
		var img = new Image();

		$(this).prepend('<span></span>');

		var parentJquery = $(this);
		var currentJquery = $(this).find("span");
					
		$(img).load(function()
		{
			// Temp <img> to get the exact width and height
			$(this).hide();
			
			$('body').prepend('<div id="dirt-loader"></div>');
			
			$('#dirt-loader').append(this);
			var height = $(this).height();
			var width = $(this).width();
			$(this).remove();	
			$('#dirt-loader').remove();					
			
			parentJquery.css({'height' : height + 'px' });
			
			// Similar to forced 100% on each, but keeping it exact to allow for below bump-padding
			currentJquery.css({'height' : height + 'px' });
			currentJquery.css({'width' : width + 'px' });
			
			// This bumps the <span> into place taking into account padding(s)
			currentJquery.css({'top' : top + 'px' });
			currentJquery.css({'left' : left + 'px' });
			
			//currentJquery.hide();
			currentJquery.css({'background-image' : 'url(' + DIRT_GENERATOR + '?font=' + escape(fonts[0]) + '&size=' + fontSize + '&text=' + textContent + '&width=' + actualWidth + '&lineheight=' + lineHeight + '&color=' + color + ')' });
			//currentJquery.fadeIn(200);
			
		})
		.attr('src', DIRT_GENERATOR + '?font=' + escape(fonts[0]) + '&size=' + fontSize + '&text=' + textContent + '&width=' + actualWidth + '&lineheight=' + lineHeight + '&color=' + color );
		
	}); // end dIRT

}	



	
	
//});
