var img0=new Image();
img0.src="portrait/portrait0.png";
var img1=new Image();
img1.src="portrait/portrait1.png";
var img2=new Image();
img2.src="portrait/portrait2.png";
var img3=new Image();
img3.src="portrait/portrait3.png";
var img4=new Image();
img4.src="portrait/portrait4.png";
var img5=new Image();
img5.src="portrait/portrait5.png";
var img6=new Image();
img6.src="portrait/portrait6.png";
var img7=new Image();
img7.src="portrait/portrait7.png";
var img8=new Image();
img8.src="portrait/portrait8.png";

var slotValue=new Array();
slotValue[0] = 0;
slotValue[1] = 1;
slotValue[2] = 2;


var isGoing=new Array();
isGoing[0] = 0;
isGoing[1] = 0;
isGoing[2] = 0;


//direction: 0 is for leftArrow clicks, 1 is for rightArrow clicks
function scrollLayerNew(start, direction, thedivsName0, startingPosition0, picNum0, slotID0, thedivsName1, startingPosition1, picNum1, slotID1, thedivsName2, startingPosition2, picNum2, slotID2)
{
	thingToAnimate0 = document.getElementById(thedivsName0);
	imageToChange0 = document.getElementById(slotID0);
	thingToAnimate1 = document.getElementById(thedivsName1);
	imageToChange1 = document.getElementById(slotID1);
	thingToAnimate2 = document.getElementById(thedivsName2);
	imageToChange2 = document.getElementById(slotID2);
	
	if(direction == 0)
	{
		if(start == 1 && isGoing[picNum0] == 0 && isGoing[picNum1] == 0 && isGoing[picNum2] == 0)
		{
			thingToAnimate0.style.left=parseInt(thingToAnimate0.style.left,10)+20+'px';
			thingToAnimate1.style.left=parseInt(thingToAnimate1.style.left,10)+20+'px';
			thingToAnimate2.style.left=parseInt(thingToAnimate2.style.left,10)+20+'px';
			
			isGoing[picNum0] = 1;
			isGoing[picNum1] = 1;
			isGoing[picNum2] = 1;
			
			setTimeout('scrollLayerNew(0,0,\'' + thedivsName0 + '\',' + startingPosition0 + ',' + picNum0 + ',\'' + slotID0 + '\',\'' + thedivsName1 + '\',' + startingPosition1 + ',' + picNum1 + ',\'' + slotID1 + '\',\'' + thedivsName2 + '\',' + startingPosition2 + ',' + picNum2 + ',\'' + slotID2 + '\')','15');
		}
		
		if(start == 0)
		{
			if(parseInt(thingToAnimate0.style.left,10) != startingPosition0)
			{		
				if((parseInt(thingToAnimate0.style.left,10))<630)
				{
					thingToAnimate0.style.left=parseInt(thingToAnimate0.style.left,10)+20+'px';
				} 
				else
				{
					thingToAnimate0.style.left='-170px'; // Image width
					if(slotValue[picNum0] - 3 >= 0)
					{
						slotValue[picNum0] -= 3;
					}
					else
					{
						slotValue[picNum0] = 8-(2-picNum0);
					}
					
					imageToChange0.src=eval("img"+slotValue[picNum0]+".src");
				}

			}
			else
			{
				isGoing[picNum0] = 0;
			}
			
			if(parseInt(thingToAnimate1.style.left,10) != startingPosition1)
			{		
				if((parseInt(thingToAnimate1.style.left,10))<630)
				{
					thingToAnimate1.style.left=parseInt(thingToAnimate1.style.left,10)+20+'px';
				} 
				else
				{
					thingToAnimate1.style.left='-170px'; // Image width
					if(slotValue[picNum1] - 3 >= 0)
					{
						slotValue[picNum1] -= 3;
					}
					else
					{
						slotValue[picNum1] = 8-(2-picNum1);
					}
					
					imageToChange1.src=eval("img"+slotValue[picNum1]+".src");
				}

			}
			else
			{
				isGoing[picNum1] = 0;
			}
			
			if(parseInt(thingToAnimate2.style.left,10) != startingPosition2)
			{		
				if((parseInt(thingToAnimate2.style.left,10))<630)
				{
					thingToAnimate2.style.left=parseInt(thingToAnimate2.style.left,10)+20+'px';
				} 
				else
				{
					thingToAnimate2.style.left='-170px'; // Image width
					if(slotValue[picNum2] - 3 >= 0)
					{
						slotValue[picNum2] -= 3;
					}
					else
					{
						slotValue[picNum2] = 8-(2-picNum2);
					}
					
					imageToChange2.src=eval("img"+slotValue[picNum2]+".src");
				}

			}
			else
			{
				isGoing[picNum2] = 0;
			}
			
			
			
			if(isGoing[picNum0] == 1 || isGoing[picNum1] == 1 || isGoing[picNum2] == 1)
			{
				setTimeout('scrollLayerNew(0,0,\'' + thedivsName0 + '\',' + startingPosition0 + ',' + picNum0 + ',\'' + slotID0 + '\',\'' + thedivsName1 + '\',' + startingPosition1 + ',' + picNum1 + ',\'' + slotID1 + '\',\'' + thedivsName2 + '\',' + startingPosition2 + ',' + picNum2 + ',\'' + slotID2 + '\')','15');
			}
			else
			{
				if(slotValue[picNum0] == 0)
				{
					switch(imageNumber1)
					{
					case 0:
					  document.getElementById('s').style.border = '1px solid #c41230';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 1:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #c41230';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 2:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #c41230';
					  break;
					case 3:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 4:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 5:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 7:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 8:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break; 
					}
				}
				else if(slotValue[picNum0] == 3)
				{
					switch(imageNumber1)
					{
					case 0:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 1:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 2:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 3:
					  document.getElementById('s').style.border = '1px solid #c41230';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 4:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #c41230';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 5:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #c41230';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 7:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 8:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					
					}
				}
				else
				{
					switch(imageNumber1)
					{
					case 0:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 1:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 2:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 4:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 5:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #c41230';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 7:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #c41230';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 8:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #c41230';
					  break;
					
					}
				}
			}
			
		}
	}
	
	if(direction == 1)
	{
		if(start == 1 && isGoing[picNum0] == 0 && isGoing[picNum1] == 0 && isGoing[picNum2] == 0)
		{
			thingToAnimate0.style.left=parseInt(thingToAnimate0.style.left,10)-20+'px';
			thingToAnimate1.style.left=parseInt(thingToAnimate1.style.left,10)-20+'px';
			thingToAnimate2.style.left=parseInt(thingToAnimate2.style.left,10)-20+'px';
			
			isGoing[picNum0] = 1;
			isGoing[picNum1] = 1;
			isGoing[picNum2] = 1;
			
			setTimeout('scrollLayerNew(0,1,\'' + thedivsName0 + '\',' + startingPosition0 + ',' + picNum0 + ',\'' + slotID0 + '\',\'' + thedivsName1 + '\',' + startingPosition1 + ',' + picNum1 + ',\'' + slotID1 + '\',\'' + thedivsName2 + '\',' + startingPosition2 + ',' + picNum2 + ',\'' + slotID2 + '\')','15');
		}
		
		if(start == 0)
		{
			
			if(parseInt(thingToAnimate0.style.left,10) != startingPosition0)
			{		
				if(parseInt(thingToAnimate0.style.left,10)>-170)
				{
					thingToAnimate0.style.left=parseInt(thingToAnimate0.style.left,10)-20+'px';
				} 
				else
				{
					thingToAnimate0.style.left='630px'; // Sizeshow Container Width
					if(slotValue[picNum0] + 3 <= 8)
					{
						slotValue[picNum0] += 3;
					}
					else
					{
						slotValue[picNum0] = picNum0;
					}
					
					imageToChange0.src=eval("img"+slotValue[picNum0]+".src");
				}
			
			}
			else
			{
				isGoing[picNum0] = 0;
			}
			
			if(parseInt(thingToAnimate1.style.left,10) != startingPosition1)
			{		
				if(parseInt(thingToAnimate1.style.left,10)>-170)
				{
					thingToAnimate1.style.left=parseInt(thingToAnimate1.style.left,10)-20+'px';
				} 
				else
				{
					thingToAnimate1.style.left='630px'; // Sizeshow Container Width
					if(slotValue[picNum1] +3 <= 8)
					{
						slotValue[picNum1] += 3;
					}
					else
					{
						slotValue[picNum1] = picNum1;
					}
					
					imageToChange1.src=eval("img"+slotValue[picNum1]+".src");
				}
			
			}
			else
			{
				isGoing[picNum1] = 0;
			}
			
			if(parseInt(thingToAnimate2.style.left,10) != startingPosition2)
			{		
				if(parseInt(thingToAnimate2.style.left,10)>-170)
				{
					thingToAnimate2.style.left=parseInt(thingToAnimate2.style.left,10)-20+'px';
				} 
				else
				{
					thingToAnimate2.style.left='630px'; // Sizeshow Container Width
					if(slotValue[picNum2] +3 <= 8)
					{
						slotValue[picNum2] += 3;
					}
					else
					{
						slotValue[picNum2] = picNum2;
					}
					
					imageToChange2.src=eval("img"+slotValue[picNum2]+".src");
				}
			
			}
			else
			{
				isGoing[picNum2] = 0;
			}
			
			
			if(isGoing[picNum0] == 1 || isGoing[picNum1] == 1 || isGoing[picNum2] == 1)
			{
				setTimeout('scrollLayerNew(0,1,\'' + thedivsName0 + '\',' + startingPosition0 + ',' + picNum0 + ',\'' + slotID0 + '\',\'' + thedivsName1 + '\',' + startingPosition1 + ',' + picNum1 + ',\'' + slotID1 + '\',\'' + thedivsName2 + '\',' + startingPosition2 + ',' + picNum2 + ',\'' + slotID2 + '\')','15');
			}
			else
			{
				if(slotValue[picNum0] == 0)
				{
					switch(imageNumber1)
					{
					case 0:
					  document.getElementById('s').style.border = '1px solid #c41230';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 1:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #c41230';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 2:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #c41230';
					  break;
					case 3:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 4:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 5:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 7:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 8:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break; 
					}
				}
				else if(slotValue[picNum0] == 3)
				{
					switch(imageNumber1)
					{
					case 0:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 1:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 2:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 3:
					  document.getElementById('s').style.border = '1px solid #c41230';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 4:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #c41230';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 5:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #c41230';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 7:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 8:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					
					}
				}
				else
				{
					switch(imageNumber1)
					{
					case 0:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 1:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 2:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 4:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 5:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 6:
					  document.getElementById('s').style.border = '1px solid #c41230';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 7:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #c41230';
					  document.getElementById('u').style.border = '1px solid #e5e6e7';
					  break;
					case 8:
					  document.getElementById('s').style.border = '1px solid #e5e6e7';
					  document.getElementById('t').style.border = '1px solid #e5e6e7';
					  document.getElementById('u').style.border = '1px solid #c41230';
					  break;
					
					}
				}
			}
			
			
		}
	}
}

