/*******************************************************************/
/***( resorces seminars odd even style )****************************/
/*******************************************************************/
function applyListStyles()
{
	var objBody = document.getElementsByTagName('body')[0];
	var bodyClass = objBody.className;
	// split class names into array
	var arrBodyClasses = bodyClass.split(' ');
	
	var objUL = document.getElementsByTagName('ul');
	for(var i = 0; i < objUL.length; i++)
	{
		var num = new Array();
		var k = 0;
		for(var j = 0; j < objUL[i].childNodes.length; j++)
		{
			for(var l = 0; l < arrBodyClasses.length; l++)
			{
				if(objUL[i].childNodes[j].tagName && objUL[i].childNodes[j].className.indexOf(arrBodyClasses[l]) != -1)
				{
					num[k] = objUL[i].childNodes[j].tagName && objUL[i].childNodes[j];
					k++;
					break;
				}
			}
		}
		for(var indx = 0; indx < num.length; indx++)
		{
			if(indx%2 == 0 && num[indx].className.indexOf('odd') == -1)
			{
				num[indx].className = num[indx].className + ' ' + 'odd';
			}
		}
	}
}



/*******************************************************************/
/***( image gallery )**********************************************/
/*******************************************************************/
var ImageGallery = {
	curStep: 1,
	steps: new Array(),
	init: function() {
		var gallerynavlinks = $('gallery_nav').getElementsByTagName('a');
		for(var i=0, link; link = gallerynavlinks[i]; i++) {
			var self = this;
			addEventToObject(link,'onclick',function(ev) {self.swap(ev)});
		}
	},
	swap: function(ev) {
		this.steps = $('gallery_nav').getElementsByTagName('li');
		this.stepsA = $('gallery_nav').getElementsByTagName('a');
		if (getClickedLink(ev).id.split('_')[1]) {
			var num = getClickedLink(ev).id.split('_')[1];
		} else {
			for (var i=0; i < this.steps.length; i++) {
				if ( this.stepsA[i] == getClickedLink(ev) ) {
					var num = i+1;
				}
			}
		}
		if (num != this.curStep) {
			elem = $("gallery" + num);
			prevElem = $("gallery" + this.curStep);
			elem.style.display = "block";
			prevElem.style.display = "none";
			this.steps[this.curStep-1].className = "";
			this.steps[num-1].className = "active";
			this.curStep = num;
			GalleryPro.Swap(ev);
		}		
	}
}


/***( old image gallery )**********************************************/
var curStep = 1;
var steps = new Array();
function imagegallery(num) {
steps = document.getElementById("gallery_nav").getElementsByTagName("li");
	if (num != curStep) {
		elem = document.getElementById("gallery" + num);
		prevElem = document.getElementById("gallery" + curStep);
		elem.style.display = "block";
		prevElem.style.display = "none";
		steps[curStep-1].className = "";
		steps[num-1].className = "active";
		curStep = num;
	}
}





/*******************************************************************/
/***( drawer gallery )**********************************************/
/*******************************************************************/

/***( visual effects )**********************************************/

var oDiv = document.createElement('div');
var oA = document.createElement('a');
var oP = document.createElement('p');
var oImg = document.createElement('img');
var oSpan = document.createElement('span');
var oUl = document.createElement('ul');
var oLi = document.createElement('li');
var oH5 = document.createElement('h5');
var movement;
var myGalleryObj;

function InitializeGalleryXML(url,galleryDiv) {
	AppleJAX.getXML(url,function() {
		myGalleryObj = new GalleryObj(galleryDiv,results);
		myGalleryObj.displayHTML();
	});
	return true;
}

GalleryObj = function(galleryDiv,results) {
	this.galleryStr = galleryDiv;
	this.results = results;
	this.glryX = this.results.getElementsByTagName('gallery')[0];
	this.glryitmsX = this.glryX.getElementsByTagName('galleryitems')[0];
	this.glryimgsX = new Array();
	this.glrycntntH = document.getElementById(galleryDiv);
	this.glryrlH = oDiv.cloneNode(true);
	this.glryimgglrynavH = oDiv.cloneNode(true);
	this.glrylftopacH = oDiv.cloneNode(true);
	this.glryrghtopacH = oDiv.cloneNode(true);
	this.glrymvingglryH = oDiv.cloneNode(true);
	this.glryspd = 4;
	this.thumbsacrs = 4;
	this.thumbwdth =    110; // 87; 
	this.thumbhght = 110; // 66; 
	this.thumbpding = 10;
	this.thumbalt = 'Product Thumbnail';
	this.glrywdth = 580; // 665; // nat
	this.txtclr = '#666';
	this.thumbfntsz = 10;
	this.thumbnavwdth = ((this.thumbwdth+(this.thumbpding*2))*this.thumbsacrs);
	this.glryH = new HTMLObject(oDiv.cloneNode(true));
	Object.extend(this.glryH,WhizBang.prototype);
	this.mvspd = parseFloat((this.thumbwdth+(this.thumbpding*2))/this.glryspd);
	this.glrynavprevH = oA.cloneNode(true);
	this.glrynavprevimgH = oImg.cloneNode(true);
	this.glrynavnextH = oA.cloneNode(true);
	this.glrynavnextimgH = oImg.cloneNode(true);
	this.glrynavH = oDiv.cloneNode(true);
	this.glrypgnavH = oDiv.cloneNode(true);
	this.glrymtncontH = oDiv.cloneNode(true);
	this.glrylstcntnrH = oDiv.cloneNode(true);
	this.glrylstH = oUl.cloneNode(true);
	this.rlclr;
	this.thumbnavhght;
	this.thumbnmstgl = false;
	this.flszimgtgl = false;
	this.reqattrs = new Array();
	this.thumbnum = 0;
	this.glryh4H;
	this.currglryimg = 0;
	this.currbgningthumb = 0;
	this.nextbgningthumblft = false;
	this.mvingthumblft = [];
	this.mvingthumbs = [];
	this.thumbimgs = [];
	this.flszimgs = [];
	this.errmsg = '';
	this.onimage = 'http://images.apple.com/pro/images/colored_dot20060413.gif';
	this.offimage = 'http://images.apple.com/pro/images/empty_dot20060413.gif';
	this.onoffimageheight = 7;
	this.onoffimagewidth = 7;
	this.nextarrow = 'http://images.apple.com/pro/images/arrow_right20060413.gif';
	this.prevarrow = 'http://images.apple.com/pro/images/arrow_left20060413.gif';
	this.nextarrowheight = 17;
	this.nextarrowwidth = 17;
	this.prevarrowheight = 17;
	this.prevarrowwidth = 17;
	this.oFullSzImg = oImg.cloneNode(true);
	this.oDateH5 = oH5.cloneNode(true);
	this.oDescriptionP = oP.cloneNode(true);
};

/*************************** gallery movement ***************************/
function moveRight(obj,nextBeginningThumbnail) {
	obj.thumbnum = nextBeginningThumbnail;
	obj.displayThumbnailsHTML('right');
	
	var scroll = true;

	movement = function() {
		for(i=0;i<obj.mvingthumbs.length;i++) {
			obj.mvingthumblft[i] += obj.mvspd;
			if(isFinite(obj.mvingthumblft[i])) {
				obj.mvingthumbs[i].style.left =
					obj.mvingthumblft[i] + 'px';
			}
		}

		if(obj.mvingthumblft[obj.thumbsacrs] == 0) {scroll = false;}

		var moveTimeout;
		if(scroll == true) {moveTimeout = window.setTimeout('movement();',10);}
		else {clearTimeout(moveTimeout); return true;}
		obj.currbgningthumb = nextBeginningThumbnail;
	};
	
	movement();
	obj.displayPageNavHTML();
	
};

function moveLeft(obj,nextBeginningThumbnail) {
	obj.thumbnum = nextBeginningThumbnail;
	obj.displayThumbnailsHTML('left');
	
	var scroll = true;

	movement = function() {
		for(i=obj.mvingthumbs.length-1;i>=0;i--) {
			obj.mvingthumblft[i] -= obj.mvspd;
			if(isFinite(obj.mvingthumblft[i])) {
				obj.mvingthumbs[i].style.left =
					obj.mvingthumblft[i] + 'px';
			}
		}

		if(obj.mvingthumblft[obj.thumbsacrs] == 0) {scroll = false;}

		var moveTimeout;
		if(scroll == true) {moveTimeout = window.setTimeout('movement();',10);}
		else {clearTimeout(moveTimeout); return true;}
		obj.currbgningthumb = nextBeginningThumbnail;
	};
	
	movement();
	obj.displayPageNavHTML();

}

/*************************** process functions ***************************/
function processMovingGalleryNavItem(obj,ev) {

	if(!ev) {ev = window.event;}
	if (ev.stopPropagation) { ev.stopPropagation(); } else { ev.cancelBubble = true; }
	if (ev.preventDefault) { ev.preventDefault(); } else { ev.returnValue = false; }
	var clickedLink = (window.event) ? window.event.srcElement : ev.target;
	while (!clickedLink.tagName || clickedLink.tagName.toLowerCase() != "a") {
		clickedLink = clickedLink.parentNode;
	}

	if(clickedLink === obj.glrynavprevH) {
		var nextBeginningThumbnail = (obj.currbgningthumb > 0) ?
			obj.currbgningthumb - obj.thumbsacrs :
			obj.glryimgsX.length - obj.thumbsacrs;
		moveRight(obj,nextBeginningThumbnail);
	}
	else if(clickedLink === obj.glrynavnextH) {
		var nextBeginningThumbnail =
			((obj.currbgningthumb + obj.thumbsacrs) <
			obj.glryimgsX.length) ?
			obj.currbgningthumb + obj.thumbsacrs : 0 ;
		moveLeft(obj,nextBeginningThumbnail);
	}
	else {
		var clickedNum = parseInt(clickedLink.id.split('_')[1]);
		if(clickedNum < obj.currbgningthumb) {
			moveRight(obj,clickedNum);
		}
		else if(clickedNum > obj.currbgningthumb) {
			moveLeft(obj,clickedNum);
		}
	}
	
	return false;
}

