// Function:		Display character by character (typewriting)
// Parameters:		1.	Message: String of characters, that may also contain html tags.
//					2.	Interval: Integer that specifies the base time interval between display of the respective
//						characters (1000 = 1 sec).
// Author:			www.E3webdesign.nl
// Modified:		27-Dec-2008	- First setup.
// Notes:			1.	Thanks to http://news-ticker.vbarsan.com/ who provided the idea.
//					2.	Following html code shall be incorporated in the html page:
//						<div class="typeBox">
//							<span id="typewriterDiv"></span>
//						</div>
//						Where "typewriterDiv" is mandatory, and "typeBox" can be used to format the text
//						(text-align:left or center is one of the options).
// Known bugs:		-
// Suggestions:		-

function startTypeWriter(text,interval)
{	//Initialize global variables
	jj	= -2;			//Character position in message
	kk	= 0;			//0: marks the closing ">" of a html tag
						//1: marks the opening "<" of a html tag
	wds	= 0;			//0: character is part of a html string
						//1: character is part of the text message
	br  = -1;			//-1:Start of display sequence
						//0: No <br> in front of current character
						//1: <br> directly in front of current character
						//4: Current character is closing ">" of <br>
	cursor = '&#x25A0;';
	messageDiv = document.getElementById('typewriterDiv');
	messageDiv.innerHTML = '';

	//Fire typewriter
	typeWriter(text,interval);
}

function typeWriter(text,interval)
{	baseInterval = interval;
	message = text;

	switch(br)
	{	case -1:	br = 0; interval = 2*baseInterval; break;
		case 4: 	br = 1; interval = 2*baseInterval; break;
		default:	br = 0;
	}

	jj++;
	//Determine whether character is part of a html tag. If so, set wds to zero.
	if (kk==0 && message.charAt(jj)=="<")
	{	kk=1;		//Mark the start of a html tag
		wds=0;
	}
	else if (kk==1 && message.charAt(jj)==">")
	{	kk=0;		//Mark the end of a html tag
		wds=0;
		if (message.substring(jj-3,jj+1)=='<br>')
		{	interval = 5*baseInterval;
			br = 4;
		}
	}
	else if(kk==1)	//Somewhere in the middle of a html tag
	{	wds=0;
	}

	if (jj<message.length)
	{	if (kk==0)
		{	wds=1;
			messageDiv.innerHTML=message.substring(0,jj+1-br) + cursor;
		}

		if (wds==1)
		{	randomInterval = interval + interval*Math.random();
			setTimeout("typeWriter(message,baseInterval)",randomInterval);
		}
		else
		{	typeWriter(message,baseInterval);
		}
	}
	else
	{	cursor = '&nbsp;<span class="blink">' + cursor + '</span>';
		messageDiv.innerHTML=message.substring(0,jj+1) + cursor;
		
		//Fire the blink function
		startBlink(800);
	}
}

function startBlink(interval)
{	on = 1;
	intervalOn  = interval;
	intervalOff = 0.35*intervalOn;

	//Get all html tags and store then in a global array
	allPageTags = new Array();						//Create an array to hold all html tags on the page
	allPageTags=document.getElementsByTagName("*");	//Populate the array with all the page tags

	blink();
}

function blink()
{	if (on == 1)
	{	//document.getElementById("blink").style.visibility='visible';
		visibility = 'visible';
		on = 0;
		interval = intervalOn;
	}
	else
	{	//document.getElementById("blink").style.visibility='hidden';
		visibility = 'hidden';
		on = 1;
		interval = intervalOff;
	}
	//Cycle through the html tags and set the visibility of the elements with class "blink"
	for (i=0; i<allPageTags.length; i++) 
	{	//Pick out the tags with the "blink" class name
		if (allPageTags[i].className == "blink") 
		{	//Set visibility
			allPageTags[i].style.visibility= visibility;
		}
	}
	setTimeout("blink()",interval);
}