$(function(){
	var $c = $("ul#home-square").before('<ul id="square-nav">').cycle({
		fx: 'fade',
		timeout: 5000,
		pager: '#square-nav',
		pagerAnchorBuilder: function(index, el) {
			return '<li><a href="#">'+(index+1)+'</a></li>';
		},
		next: '#square-next',  // selector for next click
		prev: '#square-prev',  // selector for previous click
		//pauseOnPagerHover: 1,  // enable pause on pager link hover
		//pause: 1, 			   // pause on hover
		pagerClick: function(z, s)
		{
			$c.cycle('pause');
		},
		prevNextClick: function(i,z,s)
		{
			$c.cycle('pause');
		}
	});
	
	/******** TOOLTIPS ********/
	// set the z-index for all points
	//$("div.tooltip").css("position", "absolute").css("z-index", 300);
	// give an incremental z-index for each embedded dots
	var ziter = 500;
	$("ul#home-square li ul > li").each(function(){ 
		$(this).css({
			'position': 'absolute',
			'left':	  '0',
			'top':      '0',
			'z-index':  ziter
		});
		ziter += 5;
	});
	var iter = 0;
	var width=728;
	var height=423;
	var content_width = 285;
	var content_height = 140;
	var zindex_before = 0;
	var zindex_after = 9999;
	//var api = $("a.tooltip").simpletip().simpletip();
	$(".tooltip a").each(function(){
		var api = $(this).simpletip({
			content: $(".tip-info"+(iter+1)),
			position: [15,-50],
			showEffect: 'fade',
			presistent: true,
			baseClass: 'tip',
			boundryCheck: true,
			onBeforeShow: function(){
				// grab the zindex of the containing li tag we'll need it to make
				// sure the tooltip stays on top of other tooltips
				zindex_before = api.getParent().parent().parent().css("z-index");
				
			},
			onShow: function(){
				var left = api.getParent().parent().position().left;
				var top  = api.getParent().parent().position().top;
				
				api.getParent().parent().parent().css("z-index", zindex_after);
				api.getParent().find("img.tt").attr("src", "/images/home/home-square/tooltip_on.png");
				
				// check the x pos for overhang
				if ( (left + content_width) > width ) {
					$(".tip").css("left", '-278px');
				}
				
				// check to see if the y is over the top edge
				if ( top < 60 )
				{
					$(".tip").css("top", '17px');
				}
				// check to see if the y is over the bottom edge
				if ( top > 305 )
				{
					$(".tip").css("top", '-136px');
				}
				//$(".tip").css("position", "absolute").css("z-index", 1500);
				// pause the cycle
				$c.cycle('pause');
			},
			onHide: function(){
				api.getParent().find("img.tt").attr("src", "/images/home/home-square/tooltip.png");
				api.getParent().parent().parent().css("z-index", zindex_before);
				
			}
		}).simpletip();
		iter++;
	});
	
	
	
	
});
