// SECTION SIZE GLOBALS
var contractedSize = '13%';
var normalSize     = '33%';
var expandedSize   = '53%';

// MESSAGE TEXT BOX SIZE GLOBALS
var messageTextContracted = '150px';
var messageTextNormal     = '325px';
var messageTextExpanded   = '550px';

// COLOR CONSTANTS
var JOJORED = '#ED1C24';
var JOJOGREEN = '#666600';

// STATE PROPERTIES
var stateBgColor = new Array(JOJORED,'YELLOW','GREEN');
var stateBorderColor = new Array('WHITE','RED','PINK');
var stateTopRightImg = new Array('modernLoversPic.png','modernLoversPic2.PNG','modernLoversPic3.PNG');
var stateTopLeftImg = new Array('jonathan.png','jonathan2.PNG','jonathan3.PNG');
var stateTitleImage = new Array('headerTall.jpg','header2.png','header3.png');

// ALT TEXT
var stateTopRightImgAlt = new Array("The Modern Lovers lineup from the early 80's. Michael Guardabascio-Drums, Greg Keranen-Bass, Ken Forfia-Keyboards, Ellie Marshall and Beth Harrington-Background Vocals",
				    "JR's on the right. Who's the guy on the left? I don't know, if you know please post it below.",
				    "I guess this is the cover of the Beserkley 'Egyptian Reggae/Ice Cream Man' single");
var stateTopLeftImgAlt = new Array("Jonathan Richman in the early 80's. That's Ellie to the left, and Michael in the background.",
				    "Jonathan Richman in the late 70's with kind of a ridiculous mustache",
				    "Jonathan Richman on some French TV show performing 'Tahetian Hop'. Not the same version as the version linked below. Type 'Jonathan Richman Tahetian Hop' into YouTube to hear another version of this great song.");


// LOCK GLOBALS
var lock = true;
var lastLevel = 0;


// CATCH EVENT
function section1IN() 
{
	if( !isLocked() )
		setSection1ToFocus();
}

function section1OUT() 
{
	if( !isLocked() )
		setSectionsBackToNormal();
}


function section2IN() 
{
	if( !isLocked() )
		setSectionsBackToNormal();	
}


function section2OUT() 
{
	;
}

function section3IN() 
{
	if( !isLocked() )
		setSection3ToFocus();
}

function section3OUT() 
{
	if( !isLocked() )
		setSectionsBackToNormal();
}

function swapLock()
{
	if( isLocked() )
		unlockMovement();
	else
		lockMovement();
}

function controlMovement( level )
{
	if( level == 0 )
	{
		enterMovementActionLow();
	}
	else if( level == 1 )
	{
		enterMovementActionMid();
	}
	else if( level == 2 )
	{
		enterMovementActionHigh();
	}

	// remember the last level for next time
	lastLevel = level;
}


function controlSlide( origin )
{
	//swapLock();


	if( origin == 'slideRight' )
	{
		if( isSlideSet(origin) == 'false' )
		{
			setSection3ToFocus();
			document.getElementById('slideRight').value = "SLIDE ON";
			document.getElementById('slideLeft').value = "SLIDE OFF";
		}
		else
		{
			setSection2ToFocus();
			document.getElementById('slideRight').value = "SLIDE OFF";
			document.getElementById('slideLeft').value = "SLIDE OFF";
		}

		//swapSlideText(origin);
	}
	else if( origin == 'slideLeft' )
	{
		if( isSlideSet(origin) == 'false' )
		{
			setSection1ToFocus();
			document.getElementById('slideLeft').value = "SLIDE ON";
			document.getElementById('slideRight').value = "SLIDE OFF";
		}
		else
		{
			setSection2ToFocus();
			document.getElementById('slideRight').value = "SLIDE OFF";
			document.getElementById('slideLeft').value = "SLIDE OFF";
		}

		//swapSlideText(origin);
	}

}

function isSlideSet( origin )
{
	if( document.getElementById(origin).value == "SLIDE ON" )
	{
		return 'true';
	}

	return 'false';
}

function swapSlideText( origin )
{
	if( document.getElementById(origin).value == "SLIDE OFF" )		
		document.getElementById(origin).value = "SLIDE ON";
	else
		document.getElementById(origin).value = "SLIDE OFF";

}





function enterMovementActionLow()
{
	//lockMovement();
	showMovementElement('midMovementDiv');
	midMovementAction();
}

