HotTopics={};
HotTopics.wide=true;
HotTopics.totalWidth=482;
HotTopics.maxHeight=90;
HotTopics.imagesPerHalf=3;
HotTopics.shrinkFactor=.7;
HotTopics.containerLeft=-200;
HotTopics.imgBorderWidth=1;
HotTopics.incPercent=0;
HotTopics.defaultImage=0;
HotTopics.firstLoad=true;
HotTopics.functionQueue=[];
HotTopics.alreadyLoaded=false;
HotTopics.almostDoneSliding=false;

function imgObj() { // data structure for images
	this.curHeight=0;
	this.curLeft=0;
	this.img=null;
	this.imgBox=null;
	this.w = 0;
	this.h = 0;
	this.curHeight=0;
	this.curLeft=0;
	this.coords=new Array();
}

function coordObj(index,l,h) { // data structure for image Left offset and heights
	this.idx=index;
	this.L=l;
	this.H=h;
}

HotTopics.init=function() {
	if (HotTopics.alreadyLoaded)
		return;
	HotTopics.mutex=false;
	HotTopics.numerator=document.getElementById('hotTopicsNumer');
	if (!HotTopics.numerator || typeof HotTopics.numerator == "undefined")
		return;

	HotTopics.imgs=new Array();
	var htImages = Core.getElementsByClass('htImages');
	var imgLength=htImages.length;
	if (imgLength != HotTopics.totalImages)
		return;
	if (imgLength < HotTopics.imagesPerHalf*2 + 2) {
		HotTopics.imagesPerHalf=Math.floor((imgLength-2)/2);
		if (imgLength<=1) {
			var ab=document.getElementById('tax-hotTopics');
			if (ab) ab.style.display='none';
			return false;
		}
	}
	
	for(var i = 0; i < imgLength; i++) {
		var dim=new imgObj();
		dim.w=htImages[i].getAttribute("x");
		dim.h=htImages[i].getAttribute("y");

		dim.img=htImages[i];
		dim.imgBox=htImages[i].parentNode.parentNode;
		HotTopics.imgs.push(dim);
	}
	
	var imgBoxes=Core.getElementsByClass('hotTopics-imgBox');
	if (imgBoxes.length != HotTopics.totalImages)
		return;
	for (var j=0; j< imgBoxes.length; j++) {
		Core.addEventListener(imgBoxes[j], "click", HotTopics.hrefTopic);
	}
	
	HotTopics.setFutureSizes();
	var tmp=document.getElementById('htSpinLoad');
	if (typeof tmp != "undefined" && tmp != null)
		tmp.parentNode.removeChild(tmp);
	HotTopics.jumpToPos(HotTopics.defaultImage);
	HotTopics.curImg=HotTopics.defaultImage;
	HotTopics.alreadyLoaded=true;
};

HotTopics.hrefTopic=function() {
	var theId=parseInt(this.id.substring(this.id.lastIndexOf('_')+1));
	var theLink=document.getElementById('htTopicLink_'+theId);
	if (theLink)
		location.href=theLink.href;
};


HotTopics.previous=function() {
	if (HotTopics.mutex) {
		HotTopics.functionQueue.push(arguments.callee);
		return;
	}
	HotTopics.mutex=true;
	if (HotTopics.curImg > 0)
		var newIdx=HotTopics.curImg-1;
	else
		var newIdx=HotTopics.imgs.length-1;
		
	// here direction is positive because clicking prev moves the contents right
	HotTopics.preset(HotTopics.curImg,1); 
	HotTopics.curImg=newIdx;
	HotTopics.incPercent=0;
	HotTopics.slide(1);
};

HotTopics.next=function() {
	if (HotTopics.mutex) {
		HotTopics.functionQueue.push(arguments.callee);
		return;
	}
	HotTopics.mutex=true;
	if (HotTopics.curImg < HotTopics.imgs.length-1)
		var newIdx=HotTopics.curImg+1;
	else
		var newIdx=0;
		
	// here direction is negative because clicking prev moves the contents right
	HotTopics.preset(HotTopics.curImg,-1);
	HotTopics.curImg=newIdx;
	HotTopics.incPercent=0;
	HotTopics.slide(-1);
};

