var oOffset = 0;
var disappeardelay = 500;
var delayhide;
var timer;



function callout(o, index) {
	if (timer) clearTimeout(timer);
	
	if ( (typeof host == "undefined") || host == "" ) {  host = "http://htmldev.scholastic.net"; };

var pointyLeft = '<img src="' + host + '/content/presentation/www/images/c_left.gif" alt="" width="13" height="54" />';
var pointyRight = '<img src="' + host + '/content/presentation/www/images/c_right.gif" alt="" width="13" height="54" />';
	
	
	timer = setTimeout(function(){

		var refPointy;
		var articlePage = document.getElementById("articleContent");
		var bookPage = document.getElementById("articleMoreRight");
		var obj = document.getElementById("callout"+index);
		var curobj;
		if ( articlePage || bookPage ) 
			curobj = o;
		else
			curobj = document.getElementById("pShot"+index);
		var temp = getposOffset(curobj, "top") - 100;
		var temp2 = getposOffset(curobj, "left") + oOffset;
		var leftPointy, topPointy;
		
		if ( !document.getElementById("pointy") ) {
			var arrow = document.createElement("div");
			arrow.setAttribute("id","pointy");
			document.body.appendChild(arrow);
			refPointy = arrow;
		}
		else {
			refPointy = document.getElementById("pointy");
		}
		
	
		if (temp2 > 600) {
			temp2 = temp2 - 422;
			topPointy = temp + 100;
			leftPointy = temp2 + 409;
			refPointy.innerHTML = pointyRight;			
		}
		else {					
			temp2 += curobj.offsetWidth;	
			topPointy = temp + 100;
			leftPointy = temp2 - 11;
			refPointy.innerHTML = pointyLeft;
		}	
					
		obj.style.display = "block";
		obj.style.top = temp + "px";	
		obj.style.left = temp2 + "px";
		refPointy.style.display = "block";
		refPointy.style.top = topPointy + "px";
		refPointy.style.left = leftPointy  + "px";
		
	}, 1000);
}

function delayhidecallout(index){
	clearTimeout(timer);
	delayhide=setTimeout("hidecallout("+index+")",disappeardelay);
}
function hidecallout(index){
	if(document.getElementById("callout"+index)) 
		document.getElementById("callout"+index).style.display = "none";	
	if(document.getElementById("pointy"))
		document.getElementById("pointy").style.display = "none";	
}
function clearhidecallout(){
	if ( typeof delayhide != "undefined" ) clearTimeout(delayhide);
}