GalleryObj.prototype.processGalleryImageItem = function(ev) {
	if (!ev) { ev = window.event; }
	var clickedLink = (window.event) ? window.event.srcElement : ev.target;
	while (!clickedLink.tagName || clickedLink.tagName.toLowerCase() != "a") {
		clickedLink = clickedLink.parentNode;
	}
	myGalleryObj.currglryimg = clickedLink.parentNode.id.split('_')[1];
	if (ev.stopPropagation) { ev.stopPropagation(); } else { ev.cancelBubble = true; }
	if (ev.preventDefault) { ev.preventDefault(); } else { ev.returnValue = false; }

	return false;
};

/*************************** alternate to display HTML ***************************/
GalleryObj.prototype.displaySmallGallery = function(self) {
	self.glryimgsXcntnt = self.glryX.getElementsByTagName('galleryimage');
	var iGalleryWidth = self.glrycntntH.offsetWidth;

	for(var i=0; i<self.glryimgsXcntnt.length; i++) {
		var oItem = self.glryimgsXcntnt[i];
		var sName = (oItem.getElementsByTagName('name')[0].hasChildNodes()) ? oItem.getElementsByTagName('name')[0].firstChild.data : '';
		var sDate = (oItem.getElementsByTagName('date')[0].hasChildNodes()) ? oItem.getElementsByTagName('date')[0].firstChild.data : '';
		if(iGalleryWidth > 570 && sDate.length > 0) { sDate += ' / '; }
		var sDescription = (oItem.getElementsByTagName('description')[0].hasChildNodes()) ? oItem.getElementsByTagName('description')[0].firstChild.data : '';
		self.glryimgsX[self.glryimgsX.length] = {
			obj: oItem,
			href:oItem.getAttribute('href'),
			thumbnail:oItem.getElementsByTagName('thumbnail')[0].firstChild.data,
			fullsize:oItem.getElementsByTagName('fullsize')[0].firstChild.data,
			alt:oItem.getAttribute('alt'),
			name:sName,
			date:sDate,
			description:sDescription
		};
	}
	
	
	self.thumbalt = 'Image Thumbnail';
	self.onimage = '/pro/creative/images/onnavdot20060420.gif';
	self.offimage = '/pro/creative/images/offnavdot20060420.gif';
	self.onoffimageheight = 9;
	self.onoffimagewidth = 9;
	self.nextarrow = '/pro/creative/images/rightgalleryarrow20060420.gif';
	self.prevarrow = '/pro/creative/images/leftgalleryarrow20060420.gif';
	self.nextarrowheight = 14;
	self.nextarrowwidth = 12;
	self.prevarrowheight = 14;
	self.prevarrowwidth = 12;
	self.smallglry = true;
	
	if(iGalleryWidth < 570) {
		self.thumbsacrs = 6;
		self.thumbpding = 5;
		self.thumbwdth = 41;
		self.thumbhght = 40;
		self.glrywdth = 370;
		self.thumbnavwdth = ((self.thumbwdth+(self.thumbpding*2))*self.thumbsacrs);
		self.mvspd = parseFloat((self.thumbwdth+(self.thumbpding*2))/self.glryspd);
		self.smallglryimgheight = 178;
		self.smallglryimgwidth = 300;

		if(self.glryimgsX.length > 1) { self.displayHTML(); }
		self.displaySmallGalleryImg();
	} else {
		self.thumbsacrs = 7;
		self.thumbpding = 10;
		self.thumbwdth = 55;
		self.thumbhght = 55;
		self.glrywdth = 572;
		self.thumbnavwdth = ((self.thumbwdth+(self.thumbpding*2))*self.thumbsacrs);
		self.mvspd = parseFloat((self.thumbwdth+(self.thumbpding*2))/self.glryspd);
		self.smallglryimgheight = 183;
		self.smallglryimgwidth = 260;
		
		if(self.glryimgsX.length > 1) { self.displayHTML(); }
		self.displayWideGalleryImg();
	}

};
GalleryObj.prototype.displayWideGalleryImg = function() {
	var oGlryImgX = this.glryimgsX[0];
	this.oFullSzImg.src = oGlryImgX.fullsize;
	this.oFullSzImg.alt = oGlryImgX.alt;
	this.oDateH5.appendChild(document.createTextNode(oGlryImgX.date));
	this.oDescriptionP.appendChild(document.createTextNode(oGlryImgX.description));
	var oDateDescDiv = oDiv.cloneNode(true);

	
	this.oFullSzImg.style.width = this.smallglryimgwidth+'px';
	this.oFullSzImg.style.height = this.smallglryimgheight+'px';
	this.oFullSzImg.style.margin = '0 15px 0 33px';
	if(browser.isIE == true) {
		this.oFullSzImg.style.styleFloat = 'left';
	} else {
		this.oFullSzImg.style.cssFloat = 'left';
	}

	oDateDescDiv.style.margin = '0 33px 0 0';

	this.oDateH5.style.margin = '0';
	this.oDateH5.style.color = '#666666';
	this.oDateH5.style.fontSize = '11px';
	this.oDateH5.style.display = 'inline';

	this.oDescriptionP.style.margin = '0';
	this.oDescriptionP.style.padding = '0';
	this.oDescriptionP.style.color = '#999999';
	this.oDescriptionP.style.fontSize = '10px';
	this.oDescriptionP.style.display = 'inline';
	
	oDateDescDiv.appendChild(this.oDateH5);

	oDateDescDiv.appendChild(this.oDescriptionP);
	this.glrycntntH.appendChild(this.oFullSzImg);
	this.glrycntntH.appendChild(oDateDescDiv);
};
GalleryObj.prototype.displaySmallGalleryImg = function() {
	var oGlryImgX = this.glryimgsX[0];
	this.oFullSzImg.src = oGlryImgX.fullsize;
	this.oFullSzImg.alt = oGlryImgX.alt;
	this.oDateH5.appendChild(document.createTextNode(oGlryImgX.date));
	this.oDescriptionP.appendChild(document.createTextNode(oGlryImgX.description));

	this.oFullSzImg.style.width = this.smallglryimgwidth+'px';
	this.oFullSzImg.style.height = this.smallglryimgheight+'px';
	this.oFullSzImg.style.margin = '0 35px';
	this.oDateH5.style.width = this.smallglryimgwidth+'px';
	this.oDateH5.style.margin = '5px 35px';
	this.oDateH5.style.color = '#666666';
	this.oDateH5.style.fontSize = '11px';
	this.oDescriptionP.style.width = this.smallglryimgwidth+'px';
	this.oDescriptionP.style.margin = '0 35px';
	this.oDescriptionP.style.color = '#999999';
	this.oDescriptionP.style.fontSize = '10px';
	
	this.glrycntntH.appendChild(this.oFullSzImg);
	this.glrycntntH.appendChild(this.oDateH5);
	this.glrycntntH.appendChild(this.oDescriptionP);
};
GalleryObj.prototype.processSmallGalleryFSImg = function(obj,ev) {
	stopDefaultAction(ev);
	var oClickedLink = getClickedLink(ev);
	var iImgNum = oClickedLink.parentNode.id.split('_')[1];
	var oGlryImgX = obj.glryimgsX[iImgNum];
	
	obj.oFullSzImg.src = oGlryImgX.fullsize;
	obj.oFullSzImg.alt = oGlryImgX.alt;
	obj.oDateH5.innerHTML = oGlryImgX.date;
	obj.oDescriptionP.innerHTML = oGlryImgX.description;
};
GalleryObj.prototype.getGalleryImages = function(self,func) {
	self.thumbnmstgl = true;
	if(self.glryimgsX.length <= 0 && self.glryX.getElementsByTagName('galleryitems').length > 0) {
		if(self.glryitmsX.getAttribute('fromurl')) {
			var xmlfile = self.glryitmsX.getAttribute('fromurl');
			
			var images = new Array();
			AppleJAX.getXML(xmlfile,function(){
				var category;
				var results = req.responseXML;
				//if(self.glryitmsX.getAttribute('fromelement')) {
				//	category = results.getElementsByTagName(self.glryitmsX.getAttribute('fromelement'))[0];
				//}
				category = results;
				var items = self.glryitmsX.getElementsByTagName('item');
				for(var i=0;i<items.length;i++) {
					var item = items[i].firstChild.data;
					var oItem = category.getElementsByTagName(item)[0].getElementsByTagName('galleryimage')[0];
					self.glryimgsX[i] = {
						obj:oItem,
						href:oItem.getAttribute('href'),
						thumbnail:oItem.getElementsByTagName('thumbnail')[0].firstChild.data,
						alt:oItem.getAttribute('alt'),
						name:oItem.getElementsByTagName('name')[0].firstChild.data,
						learnmore:oItem.getAttribute('learnmore'),
						buynow:oItem.getAttribute('buynow')
					};
				}
				self.displayHTML();
				if(func) {func();}
			});
		}
	} else {
		self.displayHTML();
		if(func) {func();}
	}
};
GalleryObj.prototype.setGalleryList = function(self) {
	self.glrywdth = self.glrywdth-170;
	
	self.glrylstcntnrH.style.width = '170px';

	self.glrylstH.style.width = '170px';
	
	for(var i=0;i<self.glryimgsX.length;i++) {
		var listitem = oLi.cloneNode(true);
		listitem.appendChild(document.createTextNode(self.glryimgsX[i].name));
		listitem.style.listStyle = 'disc inside';
		self.glrylstH.appendChild(listitem);
	}
	self.glrylstcntnrH.style.position = 'absolute';
	self.glrylstcntnrH.style.top = '10px';
	self.glrylstcntnrH.style.left = '10px';
	self.glrycntntH.style.position = 'absolute';
	self.glrycntntH.style.top = '10px';
	self.glrycntntH.style.left = '180px';
	self.glrylstcntnrH.appendChild(self.glrylstH);
	var containerDiv = self.glrycntntH.parentNode;
	containerDiv.insertBefore(self.glrylstcntnrH,self.glrycntntH);
	
	self.displayHTML();

	var glrylstcntnrheight = self.glrylstcntnrH.offsetHeight;
	var drawerheight = 184;
	var glrylstcntnrtop = (drawerheight-glrylstcntnrheight)/2;
	self.glrylstcntnrH.style.top = glrylstcntnrtop+'px';

	var glryheight = self.glrycntntH.offsetHeight;
	var glrytop = (drawerheight-glryheight)/2;
	self.glrycntntH.style.top = glrytop+'px';
};
/*************************** display HTML ***************************/
GalleryObj.prototype.displayHTML = function() {
	this.pgs = parseInt(this.glryimgsX.length/this.thumbsacrs);
	
	if(this.glryimgsX.length <= 0) {
		this.errmsg += 'What are you thinking? A gallery with no images? That won\'t work! ';
	}
	var requiredattributeerrors = '';
	for(i=0;i<this.reqattrs.length;i++) {
		if(!(this.glryX.getAttribute(this.reqattrs[i]))) {
			if(i == (this.reqattrs.length-1)) {
				requiredattributeerrors += 'and ' + this.reqattrs[i];
			} else {
				requiredattributeerrors += this.reqattrs[i] + ', ';
			}
		}
	}
	if(requiredattributeerrors.length > 0) {
		this.errmsg += 'You need to add attributes to the gallery tag.  Please add: ' +
			requiredattributeerrors + '. ';
	}
	
	if(this.glryX.getAttribute('rulecolor')) { //should be hasAttribute but doesn't work in IE
		this.rlclr = this.glryX.getAttribute('rulecolor');
	}
	if(this.glryX.getAttribute('thumbnailnavheight')) { //should be hasAttribute
		this.thumbnavhght = parseInt(this.glryX.getAttribute('thumbnailnavheight'));
	} else {
		this.thumbnavhght = this.thumbhght+60+this.onoffimageheight;
	}

	var remainder = (this.glryimgsX.length%this.thumbsacrs);
	if(remainder > 0) {
		this.errmsg += 'You have an incorrect number of gallery images.  ' +
			'Please check your XML file. ' + this.glryimgsX.length +
			' gallery images and ' + this.thumbsacrs + ' thumbnails across. You need ' +
			(this.thumbsacrs-parseInt(remainder)) + ' more or ' + remainder + ' less. ';
	}

	this.glryH.setAttribute('id',this.galleryStr+'gallery');
	this.glryrlH.setAttribute('id',this.galleryStr+'galleryrule');
	this.glryimgglrynavH.setAttribute('id',this.galleryStr+'imagegallerynav');
	this.glrypgnavH.setAttribute('id',this.galleryStr+'pagenav');
	this.glrymtncontH.setAttribute('id',this.galleryStr+'motioncontainer');
	this.glrylftopacH.setAttribute('id',this.galleryStr+'leftopacity');
	this.glryrghtopacH.setAttribute('id',this.galleryStr+'rightopacity');
	this.glrymvingglryH.setAttribute('id',this.galleryStr+'movinggallery');
	
	var gallerynavtoggle = false;
	if(this.glryimgsX.length > this.thumbsacrs) {
		gallerynavtoggle = this.displayPrevNextNavHTML();
		this.displayPageNavHTML();
	}
	this.displayOpacityHTML();
	
	this.glrymtncontH.appendChild(this.glrymvingglryH);
	this.glryimgglrynavH.appendChild(this.glrypgnavH);
	this.glryimgglrynavH.appendChild(this.glrymtncontH);
	
	var moveSpeedString = this.mvspd.toString();
	var moveSpeedDecimal = this.mvspd.toString().split('.')[1];

	if(moveSpeedDecimal && moveSpeedDecimal.length >= 10) {
		this.errmsg += 'Watch your speed! Your speed will not work ' +
			'in this scenario. Your current speed is ' + this.glryspd +
			' and your image width with padding is ' +
			(this.thumbwdth+(this.thumbpding*2)) +
			'. This results in an actual speed of ' + this.mvspd +
			', which may be a repeating decimal. ';
	}
	
	if(this.errmsg.length > 0) {
		var errorText = document.createTextNode(this.errmsg);
		this.glrycntntH.appendChild(errorText);
	} else {

		this.preloadImages();
		this.displayThumbnailsHTML();
		this.styleHTML();
		if(this.flszimgtgl) {
			this.glrycntntH.appendChild(this.glryH);
			this.glrycntntH.appendChild(this.glryrlH);
		}
		if(gallerynavtoggle) {this.glrycntntH.appendChild(this.glrynavH);}
		this.glrycntntH.appendChild(this.glryimgglrynavH);
	}
};

