var myDate = new Date();
var url = "/assets/includes/wa_dtr_gd.ashx";

Element.extend({

	extractText: function(){
		/* Extract the text inside the element being processed */
		if($type(this) == "string" || !$defined(this))
			return this;
		else if(this.innerText)
			return this.innerText;
		var text = "";
		$A(this.childNodes).each(function(el){
			if($type(el) == "element")
				text += Element.extractText(el);
			else if($type(el) == "textnode")
				text += el.nodeValue;
		});
		return text;
	}, 
	
	imageReplace: function(replace, el){
		/* Being an extension of the Element prototype, arrays are not allowed.
		   Arrays of elements should be parsed on the outside, not inside the method. */
		if($type(this) == "array"){ window.console.log('Element.imageReplace: Arrays are not allowed!'); return false; }
		
		/* Check to see if the element or the URI of the replacement script are defined */
		if(!$defined(this) || !$defined(url)) return;
		
		/* Define variables within context of the method. */
		this.tag   = $(($type(this) == "object")?this.toString():this);
		this.url   = url;
		this.size  = el.size;
		this.color = el.color;
		
		/* Define these variables as true/false. Word wrap defaults to false, replace to true */
		this.wordwrap = ($defined(el.wrap) && $type(el.wrap) == "boolean")? el.wrap : false;
		this.replace = ($defined(replace) && $type(replace) == "boolean")?replace:true;
		var text = Element.extractText(this.tag).clean().trim();
		if (text == "") return; // Do not do anything if there is no text to replace.
		
		// Clear text
		this.tag.empty();
		
		/* if word wrap is on, each word is defined as a separate inline image */
		var tokens = $A(this.wordwrap?text.split(' '):[text]);
		tokens.each(function(tok){
			/* Use EncodeURI function to encode special characters in the text (like registered symbols, etc) */
			var querystring = this.url.toString() + "?text="+encodeURI(tok+' ')+"&size="+escape(this.size)+"&color="+escape(this.color) + "&date="+myDate.getTime();
			/* Define the Image element and insert into the tag */
			var image = new Element('img', {
				'src': querystring, 
				'class': 'replacement', 
				'alt': tok
			});
			image.inject(this.tag);
			if(!this.replace){
				var span = new Element('span', {
					'styles': {
						'text-indent': '-9999em', 
						'visibility': 'hidden', 
						'font' : 'inherit'
					}, 
					'html': tok
				});
				span.inject(this.tag);
			}
		}.bind(this));
	}

});

/* This code on the page head will hide text headers before the page body is loaded and dom is ready */
$A(replaceElements).each(function(el){
	document.write("<style type='text/css'> "+ el.tag + " { text-indent: -9999em } </style>");
});

/* When dom is ready, text headers will be replaced by the images */
window.addEvent('domready', function(){
	$A(replaceElements).each(function(el){
		$$(el.tag).each(function(e){
			Element.imageReplace(e, true, el);
			e.setStyle('text-indent', '0');
		});
	});
});