HotTopics.slide=function(dir) {
	var theCurMidImg=HotTopics.imgs[HotTopics.curImg];
	var imgCoords=theCurMidImg.coords;
	var curImgObj;
	var newLeft=0;
	var newHeight=0;
	var start=(dir==1)?1:0;
	var end=(dir==1)?imgCoords.length-1:imgCoords.length-2;
	
	var firstTime=(HotTopics.incPercent==0);
	HotTopics.incPercent += Math.ceil(45*(1-HotTopics.incPercent))/100;
	if (HotTopics.incPercent >= 1) {
		HotTopics.incPercent=1;
	} else {
		setTimeout("HotTopics.slide("+dir+")",20);
	}
	// incPercent: 0.45, 0.7, 0.84, 0.919999, 0.96, 0.98, 0.99 ,1
	for (var i=start; i<=end; i++) {
		curImgObj=HotTopics.imgs[imgCoords[i].idx];
		
		if (HotTopics.incPercent==1) {
			curImgObj.curHeight = newHeight = imgCoords[i].H;
			curImgObj.curLeft = newLeft = imgCoords[i].L;
		} else {
			if (!HotTopics.almostDoneSliding && HotTopics.incPercent >= .91) { // change the title, number when we're 91% there
				HotTopics.activateTitleNum(HotTopics.curImg);
				HotTopics.almostDoneSliding=true;
			}
			newLeft=curImgObj.curLeft + Math.ceil((imgCoords[i].L-curImgObj.curLeft)*HotTopics.incPercent);
			newHeight=curImgObj.curHeight + Math.ceil((imgCoords[i].H-curImgObj.curHeight)*HotTopics.incPercent);
		}
		if (firstTime)
			curImgObj.imgBox.style.zIndex=60-Math.abs(i-HotTopics.imagesPerHalf-1);
		HotTopics.setImg(curImgObj,newHeight,newLeft,false);
	}
	if (HotTopics.incPercent==1) {
		HotTopics.almostDoneSliding=false;
		HotTopics.activateLinks(HotTopics.curImg);
		HotTopics.reset(HotTopics.curImg);
	}
};

HotTopics.activateTitleNum=function(index) {
	if (HotTopics.firstLoad) {
		var tmp=document.getElementById("htTitleNum_tempLoad").style.display="none";
		//tmp.parentNode.removeChild(tmp);
		document.getElementById('rightArrowHot').style.visibility="visible";
		document.getElementById('leftArrowHot').style.visibility="visible";
		HotTopics.firstLoad=false;
	} else {
		HotTopics.prevTitle.style.display="none";
	}
	var div=document.getElementById("htTitleNum_"+(index+1));
	div.style.display="block";
	HotTopics.prevTitle=div;
	if (HotTopics.wide)
		HotTopics.numerator.innerHTML=index+1;
};

HotTopics.activateLinks=function(middle) {
	var theWidth, orig, indiv, curLink;
	var centerImg=HotTopics.imgs[middle];
	for (var i=0; i<HotTopics.imgs.length; i++) {
		curLink=document.getElementById('htMaskLink_'+(i+1));
		if (!curLink) continue;
		if (this.isVisible(i,middle)) {
			for (var j=0; j<centerImg.coords.length; j++) {
				orig=HotTopics.imgs[i];
				if (centerImg.coords[j].idx==i) {
					indiv=centerImg.coords[j];
					break;
				}
			}
			theWidth=orig.w*indiv.H/orig.h;
			curLink.style.left=Math.round(indiv.L+HotTopics.containerLeft)+"px";
			curLink.style.width=Math.round(theWidth)+"px";
			curLink.style.display="block";
		} else {
			curLink.style.display="none";
		}
	}
};

HotTopics.isVisible=function(index,midpoint) { // whether this index is currently visible, given the current midpoint
	var half=this.imagesPerHalf;
	var max=this.imgs.length-1;
	var wrapBeg=(midpoint-half)<0;
	var wrapEnd=(midpoint+half)>max;
	if (wrapBeg) {
		var first=midpoint-half+parseInt(max);
		var last=parseInt(midpoint)+parseInt(half);
		return (index<=max && index>first) || (index<=last && index>=0);
	} else if (wrapEnd) {
		var first=midpoint-half;
		var last=parseInt(midpoint)+parseInt(half)-max;
		return (index<=max && index>=first) || (index<last && index>=0);
	}
	else return (index<=(midpoint+half) && index>=(midpoint-half));
};

HotTopics.preset=function(mid,dir) {
	var midCoords=this.imgs[mid].coords;
	var presetIdx=(dir==1)?0:midCoords.length-1;
	var img=this.imgs[midCoords[presetIdx].idx];
	this.setImg(img, midCoords[presetIdx].H, midCoords[presetIdx].L,true);
};

HotTopics.setImg=function(image,hgt,lft,updateDataStruct) {
	image.img.height=hgt;
	image.imgBox.style.left=lft+"px";
	if (updateDataStruct) {
		image.curHeight=hgt;
		image.curLeft=lft;
	}
};

HotTopics.reset=function(mid) {
	// put first and last images back to zero
	var midCoords=this.imgs[mid].coords;
	this.imgs[midCoords[0].idx].imgBox.style.left='0px';
	this.imgs[midCoords[midCoords.length-1].idx].imgBox.style.left='0px';
	HotTopics.mutex=false;
	if (this.functionQueue.length > 0)
		(this.functionQueue.shift())();
};