GalleryObj.prototype.preloadImages = function() {
	for(i=0;i<this.glryimgsX.length;i++) {
		if(this.glryimgsX[i].length > 0 && this.glryimgsX[i].thumbnail) {
			this.thumbimgs[i] = new Image();
			this.thumbimgs[i].src = this.glryimgsX[i].thumbnail;
		}

	}
};

GalleryObj.prototype.styleHTML = function() {
	this.glrycntntH.style.width = this.glrywdth + 'px';
	if(!this.smallglry) {
		this.glrycntntH.style.cssFloat = 'left';
	}
	this.glryrlH.style.width = this.glrywdth + 'px';
	if(this.rlclr) {
		this.glryrlH.style.borderTop = '1px solid ' + this.rlclr;
	}
	
	this.glrypgnavH.style.width = this.glrywdth + 'px';
	this.glrypgnavH.style.textAlign = 'center';
	this.glrypgnavH.style.margin = '0 0 10px 0';
	
	this.glrymtncontH.style.width = this.thumbnavwdth + 'px';
	this.glrymtncontH.style.height = this.thumbnavhght + 'px';
	this.glrymtncontH.style.margin = '0 ' + (this.glrywdth-this.thumbnavwdth)/2 + 'px'; 

	this.glrymtncontH.style.padding = '0';
	this.glrymtncontH.style.overflow = 'hidden';
	this.glrymtncontH.style.position = 'relative';
	
	this.glrymvingglryH.style.width = this.thumbnavwdth + 'px';
	this.glrymvingglryH.style.height = this.thumbnavhght + 'px';
	this.glrymvingglryH.style.position = 'relative';
};

GalleryObj.prototype.displayOpacityHTML = function() {
	if(this.glryX.getElementsByTagName('gallerysideopacity').length > 0) {
		var gallerysideopacityXML = this.glryX.getElementsByTagName('gallerysideopacity')[0];
		var galleryleftopacityXML = gallerysideopacityXML.getElementsByTagName('leftopacity')[0];
		var galleryrightopacityXML = gallerysideopacityXML.getElementsByTagName('rightopacity')[0];

		this.glrylftopacH.style.position = 'absolute';
		this.glrylftopacH.style.left = '0px';
		this.glrylftopacH.style.top = '0px';
		this.glrylftopacH.style.height = this.thumbnavhght + 'px';
		this.glrylftopacH.style.width = galleryleftopacityXML.getAttribute('width') + 'px';
		this.glrylftopacH.style.background = 'url(' + galleryleftopacityXML.getAttribute('src') + ') repeat-y';
		this.glrylftopacH.style.zIndex = '200';
		this.glrylftopacH.style.behavior = 'url(/main/js/iepngfix/iepngfix.htc)';
	
		this.glryrghtopacH.style.position = 'absolute';
		this.glryrghtopacH.style.right = '0px';
		this.glryrghtopacH.style.top = '0px';
		this.glryrghtopacH.style.height = this.thumbnavhght + 'px';
		this.glryrghtopacH.style.width = galleryrightopacityXML.getAttribute('width') + 'px';
		this.glryrghtopacH.style.background = 'url(' + galleryrightopacityXML.getAttribute('src') + ') repeat-y';
		this.glryrghtopacH.style.zIndex = '200';
		this.glryrghtopacH.style.behavior = 'url(/main/js/iepngfix/iepngfix.htc)';
	
		this.glrymtncontH.appendChild(this.glrylftopacH);
		this.glrymtncontH.appendChild(this.glryrghtopacH);
	}
};

