<!--

//*********************************************
//***************GLOBAL VARS*******************
//*********************************************

var sRepeat = null;
var strlastImageID = null;
var strlastImageName = null;	
var strGoBackToIM = null;
var strFinalNewIM = null;
var strLastImage = "nav_producthome_hi.gif"; 
var strLastID = null;
var winElem = null;
var wincss = null;
var cntElem = null;
var cntcss = null;
var done = null;
var curLyr = null;
var elName = null;
var elName2 = null;
var y = null; 		 
var dom = null; 
var ns6 = null;
var ie5 = null;
var ie5MAC = null;
var ns4 = null;
var ie4 = null;
var nodyn = null; 	// can use to prompt/redirect etc. for browsers other than the known standards
var t; 				// used for timer 
var jump=100;   	// amount of scroll per click of scroll button
var inc=1;	    	// speed of scroll onmouseover
var timer=20;		// interval between calls to scroll onmouseover
var maxY;

var i = 0;
var j = 0;
var ver = 0;
var ua = window.navigator.userAgent.toLowerCase();	
i = ua.indexOf('msie');
j = ua.indexOf('windows');

if (i !=-1 && j !=-1)
	{
	ver = parseFloat(ua.substring(i+5,ua.indexOf(';',i)));
	}

// Initialize variables with browser detection
dom = (document.getElementById) ? true : false;	
ie6 = (ver >= '6') ? true : false;	
ie5 = (ver >= '5' && ver < '6') ? true : false;		
ns6 = ((navigator.userAgent.indexOf("Gecko")>-1) && dom) ? true: false;
//ie5 = ((navigator.userAgent.indexOf("MSIE")>-1) && dom && (navigator.userAgent.indexOf("Windows")>-1) ) ? true : false;
ie5MAC = ((navigator.userAgent.indexOf("MSIE")>-1) && dom && (navigator.userAgent.indexOf("Windows")==-1) ) ? true : false;
ns4 = (document.layers && !dom) ? true : false;
ie4 = (document.all && !dom) ? true : false;
nodyn = (!ns6 && !ns4 && !ie4 && !ie5) ? true : false;


//IF NETSCAPE, CAPTURE MOUSE CLICKS FOR IMAGE FLIPPING
/*if (ns4)
	{
	document.captureEvents(Event.CLICK);
	document.onclick = processME;
	}*/



//*********************************************
//*******************GO FORM*******************
//*********************************************

function goForm(fromWhere,lang)
	{
	// read in where the form request came from
	// create the url to reflect the product as well as the language
	// update product info selection if from product page, if from about, then default to procreate
	var trackingID = null
	
	switch (lang)
		{
		case 'en': trackingID=299; break; //english
		case 'fr': trackingID=300; break; //french
		case 'gr': trackingID=301; break; //german
		default  : trackingID=299; break; //english
		}		
		
	switch (fromWhere)
		{
		case '53937': this.location="../more/frmMoreInfo.html?source=53937&lang="+trackingID; break; //procreate
		case '53936': this.location="../more/frmMoreInfo.html?source=53936&lang="+trackingID; break; //painter
		case '53935': this.location="../more/frmMoreInfo.html?source=53935&lang="+trackingID; break; //ko
		case '52975': this.location="../more/frmMoreInfo.html?source=52975&lang="+trackingID; break; //kpt
		}	
	}

//*********************************************
//*****************END GO FORM*****************
//*********************************************



//*********************************************
//***************SHOW SCROLLER IMAGES**********
//*********************************************

function showScroll(lyr)
	{	
	var scrollUPcss   = (ns4)? document.up:   (ie4||ie5||ie6||ns6||ie5MAC)? up.style: null;
	var scrollDOWNcss = (ns4)? document.down: (ie4||ie5||ie6||ns6||ie5MAC)? down.style: null;	
	var pathLayer = (ns4)? document.eval(elName2).document.eval(elName).document.layers[lyr] : (ie4||ie5||ie6||ns6||ie5MAC)? lyr : null;
	var pathWndo  = (ns4)? document.eval(elName2).document.eval(elName) : (ie4||ie5||ie6||ns6||ie5MAC)? elName : null;
	/*if (ns4) 
	{
	var lyrHeight1  = document.eval(elName2).document.eval(elName).document.layers[lyr].innerHeight;
	var wndoHeight1 = document.eval(elName2).document.eval(elName).scrollHeight;
	alert(lyrHeight1+"\n"+wndoHeight1);
	}*/
	
	//alert(eval(pathLayer).scrollHeight);
	//alert(eval(pathWndo).scrollHeight);
	
	if (eval(pathLayer).scrollHeight > eval(pathWndo).scrollHeight)
	        {			
	        //up.style.display="block";
	        //down.style.display="block";
			scrollUPcss.display = "block";
	        scrollDOWNcss.display = "block";
			}			 
	//else if (eval(lyr+'.scrollHeight'+'<='+elName+'.scrollHeight'))
	else if (eval(pathLayer).scrollHeight <= eval(pathWndo).scrollHeight)
	        {			
	        //up.style.display="none";
	        //down.style.display="none";
			scrollUPcss.display = "none";
	        scrollDOWNcss.display = "none";
	        }	
		//endif
				
	//endif	               
	}