function enterMovementActionMid()
{
	if( lastLevel == 0 )
	{
		//unlockMovement();
		showMovementElement('highMovementDiv');
		highMovementAction();
	}
	else if( lastLevel == 2 )
	{
		//lockMovement();
		showMovementElement('lowMovementDiv');
		lowMovementAction();
	}
}

function enterMovementActionHigh()
{
	//lockMovement();
	showMovementElement('midMovementDiv');
	midMovementAction();
}





function lowMovementAction()
{
	var stateNum = 0;

	setBorderColor(stateBorderColor[stateNum]);
	changeBackgroundColor(stateBgColor[stateNum]);
	changeTopLeftImage(stateTopLeftImg[stateNum]);
	changeTopRightImage(stateTopRightImg[stateNum]);
	changeTopLeftImageAlt(stateTopLeftImgAlt[stateNum]);
	changeTopRightImageAlt(stateTopRightImgAlt[stateNum]);

	changeTitleImage(stateTitleImage[stateNum]);
}

function midMovementAction()
{
	var stateNum = 1;

	setBorderColor(stateBorderColor[stateNum]);
	changeBackgroundColor(stateBgColor[stateNum]);
	changeTopLeftImage(stateTopLeftImg[stateNum]);
	changeTopRightImage(stateTopRightImg[stateNum]);
	changeTopLeftImageAlt(stateTopLeftImgAlt[stateNum]);
	changeTopRightImageAlt(stateTopRightImgAlt[stateNum]);

	changeTitleImage(stateTitleImage[stateNum]);
}

function highMovementAction()
{
	var stateNum = 2;

	setBorderColor(stateBorderColor[stateNum]);
	changeBackgroundColor(stateBgColor[stateNum]);
	changeTopLeftImage(stateTopLeftImg[stateNum]);
	changeTopRightImage(stateTopRightImg[stateNum]);
	changeTopLeftImageAlt(stateTopLeftImgAlt[stateNum]);
	changeTopRightImageAlt(stateTopRightImgAlt[stateNum]);

	changeTitleImage(stateTitleImage[stateNum]);
}



function changeTitleImage( src )
{
	document.jojoForm.document.getElementById('titleImage').src = src;
}

function changeTopLeftImage( src )
{
	document.jojoForm.document.getElementById('picTopLeft').src = src;
}

function changeTopRightImage( src )
{
	document.jojoForm.document.getElementById('picTopRight').src = src;
}


function changeTopLeftImageAlt( altText )
{
	document.jojoForm.document.getElementById('picTopLeft').alt = altText;
}

function changeTopRightImageAlt( altText )
{
	document.jojoForm.document.getElementById('picTopRight').alt = altText;
}


function setBorderColor( color )
{
	var borderElements = new Array('historyTable','songTable','messageTable','picTopLeft','picTopRight');

	for(x = 0; borderElements[x] != null; x++)
	{
		changeElementBorderColor(borderElements[x],color);
	}
}

function changeBackgroundColor( color )
{
	document.bgColor = color;
}


function lockMovement()
{
	lock = true;
}

function unlockMovement()
{
	lock = false;
}


function isLocked()
{
	var isLocked = true;

	if( lock != null && lock == false )
		isLocked = false;

	return isLocked;
}


// MAKE ACTUAL CHANGES
function setSection1ToFocus()
{
	resizeElement('message', messageTextContracted);
	resizeElement('td1', expandedSize);
	resizeElement('td3', contractedSize);
}

function setSection3ToFocus()
{
	resizeElement('message', messageTextExpanded);
	resizeElement('td1', contractedSize);
	resizeElement('td3', expandedSize);
}

function setSection2ToFocus()
{
	setSectionsBackToNormal();
}

function setSectionsBackToNormal()
{
	resizeElement('message', messageTextNormal);
	resizeElement('td1', normalSize);
	resizeElement('td3', normalSize);
}

function resizeElement( element, width )
{
	document.jojoForm.document.getElementById(element).style.width = width;
}

function hideElement( element )
{
	document.jojoForm.document.getElementById(element).style.visibility = 'hidden';
	document.jojoForm.document.getElementById(element).style.display = 'none';
}

function showElement( element )
{
	document.jojoForm.document.getElementById(element).style.visibility = 'visible';
	document.jojoForm.document.getElementById(element).style.display = 'block';
}

function showMovementElement( element )
{
	hideElement('lowMovementDiv');
	hideElement('midMovementDiv');
	hideElement('highMovementDiv');

	showElement(element);
}

function changeElementBorderColor( element, color )
{
	document.jojoForm.document.getElementById(element).style.borderColor = color;
}