GalleryObj.prototype.displayPageNavHTML = function() {

		var pagenavonimg = oImg.cloneNode(true);
		pagenavonimg.setAttribute('width',this.onoffimagewidth);
		pagenavonimg.setAttribute('height',this.onoffimageheight);
		pagenavonimg.setAttribute('border','0');
		pagenavonimg.style.margin = '2px 4px 0pt'; // '0 2px'; // nat
	
		while(this.glrypgnavH.hasChildNodes()) { this.glrypgnavH.removeChild(this.glrypgnavH.firstChild); }
	
		for(i=0;i<this.pgs;i++) {
			if(this.currbgningthumb == (i*this.thumbsacrs)) {
					pagenavonimg.setAttribute('src',this.onimage);

				this.glrypgnavH.appendChild(pagenavonimg);
			}
			else {
				var pagenavoffa = oA.cloneNode(true);
				var pagenavoffimg = pagenavonimg.cloneNode(true);
		
				pagenavoffa.setAttribute('id',this.galleryStr+'pagenav_'+(this.thumbsacrs*i));				
				pagenavoffa.setAttribute('href','#');
				pagenavoffimg.setAttribute('src',this.offimage);
	
				pagenavoffa.appendChild(pagenavoffimg);
				this.glrypgnavH.appendChild(pagenavoffa);

				var myObj = this;
				addEventToObject(pagenavoffa,'onclick',function(ev){processMovingGalleryNavItem(myObj,ev);});

			}
		}
	
	return true;
};

GalleryObj.prototype.displayPrevNextNavHTML = function() {


		this.glrynavH.setAttribute('id',this.galleryStr+'gallerynav');
	

		this.glrynavprevH.setAttribute('href','#');
		this.glrynavnextH.setAttribute('href','#');
		this.glrynavprevH.setAttribute('id',this.galleryStr+'prevgallerynav');
		this.glrynavnextH.setAttribute('id',this.galleryStr+'nextgallerynav');
		

		this.glrynavprevimgH.setAttribute('src',this.prevarrow);
		this.glrynavnextimgH.setAttribute('src',this.nextarrow);

		
		this.glrynavprevimgH.setAttribute('width',this.prevarrowwidth);
		this.glrynavnextimgH.setAttribute('width',this.nextarrowwidth);
		this.glrynavprevimgH.setAttribute('height',this.prevarrowheight);
		this.glrynavnextimgH.setAttribute('height',this.nextarrowheight);
		this.glrynavprevimgH.setAttribute('border','0');
		this.glrynavnextimgH.setAttribute('border','0');

		this.glrynavprevimgH.setAttribute('alt','Previous');
		this.glrynavnextimgH.setAttribute('alt','Next');
		
		this.glrynavprevH.appendChild(this.glrynavprevimgH);
		this.glrynavnextH.appendChild(this.glrynavnextimgH);
		
		this.glrynavH.appendChild(this.glrynavprevH);
		this.glrynavH.appendChild(this.glrynavnextH);
	
		this.glrynavH.style.width = this.glrywdth + 'px';
		this.glrynavH.style.position = 'relative';

		this.glrynavprevH.style.position = 'absolute';
		this.glrynavnextH.style.position = 'absolute';

		if(this.glryX.getElementsByTagName('gallerypagenav')[0]) {
			this.glrynavprevH.style.top = (((this.thumbnavhght-parseInt(this.prevarrowheight))/2)+parseInt(this.onoffimageheight)+((this.thmbnmstgl) ? 10 : 0)) + 'px';
			this.glrynavnextH.style.top = (((this.thumbnavhght-parseInt(this.nextarrowheight))/2)+parseInt(this.onoffimageheight)+((this.thmbnmstgl) ? 10 : 0)) + 'px';
		} else {

			this.glrynavprevH.style.top = ((this.thumbnavhght-parseInt(this.prevarrowheight))/2) + 'px';
			this.glrynavnextH.style.top = ((this.thumbnavhght-parseInt(this.nextarrowheight))/2) + 'px';
		}

		this.glrynavprevH.style.left = (((this.glrywdth-this.thumbnavwdth)/2)-(parseInt(this.prevarrowwidth)+10)) + 'px';
		this.glrynavnextH.style.right = (((this.glrywdth-this.thumbnavwdth)/2)-(parseInt(this.nextarrowwidth)+10)) + 'px'; // '100px'; //  // nat test
		
		this.glrynavprevH.style.zIndex = 100;
		this.glrynavnextH.style.zIndex = 100;

		var myObj = this;
		
addEventToObject(this.glrynavprevH,'onclick',function(ev){processMovingGalleryNavItem(myObj,ev);});
		addEventToObject(this.glrynavnextH,'onclick',function(ev){processMovingGalleryNavItem(myObj,ev);});

		return true;

};

GalleryObj.prototype.displayThumbnailsHTML = function(direction) {
	for(i=0;i<this.glrymvingglryH.childNodes.length;i++) {
		if((i < this.currbgningthumb) || (i > (this.currbgningthumb+this.thumbsacrs))) {
			var childToRemove = document.getElementById(this.galleryStr+'imagenav_'+i);
			if(childToRemove) {
				this.glrymvingglryH.removeChild(childToRemove);
			}
		}
	}

	if(this.mvingthumbs.length > this.thumbsacrs) {
		this.mvingthumbs.splice(0,this.thumbsacrs);
		this.mvingthumblft.splice(0,this.thumbsacrs);
	}

	var endingThumbnail = (this.thumbnum+this.thumbsacrs);

	var i = this.thumbsacrs;
	var j = this.thumbsacrs;

	for(this.thumbnum;this.thumbnum<endingThumbnail;this.thumbnum++) {
		
		var galleryimagedivHTML = oDiv.cloneNode(true);
		var galleryimageaHTML = oA.cloneNode(true);
		var galleryimagetitleaHTML = oA.cloneNode(true);
		var galleryimageimgHTML = oImg.cloneNode(true);
		var galleryimagespanHTML = oSpan.cloneNode(true);
		var galleryimagelearnmoreimgHTML = oImg.cloneNode(true);
		var galleryimagebuynowimgHTML = oImg.cloneNode(true);
		var galleryimagelearnmoreaHTML = oA.cloneNode(true);
		var galleryimagebuynowaHTML = oA.cloneNode(true);
		var galleryimagelearnmorespanHTML = oSpan.cloneNode(true);
		var galleryimagebuynowspanHTML = oSpan.cloneNode(true);
		var buttonHeight = '17px';
		var buttonWidth = '86px';
		

		galleryimagedivHTML.setAttribute('id',this.galleryStr+'imagenav_'+this.thumbnum);
		galleryimagedivHTML.style.position = 'absolute';
		galleryimagedivHTML.style.width = (this.thumbwdth+(this.thumbpding*2)) + 'px';
		galleryimagedivHTML.style.height = this.thumbnavhght + 'px';

		galleryimagedivHTML.style.top = '0px';
		var thumbnailLeft;

		if(direction === 'right') {
			thumbnailLeft = (-(this.thumbwdth+(this.thumbpding*2))*i);
			i--;
		}
		else if(direction === 'left') {
			thumbnailLeft = ((this.thumbwdth+(this.thumbpding*2))*j);
			j++;
		}
		else {
			thumbnailLeft = (this.thumbnum*(this.thumbwdth+(this.thumbpding*2)));
		}

		galleryimagedivHTML.style.left = thumbnailLeft + 'px';
		this.mvingthumblft.push(thumbnailLeft);

		galleryimagedivHTML.style.padding = '0 ' + this.thumbpding + 'px';

		// add link to a thumbnail
		if(this.glryimgsX[this.thumbnum].href){
			galleryimageaHTML.setAttribute('href',this.glryimgsX[this.thumbnum].href);
		}


		if(this.glryimgsX[this.thumbnum].thumbnail) {
			galleryimageimgHTML.setAttribute('src',this.glryimgsX[this.thumbnum].thumbnail);
		}

		galleryimageimgHTML.setAttribute('width',this.thumbwdth);
		galleryimageimgHTML.setAttribute('height',this.thumbhght);

		if(this.glryimgsX[this.thumbnum].alt) {
			galleryimageimgHTML.setAttribute('alt',this.glryimgsX[this.thumbnum].alt);
		}

		galleryimageimgHTML.setAttribute('border','0');

		// display title with a link underneath of each thumbnail
		if(this.thumbnmstgl && this.glryimgsX[this.thumbnum].name) {
			var childTitle = document.createTextNode(this.glryimgsX[this.thumbnum].name);
			if(this.glryimgsX[this.thumbnum].href)
			{
				galleryimagetitleaHTML.setAttribute('href',this.glryimgsX[this.thumbnum].href);
				galleryimagetitleaHTML.style.color = '#666';
				
			}
			galleryimagetitleaHTML.appendChild(childTitle);
			galleryimagespanHTML.appendChild(galleryimagetitleaHTML);
			
		}
		
		// display Learn More button with Country code 
		if(this.thumbnmstgl && this.glryimgsX[this.thumbnum].learnmore) {
			galleryimagelearnmoreimgHTML.setAttribute('src', 'http://images.apple.com/euro/pro/images/btnLearnmore_'+thelocale+'.gif'); 
			galleryimagelearnmoreimgHTML.setAttribute('border','0');
			galleryimagelearnmoreimgHTML.setAttribute('width',buttonWidth);
			galleryimagelearnmoreimgHTML.setAttribute('height',buttonHeight);
			galleryimagelearnmoreimgHTML.style.width = buttonWidth;
			galleryimagelearnmoreimgHTML.style.height = buttonHeight;
			galleryimagelearnmoreaHTML.setAttribute('href',this.glryimgsX[this.thumbnum].learnmore);
			galleryimagelearnmoreaHTML.appendChild(galleryimagelearnmoreimgHTML);
			galleryimagelearnmorespanHTML.appendChild(galleryimagelearnmoreaHTML);
		}
		
		// display Buy Now button with Country code  
		if(this.thumbnmstgl && this.glryimgsX[this.thumbnum].buynow) {
			galleryimagebuynowimgHTML.setAttribute('src', 'http://images.apple.com/euro/pro/images/btnBuynow_'+thelocale+'.gif');
			galleryimagebuynowimgHTML.setAttribute('border','0');
			galleryimagebuynowimgHTML.setAttribute('width',buttonWidth);
			galleryimagebuynowimgHTML.setAttribute('height',buttonHeight);
			galleryimagebuynowimgHTML.style.width = buttonWidth;
			galleryimagebuynowimgHTML.style.height = buttonHeight;
			galleryimagebuynowaHTML.setAttribute('href',this.glryimgsX[this.thumbnum].buynow);
			galleryimagebuynowaHTML.appendChild(galleryimagebuynowimgHTML);
			galleryimagebuynowspanHTML.appendChild(galleryimagebuynowaHTML);
		}
		
		


		
		// SPAN that wraps thumb image and title
		galleryimagespanHTML.style.display = 'block';
		galleryimagespanHTML.style.width = this.thumbwdth + 'px';
		galleryimagespanHTML.style.textAlign = 'center';
		//galleryimagespanHTML.style.margin = '0 ' + thumbnailpadding + 'px';
		galleryimagespanHTML.style.fontSize = this.thumbfntsz + 'px';
		
		// SPAN that wraps Learn More button
		galleryimagelearnmorespanHTML.style.display = 'block';
		galleryimagelearnmorespanHTML.style.width = this.thumbwdth + 'px';
		galleryimagelearnmorespanHTML.style.textAlign = 'center';
		galleryimagelearnmorespanHTML.style.padding =  this.thumbpding + 'px' + ' 0 0 0';
		
		// SPAN that wraps Buy Now button
		galleryimagebuynowspanHTML.style.display = 'block';
		galleryimagebuynowspanHTML.style.width = this.thumbwdth + 'px';
		galleryimagebuynowspanHTML.style.textAlign = 'center';
		galleryimagebuynowspanHTML.style.padding =  this.thumbpding + 'px' + ' 0 0 0';

		//if(this.glryimgsX[this.thumbnum].hasChildNodes()) {
		galleryimageaHTML.appendChild(galleryimageimgHTML);
		galleryimagedivHTML.appendChild(galleryimageaHTML);
		galleryimagedivHTML.appendChild(galleryimagespanHTML);
		if(this.thumbnmstgl && this.glryimgsX[this.thumbnum].buynow)
			galleryimagedivHTML.appendChild(galleryimagebuynowspanHTML); //nat
		if(this.thumbnmstgl && this.glryimgsX[this.thumbnum].learnmore)
			galleryimagedivHTML.appendChild(galleryimagelearnmorespanHTML); //nat
			
			if(this.flszimgtgl) {
				addEventToObject(galleryimageaHTML,'onclick',this.processGalleryImageItem);
			}
			var myObj = this;
			if(this.smallglry) {
				addEventToObject(galleryimageaHTML,'onclick',function(ev){myObj.processSmallGalleryFSImg(myObj,ev);});
			}

		this.glrymvingglryH.appendChild(galleryimagedivHTML);
		

		this.mvingthumbs.push(galleryimagedivHTML);
		
	}

	return true;

};