//*********************************************
//*********END SHOW SCROLLER IMAGES************
//*********************************************



//*********************************************
//****************FLIP IMAGE*******************
//*********************************************

function flipImage(whichIM)
	{	
		var id = whichIM.id;		
		var strWhichIM = whichIM.src;	
		//alert(strWhichIM);
		var strNVal = strWhichIM.length-7;
		if (strWhichIM.charAt(strNVal)!="_")
		 	{
			// ensure that the last image clicked is returned to it's natural state...
			strNVal = strLastImage.length-7;
			nVal = strNVal-0;
			strGoBackToIM = strLastImage.substring(0,nVal);
			strGoBackToIM = strGoBackToIM+".gif";
			eval(strLastID+".src = \"../images/"+strGoBackToIM+"\"");			
			
			// toggle the image to show the clicked state...
			var arrayImage = strWhichIM.split("/");
			//strNewIM = arrayImage[5]; //updated to reflect the change in the staging server...
			strNewIM = arrayImage[4]; //updated to reflect the change in the staging server...
			strNVal = strNewIM.length-4;
			nVal = strNVal-0;
			strFinalNewIM = strNewIM.substring(0,nVal);
			strFinalNewIM = strFinalNewIM+"_hi.gif";
			eval(id+".src = \"../images/"+strFinalNewIM+"\"");
			
			// now set the current image as the last image clicked as well...
			strLastImage = strFinalNewIM;
			strLastID = id;
			}	
		else
			{
			return;
			}
		//endif		
	}	
	
//*********************************************
//*************END FLIP IMAGE******************
//*********************************************

				

//*********************************************
//*************SCROLL CONTENT******************
//*********************************************	

// gets difference between window and content layers
// so maximum scroll distance can be calculated


function getY(lyr) 
	{			
		cntElem = (ns4)? document.eval(elName2).document.eval(elName).document.layers[lyr]: (ie4)? document.all[lyr]: (ie5||ie6||ns6||ie5MAC)? document.getElementById(lyr): null;
		cntcss =  (ns4)? document.eval(elName2).document.eval(elName).document.layers[lyr]: (ie4)? document.all[lyr].style: (ie5||ie6||ns6||ie5MAC)? document.getElementById(lyr).style: null;
		wincss =  (ns4)? document.eval(elName2).document.eval(elName): (ie4)? document.all[elName].style: (ie5||ie6||ns6||ie5MAC)? document.getElementById(elName).style: null;
		var winHt = (ns4)? wincss.clip.height: (ie4||ie5||ie6||ie5MAC)? winElem.clientHeight: (ns6)? winElem.offsetHeight: 0;
		var cntHt = (ns4)? cntElem.document.height: (ie4||ie5||ie6||ie5MAC)? cntElem.clientHeight: (ns6)? cntElem.offsetHeight: 0;
		return maxY = cntHt - winHt;
	}

// get y-position of content layer
function getCntTop() 
	{
		if (ns4) return cntcss.top;
		else if (ie4 || ie5 || ie6|| ie5MAC) return cntcss.pixelTop;
		else if (ns6) return parseInt(cntcss.top);
	}

// does the scrolling
// the other scroll functions check against limits and control increments
function scrollCnt(y) 
	{
		if (ns4) cntcss.top += y;		
		else if (ie4 || ie5 || ie6 || ie5MAC) cntcss.pixelTop += y; 		
		else if (ns6) cntcss.top = parseInt(cntcss.top) + y;
	}
	
function scrollCntDown(y) 
	{
		if (ns4) cntcss.top -= y;
		else if (ie4 || ie5 || ie6 || ie5MAC) cntcss.pixelTop -= y;
		else if (ns6) cntcss.top = parseInt(cntcss.top) - y;
	}


function inchDown() 
	{
		if (!done) return;
		//var y = getCntTop();	
		y = getCntTop();
		if (y>-maxY) 
			{	
				//alert('test'); 
				scrollCnt(-inc);	
				t = setTimeout("inchDown()",timer);	
			}
	}	
	

function inchUp() 
	{
		if (!done) return;
		//var y = getCntTop();	
		y = getCntTop();		
		if (y<0) 
			{ 
			scrollCnt(inc);	
			t = setTimeout("inchUp()",timer);	
	  		}
	}