HotTopics.jumpToPos=function(mid) {
	HotTopics.curImg=mid;
	for (var i=0; i<this.imgs.length; i++) { // first set the images that will be off screen
		if (!hasIndex(this.imgs[mid].coords,i))
			this.setImg(this.imgs[i],10,0,true);
	}
	var midCoords=this.imgs[mid].coords;
	var image;
	for (var i=0; i<midCoords.length; i++) { // then set the images that matter (all onscreen plus the left and right on deck ones)
		image=this.imgs[midCoords[i].idx];
		this.setImg(image,midCoords[i].H,midCoords[i].L,true);
		image.imgBox.style.zIndex=60-Math.abs(i-this.imagesPerHalf-1);
	}
	this.reset(mid);
	this.activateTitleNum(mid);
	this.activateLinks(mid);
	if (HotTopics.wide)
		document.getElementById('hotTopicsStatus').style.visibility="visible";
};

function hasIndex(ary,val) {
	for (var j=0; j<ary.length; j++) {
		if (ary[j].idx==val) return true;
	}
	return false;
}

HotTopics.setFutureSizes=function() {
	for (var i=0; i<this.imgs.length; i++) {
		this.setSizesForHalf(i,-1); // pre-compute left half
		this.setSizesForHalf(i,1); // pre-compute right half
	}
};

HotTopics.setSizesForHalf=function(mid,direction) {
	var cLeft=(this.containerLeft*-1);
	var arrayLength=this.imgs.length;
	var image, imageCoord;
	var directionBasedOffset=0;
	var marginTotal=0;
	var futureWidth=0;
	var prevHeight=this.maxHeight;
	var midImg=this.imgs[mid];
	var aspect=midImg.w/midImg.h;
	var coordsArrayCounter=this.imagesPerHalf+1;
	var halfWidth=Math.round(this.imgBorderWidth+this.maxHeight*aspect/2); // initialize as width of half of the midpoint image
	midImg.coords[coordsArrayCounter]=new coordObj(mid,cLeft+(this.totalWidth/2)-halfWidth,this.maxHeight);
	var prevImgLeft=midImg.coords[coordsArrayCounter].L;
		var prevImgWidth=Math.round(this.maxHeight*aspect+this.imgBorderWidth*2);
	for (var i=0; i<2; i++) { // go through inner loop 2 times, first to set all the sizes, second to set the lefts
		if (i==1) {
			var difference=(this.totalWidth/2)-halfWidth; // total amount of margin needed
			var curMargin=Math.round(difference/(this.imagesPerHalf+1));
			coordsArrayCounter=this.imagesPerHalf+1; // reset to midpoint for second iteration
		}
		var arrayIdx=mid;
		for (var count=1; count<=this.imagesPerHalf+1; count++) { // do entire half, plus the offscreen outlier image that will get pushed in
			if ((direction==1 && arrayIdx+1>=arrayLength) || (direction != 1 && arrayIdx-1<0))
				arrayIdx=(direction==1)?0:arrayLength-1;
			else arrayIdx+=(direction==1)?1:-1;
			coordsArrayCounter += (direction==1)?1:-1; // decrement/increment
			image=this.imgs[arrayIdx];
			aspect=image.w/image.h;
			
			if (i==0) { // image size calculation
				midImg.coords[coordsArrayCounter]=new coordObj(arrayIdx,0,0);
				imageCoord=midImg.coords[coordsArrayCounter];
				// make this image 70% of the previous one's height, but give portraits a 10% boost and ultra-wides a 30% knock
				imageCoord.H=prevHeight*(aspect>1?1:1.1)*HotTopics.shrinkFactor;
				if (aspect>=2) 
					imageCoord.H *= .7;
				imageCoord.H=Math.round(imageCoord.H);
				prevHeight=imageCoord.H;
				if (count <= this.imagesPerHalf) // don't count the amount of space taken up by final off-screen image
					halfWidth+=Math.round(imageCoord.H*aspect)+this.imgBorderWidth*2;
			} else { // offset left calculation
				imageCoord=midImg.coords[coordsArrayCounter];
				futureWidth=Math.round(imageCoord.H*aspect+this.imgBorderWidth*2);
				if (count > this.imagesPerHalf) { // if setting the final image which will slide away out of view
					if (direction==1)
						imageCoord.L=cLeft+this.totalWidth+10;
					else
						imageCoord.L=cLeft-futureWidth-10;
				} else { // on-screen images
					if (count==this.imagesPerHalf) // if setting last (visible) image's margins
						curMargin=Math.round((difference-marginTotal)/2); // put remainder of margins on last image
					if (direction==1)
						directionBasedOffset=curMargin+prevImgWidth;
					else
						directionBasedOffset=(curMargin+futureWidth)*(-1);
					imageCoord.L=prevImgLeft+directionBasedOffset;
					marginTotal+=curMargin;
					
					// set for next time
					prevImgWidth=futureWidth;
					prevImgLeft=imageCoord.L;
				}
			}
		} // end count FOR
	} // end 2 FOR
}



Core.loadASAP(HotTopics.init);
	
	// function called only by IE to replace the mask png with alphaimageloader div
function fixMaskPng() {
	if (document.getElementById('maskImg')!=null && document.getElementById('maskImg').parentNode!=null) {
		var img = document.getElementById("maskImg");
		img.style.display = "block";
		var div = document.createElement("DIV");
		div.setAttribute("id","htMaskDiv");
		img.replaceNode(div);
	}
}