GalleryObj.prototype.displayLargeImageHTML = function(galleryimage) {
	var galleryImgHTML = oImg.cloneNode(true);
	this.glryh4H = document.createElement('h4');
	var galleryH4Text;
	if(galleryimage.getElementsByTagName('name')[0] && galleryimage.getElementsByTagName('name')[0].hasChildNodes()) {
		galleryH4Text = document.createTextNode(galleryimage.getElementsByTagName('name')[0].firstChild.data);
	} else {
		galleryH4Text = document.createTextNode('');
	}
	
	while(this.glryH.hasChildNodes()) { this.glryH.removeChild(this.glryH.firstChild); }
	
	if(galleryimage.getElementsByTagName('fullsize')[0] && galleryimage.getElementsByTagName('fullsize')[0].hasChildNodes()) {
	galleryImgHTML.setAttribute('src',galleryimage.getElementsByTagName('fullsize')[0].firstChild.data);
	}

	galleryImgHTML.setAttribute('alt',galleryimage.getAttribute('alt'));
	galleryImgHTML.setAttribute('border','0');
	galleryImgHTML.setAttribute('width',this.flszwdth);
	galleryImgHTML.setAttribute('height',this.flszhght);
	
	galleryImgHTML.style.width = this.flszwdth + 'px';
	galleryImgHTML.style.height = this.flszhght + 'px';
		
	this.glryh4H.appendChild(galleryH4Text);
	
	this.glryH.style.width = this.glrywdth + 'px';
	this.glryH.style.height = (this.flszhght+this.lrgfntsz+5) + 'px';
	this.glryH.style.padding = '0 0 ' + (this.lrgfntsz+5) + 'px 0';
	this.glryH.style.textAlign = 'center';
	
	this.glryh4H.style.color = this.txtclr;
	this.glryh4H.style.fontSize = this.lrgfntsz + 'px';

	this.glryH.style.visibility = 'hidden';
	
	this.glryH.appendChild(galleryImgHTML);
	this.glryH.appendChild(this.glryh4H);
	
	
	this.glryH.Fade(600,0,100,50,10,10);
	
	return true;
};



/*******************************************************************/
/***( drawer )******************************************************/
/*******************************************************************/

hardwareObj = function(){};
softwareObj = function(){};

