var ns4 = document.layers;
var ns6 = document.getElementById && !document.all;
var ie4 = document.all;
var offsetX = 4;
var offsetY = 70;
var toolTipLayer;
var toolTipSTYLE="";
var CAPTION="cap";
var FG="fg";
var BG="bg";
var TEXTCOLOR="tc";
var CAPTIONCOLOR="cc";
var WIDTH="tw";
var HEIGHT="th";
var FONT="font";
var POSITIONY="posy";
var POSITIONX="posx";
var OFFSETX = "offx";
var OFFSETY = "offy";
var cap, fg, bg, tc, cc, tw, th, font, posy = 0, posx = 0;

var inTip = false;
var temp = '';
var tempTimer = null;
var timer2 = null;

function initToolTips() {
  if(ns4||ns6||ie4) {
    if(ns4) {
		toolTipSTYLE = document.toolTipLayer;
		toolTipLayer = document.toolTipLayer;
    }
    else if(ns6) {
		toolTipSTYLE = document.getElementById("toolTipLayer").style;
		toolTipLayer = document.getElementById("toolTipLayer");
    }
    else if(ie4) {
		toolTipSTYLE = document.all.toolTipLayer.style;
		toolTipLayer = document.all.toolTipLayer;
    }
    
	if(ns4) 
		document.captureEvents(Event.MOUSEMOVE);
    else {
      toolTipSTYLE.visibility = "visible";
      toolTipSTYLE.display = "none";
    }
	
	toolTipLayer.onmouseover = function(e) {
		//temp += 'over,';
		//window.status = temp;
		inTip = true;
	};
    toolTipLayer.onmouseout = function(e){
		//temp += 'out,';
		//window.status = temp;
		inTip = false;
		if (tempTimer) {
			clearTimeout(tempTimer);
		}
		tempTimer = setTimeout("timerCallback()",500);
	};
	
  }
}
function timerCallback() {
	if (!inTip) {
		//alert("callback");
		clearTimeout(tempTimer);
		toolTip();
	}
	else {
		clearTimeout(tempTimer);
		//alert("inTip callback");
	}
}
function toolTip() {
  if(arguments.length < 1) { // hide
    if(ns4) toolTipSTYLE.visibility = "hidden";
    else toolTipSTYLE.display = "none";
  } else { // show
    var msg = arguments[0];
    //fg = "#6D6D6D";
	fg = "#6586E0";
    bg = "#F8F8F8";
	tc = "#000000";
	cc = "#FFFFFF";
	font = "Verdana,Arial,Helvetica";
	tw = "";
	th = "";
	cap = "";
	posy = 0;
	posx = 0;
    for(var i = 1; i < arguments.length; i+=2) {
	  switch (arguments[i]) {
	    case "cap": cap = arguments[i+1]; break;
		case "font": font = arguments[i+1]; break;
		case "fg": fg = arguments[i+1]; break;
		case "bg": bg = arguments[i+1]; break;
		case "tc": tc = arguments[i+1]; break;
		case "cc": cc = arguments[i+1]; break;
		case "tw": tw = arguments[i+1]; break;
		case "th": th = arguments[i+1]; break;
		case "posy": posy = arguments[i+1]; break;
		case "posx": posx = arguments[i+1]; break;
		case "offx": offsetX = Number(arguments[i+1]); break;
		case "offy": offsetY = Number(arguments[i+1]); break;
	  }
	}
    var content =
	  "<table border=0 cellspacing=0 cellpadding=1 bgcolor=" + fg + " width=" + tw + " height=" + th + "><td>" +
	  "<table border=0 cellspacing=0 cellpadding=1 bgcolor=" + bg + " width=" + tw + " height=" + th + ">";
	if(cap) content += "<tr><td bgcolor=" + fg + "><font face=" + font + " color=" + cc + " size=-2><b>" + cap + "</b></font></td></tr><tr>";
	content += "<td><font face=" + font + " color=" + tc + " size=-2>" + msg + "</font></td>";
	if(cap) content += "</tr>";
	content += "</table></td></table>";

    if(ns4) {
      toolTipSTYLE.document.write(content);
      toolTipSTYLE.document.close();
      toolTipSTYLE.visibility = "visible";
    }
    else if(ns6) {
      //moveToMouseLoc(document);
      document.getElementById("toolTipLayer").innerHTML = content;
      toolTipSTYLE.display="block";
    }
    else if(ie4) {
      moveToMouseLoc();
      document.all("toolTipLayer").innerHTML=content;
      toolTipSTYLE.display="block";
    }
  }
}
function moveToMouseLoc(e) {
  if(ns4||ns6) {
    x = e.pageX;
    y = e.pageY;
	if (tw && (x + offsetX + Number(tw) + 10 > window.innerWidth)) {
		x = window.innerWidth - offsetX - Number(tw) - 10;
	}
	var docWidth = window.innerWidth;
	toolTipSTYLE.left = (x + offsetX + Number(posx) - (docWidth-760)/2)+"px";
	toolTipSTYLE.top = (y + offsetY + Number(posy) - 100)+"px";
	//alert(x);
	return true;
  } else {
    x = event.x + document.body.scrollLeft;
    y = event.y + document.body.scrollTop;
	if (tw && (x + offsetX + Number(tw) + 30 > document.body.offsetWidth)) x = document.body.offsetWidth - offsetX - Number(tw) - 30;
  }
  
  //window.status = "(x,y): ("+x+","+y+"); (offsetX,offsetY): ("+offsetX+","+offsetY+")";
  toolTipSTYLE.left = x + offsetX;
  toolTipSTYLE.top = y + offsetY;
  return true;
}


// type 0 add to cart, 1 personalization
// sizes array of size string, items: array of item id
function selectSize(e,type,sizes,items) {
	var title='',desc='',content='';
	if (type == 0) {
		title = '<div align=center>Select one size to add to cart</div>';
		desc = ''
	}
	else {
		title = '<div align=center>Select one size to personalization</div>';
		desc = 'Personalization is a production process. Depends on your text and logo details, it may involves laser etching and/or sand carving.';
	}
	
	content = "<div align=center style='font-size:14px;'><table width='100%'><tr>";
	for (i=0; i<sizes.length && i<items.length; i++) {
		if (type == 0)
			content += "<td align=center width='33%'><a href=index.php?action=addtocart&item="+items[i]+"&csurl="+csurl+">"+sizes[i]+"&quot;</a></td>";
		else
			content += "<td align=center width='33%'><a href=diy.php?action=diy&type=wizard&id="+items[i]+"&templatetype=2>"+sizes[i]+"&quot;</a></td>";
	}
	for (; i<3; i++) {
		content += "<td align=center width='33%'></td>";
	}
	content += "</tr></table></div>";
	toolTip(content,CAPTION,title,WIDTH,200,OFFSETX,-30,OFFSETY,20);
	moveToMouseLoc(e);
	
	timer2 = setTimeout("noActionTimeout()",2000);
}
function noActionTimeout() {
	if (!inTip) {
		clearTimeout(timer2);
		toolTip();
	}
	else {
		clearTimeout(timer2);
	}
}
function toolTipFadeout() {
	
}

initToolTips(true);
