var cntf=1;
$j(document).ready(function() {
	// function to populate the data for the clicked item
	//alert(document.getElementById("tab_count").value);
	//var cnt_load=document.getElementById("tab_count").value;
	//cnt_load=cnt_load+1;
	//alert(cnt_load);
	function fillContent(currentItem, objMLB) {
		$j("#thumbs p").html(objMLB.headlineText[currentItem-1]);
		$j("#long-desc").html(objMLB.descText[currentItem-1]);
	
		$j("#small-caption").html(objMLB.smallCaption[currentItem-1]);
		if(currentItem==1)
		{
			//alert("hello");	
			$j("#top_header").css({"background-color":"#53038d"});
			//$j("#li2").hide();
			getFilter(1);
			
		}
		else if(currentItem == 2)
		{
			$j("#top_header").css({"background-color":"#55a74a"});
			//$j("#a4").hide();
			//$j("#tab_id #li2").show();
			//$j("#li1").hide();
			//document.getElementById("li1").style.display="block";
			getFilter(2);
		}
		else if(currentItem==3)
		{
			$j("#top_header").css({"background-color":"#3399ff"});
			getFilter(3);
		}
		else if(currentItem==4)
		{
			$j("#top_header").css({"background-color":"#ff6600"});
			getFilter(4);
		}
	}

   var sliderWidth = $j("#photo").width();
   var cnt=1;
   // bind a click event to the thumbnail photos and navigation links
   $j("#thumbs a, #navigation ul a, #fot-left2 a").bind("click", function() {
		$j("#thumbs ul li a span").remove();
		// get the clicked item from the URL
		var clickedURL = this.href.toString();
		var clickedHash = clickedURL.split("#")[1];
		cnt=clickedHash;
		// a previously existing highlight is removed to prevent duplicates
		$j("#thumbs a, #navigation ul a").removeClass("highlight");

		// loop through the navigation links to highlight the clicked one
		$j("#navigation ul a").each(function() {
			var navURL = this.href.toString();
			var navHash = navURL.split("#")[1];
			if (clickedHash === navHash) {
				$j(this).addClass("highlight");
				$j("<span></span>").appendTo("#thumbs ul li a.highlight");
				}
		});
		
		// loop through all thumbnails, highlight the clicked one
		$j("#thumbs a").each(function() {
			var thumbsURL = this.href.toString();
			var thumbsHash = thumbsURL.split("#")[1];
			if (clickedHash === thumbsHash) {
				 $j(this).addClass("highlight");
				 $j("<span></span>").appendTo("#thumbs ul li a.highlight");
				}
			});
		
		// if any of items 2-6 are clicked, animate the margin accordingly
		if (clickedHash > 1) {
			if(clickedHash==2)
			{
				$j("#description").removeClass();
				$j("#description").addClass("green");
			}else if(clickedHash==3)
			{
				 $j("#description").removeClass();
				$j("#description").addClass("blue");
			}else if(clickedHash==4)
			{
				$j("#description").removeClass();
				$j("#description").addClass("orange");
			}
			
		   var marginSetting = sliderWidth*clickedHash-sliderWidth;
		   $j("#photo ul").animate({
			  marginLeft: "-"+marginSetting+"px"
			  }, 500, function() {
				  // optional callback after animation completes
				});
		
		// if item 1 is clicked, send the switcher back to the front (0 margin)
		} else {
			$j("#description").removeClass();
			$j("#description").addClass("volit");
		   $j("#photo ul").animate(
				{
					marginLeft: "0px"
				}, 500, function() {
					// optional callback after animation completes
				}
			);
		}
				   
	fillContent(clickedHash, objMLB);
	return false;
	});
   
   function display_thumbs(){
	   
	  var cntflag=1; 
	   if(cntf==6)
	   {
		  
		   cnt=1;
		 //  exit(0);
	//	  return;
	//break;
		//  return true;
		//  cntflag=0;
	   }
	   else
	   {
		   cntf++;
		   if(cnt==4)
		   {
			   cnt=1;
			   
		   }
		   else
		   {
		   		cnt++;
		   }
		   //return false;
	   }
				
						$j("#thumbs ul li a span").remove();
		// get the clicked item from the URL
		var clickedURL = "#"+cnt;
		var clickedHash = clickedURL.split("#")[1];
		// a previously existing highlight is removed to prevent duplicates
		$j("#thumbs a, #navigation ul a").removeClass("highlight");

		// loop through the navigation links to highlight the clicked one
		$j("#navigation ul a").each(function() {
			var navURL = "#"+cnt;
			var navHash = navURL.split("#")[1];
			if (clickedHash === navHash) {
				$j(this).addClass("highlight");
				$j("<span></span>").appendTo("#thumbs ul li a.highlight");
				}
		});
		
		// loop through all thumbnails, highlight the clicked one
		$j("#thumbs a").each(function() {
			var thumbsURL = "#"+cnt;
			var thumbsHash = thumbsURL.split("#")[1];
			if (clickedHash === thumbsHash) {
				 $j(this).addClass("highlight");
				 $j("<span></span>").appendTo("#thumbs ul li a.highlight");
				}
			});
		
	if(cntf==6)
		{
			//alert("yes");
			$j("#description").removeClass();
			$j("#description").addClass("volit");
		   $j("#photo ul").animate(
				{
					marginLeft: "0px"
				}, 500, function() {
					// optional callback after animation completes
				}
			);
		   clickedHash=1;
		}
		else
		{
		// if any of items 2-6 are clicked, animate the margin accordingly
			if (clickedHash > 1) {
				if(clickedHash==2)
				{
					//alert(yes);
					$j("#description").removeClass();
					$j("#description").addClass("green");
				}else if(clickedHash==3)
				{
					 $j("#description").removeClass();
					$j("#description").addClass("blue");
				}else if(clickedHash==4)
				{
					$j("#description").removeClass();
					$j("#description").addClass("orange");
				}
				
			   var marginSetting = sliderWidth*clickedHash-sliderWidth;
			   $j("#photo ul").animate({
				  marginLeft: "-"+marginSetting+"px"
				  }, 500, function() {
					  // optional callback after animation completes
					});
			
			// if item 1 is clicked, send the switcher back to the front (0 margin)
			} else {
				$j("#description").removeClass();
				$j("#description").addClass("volit");
			   $j("#photo ul").animate(
					{
						marginLeft: "0px"
					}, 500, function() {
						// optional callback after animation completes
					}
				);
			}
		}  
	fillContent(clickedHash, objMLB);
//	return false;
						
   }
   
 if(document.getElementById("tab_count").value==1 || document.getElementById("tab_count1").value>1)
 {
	//alert(document.getElementById("tab_count").value);
	 clearInterval(mytimer);
	 $j("#navigation ul a").mouseover(function() {
		clearInterval(mytimer);									  
	});
  $j("#thumbs a, #navigation ul a").bind("click", function() {
		//alert("yes");
		clearInterval(mytimer);	
	});
  $j("#navigation ul a").mouseout(function() {
										//  alert("yes");
		clearInterval(mytimer);							  
	});	
  
 }
 else
 {
	// alert(document.getElementById("tab_count").value);
  var mytimer= setInterval( function(){display_thumbs()} , 5000);
   
  $j("#thumbs a, #navigation ul a").bind("click", function() {
	//	alert("yes");
		clearInterval(mytimer);									  
	});
 }
 /* $j("#navigation ul a").mouseover(function() {
		clearInterval(mytimer);									  
	});*/
  $j("#thumbs a, #navigation ul a").bind("click", function() {
														 //  alert("yes");
		clearInterval(mytimer);									  
	});
 /* $j("#navigation ul a").mouseout(function() {
										//  alert("yes");
		clearInterval(mytimer);							  
	});	*/
	
	// create the hover effect on the thumbnails
	$j("#thumbs a, #navigation ul a, #fot-left2 a").hover(function() {
												
		// remove highlight to prevent duplicates
		$j("#thumbs ul li a span.hoverlight").remove();
		var mousedURL = this.href.toString();
		var mousedHash = mousedURL.split("#")[1];
		$j("<span class='hoverlight'></span>").appendTo("#thumbs ul li:nth-child("+mousedHash+") a");
		}, function() {
			// callback executes after hover complete, so highlight is always ultimately removed
			$j("#thumbs ul li a span.hoverlight").remove();
			});
	
	// Fade in the thumbs only when the nav bar is hovered
	// If you want the thumbs always visible, comment out these 5 lines below, and show #thumbs in CSS
	$j("#hover-box").hover(function() {
		$j("#thumbs").fadeIn(500);
		}, function() {
		$j("#thumbs").fadeOut(500);
		});

	// click event for the previous/next buttons
	$j(".prev-next").bind("click", function() {
	   var pnItem, activeItem;
	   activeItem = $j('#thumbs ul li a.highlight')[0].href.split("#")[1];
	   // make sure the value from the URL is a number, otherwise addition operator won't work
	   activeItem = parseInt(activeItem, 10);
	   // create the previous/next item variable
	   pnItem = 0;
	   // decide the prev/next item based on link ID and active item
	   // this makes sure that "6" is the "previous" item in relation to "1",
	   // and "1" is "next" in relation to "6"
	   if ($j(this).attr("id") === "prev") {
		   if (activeItem === 1) {
			   pnItem = 6;   
		   } else {
			   pnItem = activeItem - 1;												   
		   }
		} else {
			if (activeItem === 6) {
				pnItem = 1;
			} else {
				pnItem = activeItem + 1;
			}
		}

		// remove highlight before adding the new one, to avoid duplicates
		$j("#thumbs ul li a.highlight span").remove();
		$j("#thumbs ul li a, #navigation ul li a").removeClass("highlight");
		$j("<span></span>").appendTo("#thumbs ul li:nth-child("+pnItem+") a");
		$j("#thumbs ul li:nth-child("+pnItem+") a").addClass("highlight");
		$j("#navigation ul li:nth-child("+pnItem+") a").addClass("highlight");

		// calculate the animated margins
		if (pnItem > 1) {
		   var marginSetting = sliderWidth*pnItem-sliderWidth;
		   $j("#photo ul").animate(
				{
					marginLeft: "-"+marginSetting+"px"

				}, 500);

	   } else {
		   $j("#photo ul").animate(
				{
					marginLeft: "0px"

				}, 500);
	   }
	fillContent(pnItem, objMLB);
	return false;
	});

});