var div = document.createElement('div');
var h3 = document.createElement('h3');
var p = document.createElement('p');
var a = document.createElement('a');
var img = document.createElement('img');
var ul = document.createElement('ul');
var li = document.createElement('li');
var span = document.createElement('span');

 
var Drawer = {
	results : Object,
	drawerDiv : Object,
	drawerXML : Object,
	highestIndex : 601,
	edgeOverlap : parseInt(5),
	sections : new Array('Challenges','Hardware','Software','Tricks'),
	challengesDiv : div.cloneNode(true),
	hardwareDiv : div.cloneNode(true),
	softwareDiv : div.cloneNode(true),
	tricksDiv : div.cloneNode(true),
	challengesHeader : h3.cloneNode(true),
	hardwareHeader : h3.cloneNode(true),
	softwareHeader : h3.cloneNode(true),
	tricksHeader : h3.cloneNode(true),
	hardwareClickSpan : span.cloneNode(true),
	softwareClickSpan : span.cloneNode(true),
	tricksClickSpan : span.cloneNode(true),
	hardwareClickAnchor : a.cloneNode(true),
	softwareClickAnchor : a.cloneNode(true),
	tricksClickAnchor : a.cloneNode(true),
	hardwareContentDiv : div.cloneNode(true),
	softwareContentDiv : div.cloneNode(true),
	tricksContentDiv : div.cloneNode(true),
	hardwareToggleDiv : div.cloneNode(true),
	softwareToggleDiv : div.cloneNode(true),
	tricksToggleDiv : div.cloneNode(true),
	hardwareToggleA : a.cloneNode(true),
	softwareToggleA : a.cloneNode(true),
	tricksToggleA : a.cloneNode(true),
	hardwareToggleImg : img.cloneNode(true),
	softwareToggleImg : img.cloneNode(true),
	tricksToggleImg : img.cloneNode(true),
	hardwareOpen : true,
	softwareOpen : true,
	tricksOpen : true,
	lastOpen : Object,
	hardwaregalleryxml : String,
	softwaregalleryxml : String,
	hardwaregalleryid : 'hardwaregallery',
	softwaregalleryid : 'softwaregallery',
	duration: 300,
	step: 30,
	dottedLine: '#B4B7BA',
	hiColor: '#a6a6a6',
	openColor: '#F5F6F6',
	closeColor: '#CED0D1',
	openTextColor: '#000000',
	closeTextColor: '#FFFFFF',
	colorSpeed: 1,
	hexAlphabet: '0123456789ABCDEF',
	drawerStyles: new Array(),
	tricksColumnHeight: 0,
	
	init : function(xmlfile,drawer) {
		this.drawerDiv = new HTMLObject($(drawer));
		AppleJAX.getXMLwithResults(xmlfile,function(results) {
			Drawer.displayHTML(results);
		});
		
	},
	
	toggleImgCloseLight : function() {return 'http://images.apple.com/pro/images/triangleopenedwhite20060321.png';},
	toggleImgCloseDark : function() {return 'http://images.apple.com/pro/images/triangleopenedgray20060321.png';},
	toggleImgOpen: function() {return 'http://images.apple.com/pro/images/triangleclosed20060321.png';},
	edgeImg : function() {return 'http://images.apple.com/pro/images/edge20060321_new.png';},
	drawerWidth : function() {return parseInt(1000);}, // 1004);}, // nat
	drawerHeight : function() {return parseInt(220);},//  184);}, // nat
	challengesWidth : function() {
		var challenges = Drawer.drawerXML.getElementsByTagName('challenges')[0];
		return parseInt(challenges.getAttribute('width'));
	},

	displayHTML : function(results) {
		this.results = results;
		this.drawerXML = this.results.getElementsByTagName('drawer')[0];

		var isHardwareGallery = true;
		var isSoftwareGallery = true;
		for(var i=0;i<=this.sections.length;i++) {
			this.displaySection(this.sections[i]);
			this.styleSection(this.sections[i]);
			
			//is this section Gallery or Text?
			var sectionXMLContent = "";
			if(this.sections[i])
			{
				sectionXMLContent = this.getSection(this.sections[i]);
				var nodeCount = sectionXMLContent.childNodes.length;
				var children = sectionXMLContent.childNodes;
				for(var j = 0; j < nodeCount; j++)
				{
					if(children[j].tagName && children[j].tagName.indexOf('gallery') == -1)
					{
						if(this.sections[i] == 'Hardware')
							isHardwareGallery = false;
						else if(this.sections[i] == 'Software')
							isSoftwareGallery = false;
						break;
					}
				}
			}
		}
		this.drawerDiv.appendChild(this.challengesDiv);
		this.drawerDiv.appendChild(this.hardwareDiv);
		this.drawerDiv.appendChild(this.softwareDiv);
		this.drawerDiv.appendChild(this.tricksDiv);
		
		this.drawEdges();
		
		var challengesheight = this.challengesDiv.offsetHeight;
		this.challengesDiv.style.padding = ((this.drawerHeight()-challengesheight)/2)+'px 15px';
		
		var tricksContentDivs = this.tricksContentDiv.getElementsByTagName('div');
		for(var i=0;i<tricksContentDivs.length;i++) {
			var contentDivHeight = tricksContentDivs[i].offsetHeight;
			this.tricksColumnHeight = Math.max(this.tricksColumnHeight, contentDivHeight);
		}
		var tricksContentTop = (this.drawerHeight()-this.tricksColumnHeight)/2;
		for(var i=0;i<tricksContentDivs.length;i++) {
			var column = tricksContentDivs[i];
			column.style.height = this.tricksColumnHeight+'px';
			column.style.top = tricksContentTop+'px';
		}
		

		var oHardware = this.drawerXML.getElementsByTagName('hardware')[0];
		var oSoftware = this.drawerXML.getElementsByTagName('software')[0];
		
		// Get Gallery images only if XML section contains Gallery.
		if(isHardwareGallery && isSoftwareGallery)
		{
			hardwareObj = new GalleryObj(this.hardwaregalleryid,oHardware);
			hardwareObj.getGalleryImages(hardwareObj,function(){
				softwareObj = new GalleryObj(Drawer.softwaregalleryid,oSoftware);
				softwareObj.getGalleryImages(softwareObj);
			});
		}
		else if(isHardwareGallery && !isSoftwareGallery)
		{
			hardwareObj = new GalleryObj(this.hardwaregalleryid,oHardware);
			hardwareObj.getGalleryImages(hardwareObj);
		}
		else if(!isHardwareGallery && isSoftwareGallery)
		{
			softwareObj = new GalleryObj(Drawer.softwaregalleryid,oSoftware);
			softwareObj.getGalleryImages(softwareObj);
		}
		

		
		this.toggleHardware('open');
		this.toggleBGColor();
			
	},

	drawEdges: function() {
		var corner1 = div.cloneNode(true);
		corner1.style.width = (this.drawerWidth()-this.edgeOverlap)+'px';
		corner1.style.height = this.edgeOverlap+'px';
		corner1.style.position = 'absolute';
		corner1.style.top = '0px';
		corner1.style.left = '0px';
		corner1.style.background = 'url('+this.edgeImg()+') top left no-repeat';
		corner1.style.zIndex = this.highestIndex;
		var corner2 = corner1.cloneNode(true);
		corner2.style.width = this.edgeOverlap+'px';
		corner2.style.height = (this.drawerHeight()-this.edgeOverlap)+'px';
		corner2.style.top = '0px';
		corner2.style.left = (this.drawerWidth()-this.edgeOverlap)+'px';
		corner2.style.background = 'url('+this.edgeImg()+') top right no-repeat';
		var corner3 = corner1.cloneNode(true);
		if(Browser.isIE()) {
			corner3.style.top = (this.drawerHeight()-this.edgeOverlap-8)+'px';
		} else {
			corner3.style.top = (this.drawerHeight()-this.edgeOverlap)+'px';
		}
		corner3.style.left = this.edgeOverlap+'px';
		corner3.style.background = 'url('+this.edgeImg()+') bottom right no-repeat';
		var corner4 = corner2.cloneNode(true);
		corner4.style.top = this.edgeOverlap+'px';
		corner4.style.left = '0px';
		corner4.style.background = 'url('+this.edgeImg()+') bottom left no-repeat';
		
		if(browser.isIE == true) {
			this.drawerDiv.style.border = '1px solid '+this.dottedLine;
		} else {
			this.drawerDiv.appendChild(corner1);
			this.drawerDiv.appendChild(corner2);
			this.drawerDiv.appendChild(corner3);
			this.drawerDiv.appendChild(corner4);
		}
	},
	
	getHeaderWidth: function(section) {	return 80; },
	getSection : function(section) {
		return this.drawerXML.getElementsByTagName(section.toLowerCase())[0];;
	},

	displaySection : function(section) {
		var sectionXML;
		if(section != null) 
		{ 
			sectionXML = Drawer.getSection(section); 
			// does XML section contain Gallery or Text?
			var nodeCount = sectionXML.childNodes.length;
			var children = sectionXML.childNodes;
			var isGallery = true;
			for(var i = 0; i < nodeCount; i++)
			{
				if(children[i].tagName && children[i].tagName.indexOf('gallery') == -1)
				{
					isGallery = false;
					break;
				}
			}
		}
		
		switch(section) {
			case 'Challenges':
				this.challengesHeader.innerHTML = sectionXML.getAttribute('headertitle');
				var challengesP = p.cloneNode(true);
				var challengesText = document.createTextNode(sectionXML.firstChild.data);
				challengesP.appendChild(challengesText);
				challengesP.style.width = (this.challengesWidth()-30)+'px';
				this.challengesDiv.appendChild(this.challengesHeader);
				this.challengesDiv.appendChild(challengesP);
				break;
			case 'Hardware':
				//this.hardwareHeader.innerHTML = section;
				this.hardwareHeader.innerHTML = sectionXML.getAttribute('headertitle');
				if(isGallery)
				{
					var hardwaregalleryDiv = div.cloneNode(true);
					hardwaregalleryDiv.setAttribute('id',this.hardwaregalleryid);
					this.hardwareClickSpan.appendChild(this.hardwareHeader);
					this.hardwareClickSpan.appendChild(this.hardwareToggleDiv);
					if(hardwaregalleryDiv)
					{
						this.hardwareContentDiv.appendChild(hardwaregalleryDiv);	
					}
				}
				else
				{
					this.traverseXML(section, sectionXML, null, null, 1);
					this.hardwareClickSpan.appendChild(this.hardwareHeader);
					this.hardwareContentDiv.appendChild(this.hardwareToggleDiv);
					this.hardwareClickSpan.appendChild(this.hardwareToggleDiv);
				}
				// shared assignments for Gallery and Text mode
				this.hardwareClickAnchor.id = 'hardware_toggle';
				this.hardwareClickAnchor.setAttribute('href','#');
				this.hardwareToggleImg.setAttribute('border','0');
				this.hardwareToggleImg.setAttribute('src',this.toggleImgCloseDark());
				addEventToObject(this.hardwareClickAnchor,'onclick',this.processToggle);
				this.hardwareToggleDiv.appendChild(this.hardwareToggleImg);
				this.hardwareClickSpan.appendChild(this.hardwareToggleDiv);
				this.hardwareClickAnchor.appendChild(this.hardwareClickSpan);
				this.hardwareDiv.appendChild(this.hardwareClickAnchor);
				this.hardwareDiv.appendChild(this.hardwareContentDiv);
				break;
			case 'Software':
				//this.softwareHeader.innerHTML = section;
				this.softwareHeader.innerHTML = sectionXML.getAttribute('headertitle');
				if(isGallery)
				{
					var softwaregalleryDiv = div.cloneNode(true);
					softwaregalleryDiv.setAttribute('id',this.softwaregalleryid);
					this.softwareClickSpan.appendChild(this.softwareHeader);
					this.softwareClickSpan.appendChild(this.softwareToggleDiv);
					if(softwaregalleryDiv)
					{
						this.softwareContentDiv.appendChild(softwaregalleryDiv);	
					}
				}
				else
				{
					this.traverseXML(section, sectionXML, null, null, 1);
					this.softwareClickSpan.appendChild(this.softwareHeader);
					this.softwareContentDiv.appendChild(this.softwareToggleDiv);
					this.softwareClickSpan.appendChild(this.softwareToggleDiv);
				}
				//shared assignments for Gallery and Text mode
				this.softwareClickAnchor.id = 'software_toggle';
				this.softwareClickAnchor.setAttribute('href','#');
				this.softwareToggleImg.setAttribute('border','0');
				this.softwareToggleImg.setAttribute('src',this.toggleImgCloseDark());
				addEventToObject(this.softwareClickAnchor,'onclick',this.processToggle);
				this.softwareToggleDiv.appendChild(this.softwareToggleImg);
				this.softwareClickSpan.appendChild(this.softwareToggleDiv);
				this.softwareClickAnchor.appendChild(this.softwareClickSpan);
				this.softwareDiv.appendChild(this.softwareClickAnchor);
				this.softwareDiv.appendChild(this.softwareContentDiv);
				break;
			case 'Tricks':
				// assume that Tricks will always contain Text
				//this.tricksHeader.innerHTML = section;
				this.tricksHeader.innerHTML = sectionXML.getAttribute('headertitle');
				
				// nat XML parsing
					this.traverseXML(section, sectionXML, null, null, 1);
				// end nat


				
				this.tricksContentDiv.appendChild(this.tricksToggleDiv);
				this.tricksClickSpan.appendChild(this.tricksHeader);
				this.tricksClickSpan.appendChild(this.tricksToggleDiv);
				this.tricksClickAnchor.id = 'tricks_toggle';
				this.tricksClickAnchor.setAttribute('href','#');
				this.tricksToggleImg.setAttribute('border','0');
				this.tricksToggleImg.setAttribute('src',this.toggleImgCloseDark());
				addEventToObject(this.tricksClickAnchor,'onclick',this.processToggle);
				this.tricksToggleDiv.appendChild(this.tricksToggleImg);
				this.tricksClickSpan.appendChild(this.tricksToggleDiv);
				this.tricksClickAnchor.appendChild(this.tricksClickSpan);
				this.tricksDiv.appendChild(this.tricksClickAnchor);
				
				
				this.tricksDiv.appendChild(this.tricksContentDiv);
				
				break;
			default:
				break;
		}
		return true;
	},

	traverseXML : function(secName, tree, elmAppendTo, parentId, curColumn) {
		var nodeCount = tree.childNodes.length;
		var children = tree.childNodes;
		for(var i = 0; i < nodeCount; i++)
		{
			if(children[i].tagName)
			{
				var className = "";
				var parentLevelMarker = "";
				//check if class attribute is passed in
				if(children[i].getAttribute('class'))
					className += children[i].getAttribute('class');
				
				if(parentId)
					parentLevelMarker += parentId;
				var htmlElm = document.createElement('' + children[i].nodeName  + '');
				// don't add ID, we will not refer to these elements
				// htmlElm.id = parentLevelMarker + "_" + children[i].nodeName + "_Elm_" + i;
				
				// if element is a link, attach it
				var link = "";
				if(children[i].getAttribute('href'))
				{
					link = children[i].getAttribute('href');
					// escape special characters
					link = encodeURI(link);
					// unescaping for Safari
					if(browser.isSafari == true) {
						link = link.replace(/&#38;/g, "&");
					}
					htmlElm.setAttribute('href',link);
				}
				
				// elmAppendTo == null indicates the column level
				if(elmAppendTo == null) 
				{
					var colNumber = "";
					switch(secName) {
						case 'Hardware':
						colNumber = "1";
						break;
						case 'Software':
						colNumber = "2";
						break;
						case 'Tricks':
						colNumber = "3";
						break;
					}
					
					className = className + colNumber + curColumn;
					curColumn++;
				}
				
				// CSS styles are defined using #notation on the page
				if(className.length > 0)
				{
					if(browser.isIE == true)
						htmlElm.className = className;
					else
						htmlElm.setAttribute('class', className);
				}
				
				
				// add text
				if(children[i].firstChild.data)
				{
					var htmlElmText = document.createTextNode(children[i].firstChild.data);
					htmlElm.appendChild(htmlElmText);
				}
				
				
				if(elmAppendTo != null)
				{
					elmAppendTo.appendChild(htmlElm);
				}
				else
				{
					switch(secName) {
						case 'Hardware':
						this.hardwareContentDiv.appendChild(htmlElm);
						break;
						case 'Software':
						this.softwareContentDiv.appendChild(htmlElm);
						break;
						case 'Tricks':
						this.tricksContentDiv.appendChild(htmlElm);
						break;
					}
				}
				
				if(children[i].childNodes.length > 0)
					this.traverseXML(secName, children[i], htmlElm, htmlElm.id, curColumn)
			}
		}
		
	},

	getStyleClass : function(className) {
			var curDocumentPagename = document.location.href.substring(document.location.href.lastIndexOf('/') + 1);
			for(var s = 0; s < document.styleSheets.length; s++)
			{
				if(document.styleSheets[s].href.indexOf(curDocumentPagename) > -1)
				{ 
					for(var r = 0; r < document.styleSheets[s].cssRules.length; r++)
					{
						if(document.styleSheets[s].cssRules[r].selectorText == '.' + className)
						{
							return document.styleSheets[s].cssRules[r];	
						}
					} 
				}
			} 
	},
	
	styleSection : function(section) {
		switch(section) {
			case 'Challenges':
				this.challengesHeader.style.fontSize = '16px';
				this.challengesHeader.style.color = "#000000";
				this.challengesHeader.style.marginBottom = '5px';
				
				
				this.challengesDiv.style.fontSize = '14px';
				this.challengesDiv.style.color = '#666666';
				this.challengesDiv.style.background = '#EDEEEE';
				this.challengesDiv.style.width = (this.challengesWidth()-30)+'px';
				
				this.challengesDiv.style.position = 'absolute';
				this.challengesDiv.style.top = '0';
				this.challengesDiv.style.left = '0';
				break;
			case 'Hardware':
				this.hardwareHeader.style.fontSize = '12px';
				this.hardwareHeader.style.margin = '10px auto';
				this.hardwareHeader.style.textAlign = 'center';
				this.hardwareHeader.style.color = this.closeTextColor;
				this.hardwareClickAnchor.style.textDecoration = 'none';
					
				this.hardwareDiv.style.color = this.openTextColor;
				this.hardwareDiv.style.background = this.openColor;
				this.hardwareClickSpan.style.borderLeft = '2px dotted '+this.dottedLine;
				this.hardwareDiv.style.position = 'absolute';
				this.hardwareDiv.style.top = '0';
				this.hardwareDiv.style.left = this.challengesWidth()+'px';
				this.hardwareDiv.style.width = (this.drawerWidth()-this.challengesWidth())+'px';
				this.hardwareDiv.style.height = this.drawerHeight()+'px';
				this.hardwareDiv.style.zIndex = '200';
		
				
				this.hardwareContentDiv.style.width = ((this.drawerWidth()-this.challengesWidth())-(this.getHeaderWidth('hardware')+this.getHeaderWidth('software')+this.getHeaderWidth('tricks')))+'px';
				this.hardwareContentDiv.style.position = 'absolute';
				this.hardwareContentDiv.style.top = '0';
				this.hardwareContentDiv.style.left = this.getHeaderWidth('hardware')+'px';
				this.hardwareContentDiv.style.padding = '10px';
				
				this.hardwareToggleDiv.style.position = 'absolute';
				this.hardwareToggleDiv.style.bottom = '10px';
				this.hardwareToggleDiv.style.left = '15px';
				
				this.hardwareToggleImg.style.behavior = 'url(/main/js/iepngfix/iepngfix.htc)'; 
				
				this.hardwareClickSpan.style.background = this.closeColor;
				this.hardwareClickSpan.style.height = this.drawerHeight()+'px';
				this.hardwareClickSpan.style.width = this.getHeaderWidth('hardware')+'px';
				this.hardwareClickSpan.style.position = 'absolute';
				this.hardwareClickSpan.style.top = '0';
				this.hardwareClickSpan.style.left = '0';
				break;
			case 'Software':
				this.softwareHeader.style.fontSize = '12px';
				this.softwareHeader.style.margin = '10px auto';
				this.softwareHeader.style.textAlign = 'center';
				this.softwareHeader.style.color = this.closeTextColor;
				this.softwareClickAnchor.style.textDecoration = 'none';
				
				this.softwareDiv.style.color = this.openTextColor;
				this.softwareDiv.style.background = this.openColor;
				this.softwareClickSpan.style.borderLeft = '2px dotted '+this.dottedLine;
				this.softwareDiv.style.position = 'absolute';
				this.softwareDiv.style.top = '0';
				this.softwareDiv.style.left = ((this.drawerWidth()/4)+this.getHeaderWidth('hardware'))+'px';
				this.softwareDiv.style.width = (this.drawerWidth()-this.challengesWidth())+'px';
				this.softwareDiv.style.height = this.drawerHeight()+'px';
				this.softwareDiv.style.zIndex = '400';
		
				
				this.softwareContentDiv.style.width = ((this.drawerWidth()-this.challengesWidth())-(this.getHeaderWidth('hardware')+this.getHeaderWidth('software')+this.getHeaderWidth('tricks')))+'px';
				this.softwareContentDiv.style.position = 'absolute';
				this.softwareContentDiv.style.top = '0';
				this.softwareContentDiv.style.left = this.getHeaderWidth('software')+'px';
				this.softwareContentDiv.style.padding = '10px';
		
				this.softwareToggleDiv.style.position = 'absolute';
				this.softwareToggleDiv.style.bottom = '10px';
				this.softwareToggleDiv.style.left = '15px';
				
				this.softwareToggleImg.style.behavior =  'url(/main/js/iepngfix/iepngfix.htc)'; 
				
				this.softwareClickSpan.style.background = this.closeColor;
				this.softwareClickSpan.style.height = this.drawerHeight()+'px';
				this.softwareClickSpan.style.width = this.getHeaderWidth('software')+'px';
				this.softwareClickSpan.style.position = 'absolute';
				this.softwareClickSpan.style.top = '0';
				this.softwareClickSpan.style.left = '0';
				break;
			case 'Tricks':
				this.tricksHeader.style.fontSize = '12px';
				this.tricksHeader.style.margin = '10px auto';
				this.tricksHeader.style.textAlign = 'center';
				this.tricksHeader.style.color = this.closeTextColor;
				this.tricksClickAnchor.style.textDecoration = 'none';
				
				this.tricksDiv.style.color = this.openTextColor;
				this.tricksDiv.style.background = this.openColor;
				this.tricksClickSpan.style.borderLeft = '2px dotted '+this.dottedLine;
				this.tricksDiv.style.position = 'absolute';
				this.tricksDiv.style.top = '0';
				this.tricksDiv.style.left = ((this.drawerWidth()/4)+this.getHeaderWidth('hardware')+this.getHeaderWidth('software'))+'px';
				this.tricksDiv.style.width = (this.drawerWidth()-this.challengesWidth())+'px';
				this.tricksDiv.style.height = this.drawerHeight()+'px';
				this.tricksDiv.style.zIndex = '600';
		
				this.tricksContentDiv.style.width = (((this.drawerWidth()-this.challengesWidth())-(this.getHeaderWidth('hardware')+this.getHeaderWidth('software')))-this.getHeaderWidth('tricks'))+'px';
				this.tricksContentDiv.style.position = 'absolute';
				this.tricksContentDiv.style.top = '0';
				this.tricksContentDiv.style.left = this.getHeaderWidth('tricks')+'px';
				this.tricksContentDiv.style.padding = '10px';

				this.tricksToggleDiv.style.position = 'absolute';
				this.tricksToggleDiv.style.bottom = '10px';
				this.tricksToggleDiv.style.left = '15px';
				
				this.tricksToggleImg.style.behavior = 'url(/main/js/iepngfix/iepngfix.htc)'; 
				
				this.tricksClickSpan.style.background = this.closeColor;
				this.tricksClickSpan.style.height = this.drawerHeight()+'px';
				this.tricksClickSpan.style.width = this.getHeaderWidth('tricks')+'px';
				this.tricksClickSpan.style.position = 'absolute';
				this.tricksClickSpan.style.top = '0';
				this.tricksClickSpan.style.left = '0';
				break;
			default:
				this.drawerDiv.style.width = this.drawerWidth()+'px';
				this.drawerDiv.style.height = this.drawerHeight()+'px';
				this.drawerDiv.style.position = 'relative';
				this.drawerDiv.style.overflow = 'hidden';
				this.drawerDiv.style.fontSize = '10px';
				this.drawerDiv.style.background = '#EDEEEE';
				break;
		}
		return true;
	},
	processToggle : function(ev) {
		if(!ev) {ev = window.event;}
		if (ev.stopPropagation) { ev.stopPropagation(); } else { ev.cancelBubble = true; }
		if (ev.preventDefault) { ev.preventDefault(); } else { ev.returnValue = false; }
		var clickedLink = (window.event) ? window.event.srcElement : ev.target;
		while (!clickedLink.tagName || clickedLink.tagName.toLowerCase() != "a") {
			clickedLink = clickedLink.parentNode;
		}
		var	toggleDiv = clickedLink.id.split('_')[0];

		if(Drawer.lastOpen != clickedLink.parentNode) {
			switch(toggleDiv) {
				case 'tricks':
					Drawer.toggleTricks('open');
					break;
				case 'software':
					Drawer.toggleSoftware('open');
					break;
				case 'hardware':
					Drawer.toggleHardware('open');
					break;
				default:
					break;
			}
			Drawer.toggleBGColor();
		}
	},
	toggleHardware : function(direction) {
		switch(direction) {
			case 'open':
				if(Drawer.tricksOpen) {Drawer.toggleTricks('close');}
				if(Drawer.softwareOpen) {Drawer.toggleSoftware('close');}
				Drawer.hardwareToggleImg.setAttribute('src',Drawer.toggleImgCloseDark());
				Drawer.hardwareOpen = true;
				break;
			case 'close': 
				Drawer.hardwareToggleImg.setAttribute('src',Drawer.toggleImgCloseLight());
				Drawer.hardwareOpen = false;
				break;
			default:
				break;
		}
	},
	toggleSoftware : function(direction) {
		var startLeft = (Drawer.challengesWidth()+Drawer.getHeaderWidth('hardware'));
		var endLeft = (Drawer.drawerWidth()-(Drawer.getHeaderWidth('tricks')+Drawer.getHeaderWidth('software')));
		switch(direction) {
			case 'open':
				if(!Drawer.softwareOpen) {
					Drawer.moveSection(Drawer.softwareDiv,endLeft,startLeft,
						Drawer.duration,Drawer.step,
						function(){
							Drawer.softwareToggleImg.setAttribute('src',Drawer.toggleImgCloseLight());
						});
				}
				if(Drawer.hardwareOpen) {Drawer.toggleHardware('close');}
				if(Drawer.tricksOpen) {Drawer.toggleTricks('close');}
				Drawer.softwareOpen = true;
				break;
			case 'close':
				if(Drawer.softwareOpen) {
					Drawer.moveSection(Drawer.softwareDiv,startLeft,endLeft,
						Drawer.duration,Drawer.step,
						function(){
							Drawer.softwareToggleImg.setAttribute('src',Drawer.toggleImgOpen());
						});
				}
				Drawer.softwareOpen = false;
				break;
			default:
				break;
		}
	},
	toggleTricks : function(direction) {
		var startLeft = (Drawer.challengesWidth()+Drawer.getHeaderWidth('hardware')+Drawer.getHeaderWidth('software'));
		var endLeft = (Drawer.drawerWidth()-Drawer.getHeaderWidth('tricks'));
		switch(direction) {
			case 'open':
				if(!Drawer.softwareOpen) {Drawer.toggleSoftware('open');}
				Drawer.moveSection(Drawer.tricksDiv,endLeft,startLeft,
					Drawer.duration,Drawer.step,
					function(){
						Drawer.tricksToggleImg.setAttribute('src',Drawer.toggleImgCloseLight());
						if(Drawer.softwareOpen) {
							Drawer.softwareToggleImg.setAttribute('src',
								Drawer.toggleImgCloseLight());
						}
					});
				Drawer.tricksOpen = true;
				if(Drawer.hardwareOpen) {Drawer.toggleHardware('close');}
				break;
			case 'close':
				Drawer.moveSection(Drawer.tricksDiv,startLeft,endLeft,Drawer.duration,Drawer.step,
					function(){
						Drawer.tricksToggleImg.setAttribute('src',Drawer.toggleImgOpen());
						Drawer.softwareToggleImg.setAttribute('src',Drawer.toggleImgCloseLight());
					});
				Drawer.tricksOpen = false;
				break;
			default:
				break;
		}

	},
	toggleBGColor : function() {
		var openSection = (Drawer.hardwareOpen) ? Drawer.hardwareDiv : ((Drawer.tricksOpen) ? Drawer.tricksDiv : Drawer.softwareDiv);
		if(Drawer.lastOpen.nodeType == 1) {
			var oLastClickSpan = Drawer.lastOpen.getElementsByTagName('span')[0];
			oLastClickSpan.style.background = Drawer.closeColor;


		}
		var oCurrentClickSpan = openSection.getElementsByTagName('span')[0];
		oCurrentClickSpan.style.background = Drawer.hiColor;


		Drawer.lastOpen = openSection;
	},
	moveSection : function(section,startLeft,endLeft,duration,framerate,func) {
		var setLeft = function(l) {section.style.left = l+'px';};
		var step = (duration/1000)*framerate;
		var delta = startLeft;
		var changeLeft = function(newLeft,endLeft) {
			var changeLeftST = null;
			var stepDuration = (duration/step);
			duration -= stepDuration;
			if(newLeft < endLeft) {
				delta = (step > 0) ? (endLeft - newLeft)/step : 0;
				newLeft = Math.max(startLeft, Math.min(newLeft+delta, endLeft));
				if(newLeft > (endLeft-1)) {newLeft = endLeft;}
				setLeft(newLeft);
				changeLeftST = window.setTimeout(function(){changeLeft(newLeft,endLeft);},stepDuration);
			} else if (newLeft > endLeft) {
				delta = (step > 0) ? (newLeft - endLeft)/step : 0;
				newLeft = Math.min(startLeft, Math.max(newLeft-delta, endLeft));
				if(newLeft < (endLeft+1)) {newLeft = endLeft;}
				setLeft(newLeft);
				changeLeftST = window.setTimeout(function(){changeLeft(newLeft,endLeft);},stepDuration);
			} else if (newLeft == endLeft) {
				setLeft(endLeft);
				clearTimeout(changeLeftST);
				if (func) {func();}
			}
		};
		changeLeft(startLeft,endLeft);
	},
	fadeColor : function(div,startColor,endColor,speed,BorC) {
		var hexToNum = function(hex) {
			if(hex.charAt(0) == '#') { hex = hex.slice(1); }
			if(hex.length == 3) { hex += hex;}
			hex = hex.toUpperCase();
			var num = new Array(3);
			var k = 0;
			var int1, int2;
			for(var i=0;i<6;i+=2) {
				int1 = Drawer.hexAlphabet.indexOf(hex.charAt(i));
				int2 = Drawer.hexAlphabet.indexOf(hex.charAt(i+1));
				num[k] = (int1*16)+int2;
				k++;
			}
			return num;
		};
		var numToHex = function(num) {
			var hex = '#';
			var int1, int2;
			for(var i=0;i<3;i++) {
				int1 = num[i]/16;
				int2 = num[i]%16;
				hex += Drawer.hexAlphabet.charAt(int1) + Drawer.hexAlphabet.charAt(int2);
			}
			return hex;
		};
		var changeColorST;
		var changeColor = function(div,startColor,endColor,speed) {
			var startNum = hexToNum(startColor);
			var endNum = hexToNum(endColor);
			for(var i=0;i<3;i++) {
				startNum[i] = Number(startNum[i]);
				endNum[i] = Number(endNum[i]);
			}
			for(var i=0;i<3;i++) {
				if(startNum[i] < endNum[i]) {
					startNum[i] += speed;
					if(startNum[i] > endNum[i]) { startNum[i] = endNum[i]; }
				}
				else if(startNum[i] > endNum[i]) {
					startNum[i] -= speed;
					if(startNum[i] < endNum[i]) { startNum[i] = endNum[i]; }
				}
			}
			var color = 'rgb('+startNum[0]+','+startNum[1]+','+startNum[2]+')';
			if(BorC == 'b') {
				div.style.background = color;
			}
			else if(BorC == 'c') {
				div.style.color = color;
			}
			if((startNum[0] == endNum[0]) &&
				(startNum[1] == endNum[1]) &&
				(startNum[2] == endNum[2])) {
				clearTimeout(changeColorST);
				return;
			}
			startColor = numToHex(startNum);
			changeColorST = window.setTimeout(function(){changeColor(div,startColor,endColor,speed);},10);
		};
		changeColor(div,startColor,endColor,speed);
	}
};