/*
var arJumpTo = new Array()
function setArray()
	{	
		
	if ( ie6 || ie5 || ie4)
		{
		arJumpTo[0] = -142; // features
		arJumpTo[1] = -281;
		arJumpTo[2] = -420;
		arJumpTo[3] = -617;
		arJumpTo[4] = -772;
		arJumpTo[5] = -926;
		arJumpTo[6] = -1108;
		arJumpTo[7] = -1262; // end features
		arJumpTo[8] = -154; // sys requirements
		arJumpTo[9] = -294; // end sys requirements
		} 
	else if (ie5MAC || ns4)
		{
		arJumpTo[0] = 0;
		arJumpTo[1] = 0;
		arJumpTo[2] = 0;
		arJumpTo[3] = 0;
		arJumpTo[4] = 0;
		arJumpTo[5] = 0;
		arJumpTo[6] = 0;
		arJumpTo[7] = 0;
		}	
	}
	

function jumpTo(id) 
	{
	if (id==null)
		{
		var y = getCntTop();
		if (y<0)	
			{		
			scrollCnt(-y);
			}
		}
	else
		{
		var y = arJumpTo[id];
		if (y<0)
			{		
			scrollCnt(y);
			}
		}
	//endif	 
	}	
*/	
//*********************************************
//***********END SCROLL CONTENT****************
//*********************************************	



//*********************************************
//**************NETSCAPE RESIZE****************
//*********************************************	


// resize fix for netscape
var origWidth, origHeight;
if (ns4) 
	{
	origWidth = window.innerWidth;
  	origHeight = window.innerHeight;
 	}
//endif
 
function reDo() 
	{
 	if (window.innerWidth != origWidth || window.innerHeight != origHeight) 
    	window.location.reload();
	//endif
	}
	
	
if (ns4) window.onresize = reDo; //endif

//*********************************************
//************END NETSCAPE RESIZE**************
//*********************************************	




//*********************************************
//***************CHANGE CONTENT****************
//*********************************************	

function show(lyr) 
	{		
		var lyrcss = (ns4)? document.eval(elName2).document.eval(elName).document.layers[lyr]: (ie4)? document.all[lyr].style: (ie5||ie6||ns6||ie5MAC)? document.getElementById(lyr).style : null;
		lyrcss.visibility="visible";	
	}
	
	
	
function hide(lyr) 
	{			
		var lyrcss = (ns4)? document.eval(elName2).document.eval(elName).document.layers[lyr]: (ie4)? document.all[lyr].style: (ie5||ie6||ns6||ie5MAC)? document.getElementById(lyr).style : null;
		lyrcss.visibility="hidden";
	}
	
	

function shiftTo(lyr,x,y) 
	{
		var lyrcss = (ns4)? document.eval(elName2).document.eval(elName).document.layers[lyr]: (ie4)? document.all[lyr].style: (ie5||ie6||ns6||ie5MAC)? document.getElementById(lyr).style : null;
		if (ns4||ns6) 
			{
			lyrcss.left = x; lyrcss.top = y;
			} 
		else if (ie4||ie5||ie6||ie5MAC) 
			{
			lyrcss.pixelLeft = x; lyrcss.pixelTop = y;
			}
	}
	
	
	
function loadLyr(lyr,FromInit,doShowScroll,evnt) 
	{
		if (!done) return; // avoid not loaded errors		
		var oldLyr = curLyr;				
		hide(oldLyr);	
	  	curLyr = lyr;			
		show(lyr);	
		shiftTo(lyr,0,0); // load at page top, restore top/left to 0 	
		if (FromInit!=1 && strLastID!=null && !ns4)  // get element info for the last element an event was generated for...
		//netscape has been omitted because a new function will have to written since it does not support the srcElement 
		//event property and the target property doesn't provide the required info...
			{
			whichIM = (ns4)? evnt.target : (ie4||ie5||ie6||ns6||ie5MAC)? event.srcElement : null;
			flipImage(whichIM); // toggle image
			}
		getY(lyr);
		var goTop = (ns4)? document.eval(elName2).document.eval(elName) : (ie4||ie5||ie6||ns6||ie5MAC)? eval(elName) : null;
		goTop.scrollTop=0;// Make sure that each time a layer is loaded it starts from the top...	 
		if (doShowScroll!='no' && ie6!=true) showScroll(lyr);		
	}
	


function init(lyr,id,template) 
	{
	//if (ns4) document.captureEvents(Event.CLICK) //endif // If Netscape, capture click events for image swapping...
	elName  = (template==0)? "wndo" : (template==1)? "wndoLarge" : (template==2)? "wndoFeature" : (template==3)? "wndoArt" : null;	
	elName2 = (template==0)? "pt"   : (template==1)? "ptLarge"   : (template==2)? "ptFeature"   : (template==3)? "ptArt"   : null;	
	curLyr  = lyr;
	winElem = (ns4)? document.eval(elName2).document.eval(elName) : (ie4)? document.all[elName] : (ie5||ie6||ns6||ie5MAC)? document.getElementById(elName): null;
	wincss  = (ns4)? document.eval(elName2).document.eval(elName) : (ie4)? document.all[elName].style : (ie5||ie6||ns6||ie5MAC)? document.getElementById(elName).style: null;
	strLastID = (id!=null)? id : null; // used for image toggle	
	done = true;	// ready for images to be clicked
	var doShowScroll = (template==2)? "no" : (template==3)? "no" : "yes";
	loadLyr(lyr,1,doShowScroll);	// load first layer
	getY(lyr);	// get height of layer content for scrolling	
	}		

//*********************************************
//***********END CHANGE CONTENT****************
//*********************************************	

//-->