var listShow = 0;
var listShow2 = 0;
//var totalResultsSmallAds = 0;

var agt=navigator.userAgent.toLowerCase();
var is_ie      = ((agt.indexOf("msie") != -1) && (agt.indexOf("opera") == -1));
var is_ie6less = (is_ie && (agt.indexOf("msie 6")!=-1 || agt.indexOf("msie 4")!=-1 || agt.indexOf("msie 5.0")!=-1 || agt.indexOf("msie 5.5") !=-1));
var is_ie6up   = (is_ie && !is_ie6less);
var is_safari  = (agt.indexOf('safari') != -1);

/**
 * Custom inital load handler. Called when the carousel loads the initial
 * set of data items. Specified to the carousel as the configuration
 * parameter: loadInitHandler
 */
var loadInitialItems = function(type, args) {

	var start = args[0];
	var last = args[1]; 

	// fetch twice the number for caching. images are create once.
	//makeRequest(this, 'http://www.sunnipath.com/JSON/', start, (last-start+1) * 2,"");	
	makeRequest(this, 'JSON/', start, (last-start+1) * 2,"");	
};

var loadInitialItems2 = function(type, args) {

	var start = args[0];
	var last = args[1]; 

	//makeRequest(this, 'http://www.sunnipath.com/JSON/', start, (last-start+1) * 3,"small");		
	makeRequest(this, 'JSON/', start, (last-start+1) * 3,"small");
};
/**
 * Custom load next handler. Called when the carousel loads the next
 * set of data items. Specified to the carousel as the configuration
 * parameter: loadNextHandler
 */
var loadNextItems = function(type, args) {	

	var start = args[0];
	var last = args[1];
	var alreadyCached = args[2];

	var indx = 1;
	thisItem = document.getElementById("mainNum"+indx);
	while(thisItem)
	{				
		if(thisItem)
		{
			thisItem.style.backgroundImage = "";
		}
		indx++;
		thisItem = document.getElementById("mainNum"+indx);	
	}

	//alert(start+"x"+last+"x"+alreadyCached);
	var thisItem = document.getElementById("mainNum"+start);	
	if(thisItem)
	{
		thisItem.style.backgroundImage = "url('carousel/images/carousel-large-circle.png')";
		//thisItem.style.backgroundPosition = "0% 20%";
	}
	/*
	thisItem = document.getElementById("mainNum"+(start-1));	
	if(thisItem)
	{
		thisItem.style.backgroundImage = "";
	}*/

	if(!alreadyCached) {
		//makeRequest(this, 'http://www.sunnipath.com/JSON/', start, (last-start+1) * 2,"");
		makeRequest(this, 'JSON/', start, (last-start+1) * 2,"");
	}

	if(document.getElementById("pause-play").src.indexOf("carousel-large-pause.png") != -1)
	{
		startAutoPlay();
	}

};

var loadNextItems2 = function(type, args) {	

	var start = args[0];
	var last = args[1];
	var alreadyCached = args[2];

	/*if(totalResultsSmallAds - start == 2)
		moveTo(totalResultsSmallAds);*/

	//alert(start+"x"+last+"x"+alreadyCached);

	var indx = 1;
	thisItem = document.getElementById("subNum"+indx);
	while(thisItem)
	{				
		if(thisItem)
		{
			thisItem.style.backgroundImage = "";
		}
		indx++;
		thisItem = document.getElementById("subNum"+indx);	
	}

	//var thisItem = document.getElementById("subNum"+((start+1)/2));

	var thisItem = document.getElementById("subNum"+Math.floor(start/3+1));	
	if(thisItem)
	{
		thisItem.style.backgroundImage = "url('carousel/images/carousel-dot-current.gif')";
	}
	/*
	thisItem = document.getElementById("subNum"+(((start+1)/2)-1));		
	if(thisItem)
	{
		thisItem.style.backgroundImage = "";
	}
	*/

	if(!alreadyCached) {
		//makeRequest(this, 'http://www.sunnipath.com/JSON/', start, (last-start+1) * 3,"small");
		makeRequest(this, 'JSON/', start, (last-start+1) * 3,"small");

	}
};

/**
 * Custom load previous handler. Called when the carousel loads the previous
 * set of data items. Specified to the carousel as the configuration
 * parameter: loadPrevHandler
 */
var loadPrevItems = function(type, args) {
	var start = args[0];
	var last = args[1]; 
	var alreadyCached = args[2];

	var indx = 1;
	thisItem = document.getElementById("mainNum"+indx);
	while(thisItem)
	{				
		if(thisItem)
		{
			thisItem.style.backgroundImage = "";
		}
		indx++;
		thisItem = document.getElementById("mainNum"+indx);	
	}

	//alert(start+"x"+last+"x"+alreadyCached);
	var thisItem = document.getElementById("mainNum"+start);	
	if(thisItem)
	{
		thisItem.style.backgroundImage = "url('carousel/images/carousel-large-circle.png')";
		//thisItem.style.backgroundPosition = "0% 20%";
	}
	/*
	thisItem = document.getElementById("mainNum"+(start+1));	
	if(thisItem)
	{
		thisItem.style.backgroundImage = "";
	}*/

	if(!alreadyCached) {
		//makeRequest(this, 'http://www.sunnipath.com/JSON/', start,(last-start+1) * 2,"");
		makeRequest(this, 'JSON/', start,(last-start+1) * 2,"");
	}

	if(document.getElementById("pause-play").src.indexOf("carousel-large-pause.png") != -1)
	{
		startAutoPlay();
	}
};

var loadPrevItems2 = function(type, args) {
	var start = args[0];
	var last = args[1]; 
	var alreadyCached = args[2];

	//alert(start+"x"+last+"x"+alreadyCached);

	var indx = 1;
	thisItem = document.getElementById("subNum"+indx);
	while(thisItem)
	{				
		if(thisItem)
		{
			thisItem.style.backgroundImage = "";
		}
		indx++;
		thisItem = document.getElementById("subNum"+indx);	
	}

	//var thisItem = document.getElementById("subNum"+((start+1)/2));
	
	var thisItem = document.getElementById("subNum"+Math.floor(start/3+1));		
	if(thisItem)
	{
		thisItem.style.backgroundImage = "url('carousel/images/carousel-dot-current.gif')";
	}
	/*
	thisItem = document.getElementById("subNum"+(((start+1)/2)+1));	
	if(thisItem)
	{
		thisItem.style.backgroundImage = "";
	}
	*/

	if(!alreadyCached) {
		//makeRequest(this, 'http://www.sunnipath.com/JSON/', start,(last-start+1) * 3,"small");
		makeRequest(this, 'JSON/', start,(last-start+1) * 3,"small");

	}
};

/**
 * Custom button state handler for enabling/disabling button state. 
 * Called when the carousel has determined that the previous button
 * state should be changed.
 * Specified to the carousel as the configuration
 * parameter: prevButtonStateHandler
 */
var handlePrevButtonState = function(type, args) {

	var enabling = args[0];
	var leftImage = args[1];
	if(enabling) {
		leftImage.src = "carousel/images/left-enabled.png";
		leftImage.style.opacity = 1;	
		leftImage.style.filter = "alpha(opacity=100)";
	} else {
		leftImage.style.opacity = 0.5;	
		leftImage.style.filter = "alpha(opacity=50)";
	}
};

var handlePrevButtonState2 = function(type, args) {

	var enabling = args[0];
	var leftImage = args[1];
	if(enabling) {
		leftImage.src = "carousel/images/carousel-info-back.gif";
		leftImage.style.opacity = 1;	
		leftImage.style.filter = "alpha(opacity=100)";
	} else {
		leftImage.style.opacity = 0.5;	
		leftImage.style.filter = "alpha(opacity=50)";
	}
};

var handleNextButtonState = function(type, args) {
	var enabling = args[0];
	var rightImage = args[1];

	if(enabling) {
		rightImage.src = "carousel/images/right-enabled.png";
		rightImage.style.opacity = 1;
		rightImage.style.filter = "alpha(opacity=100)";	
	} else {
		rightImage.style.opacity = 0.5;
		rightImage.style.filter = "alpha(opacity=50)";
	}
	
};

var handleNextButtonState2 = function(type, args) {
	var enabling = args[0];
	var rightImage = args[1];

	if(enabling) {
		rightImage.src = "carousel/images/carousel-info-forward.gif";
		rightImage.style.opacity = 1;	
		rightImage.style.filter = "alpha(opacity=100)";	
	} else {
		rightImage.style.opacity = 0.5;
		rightImage.style.filter = "alpha(opacity=50)";
	}
	
};


var showButtons = function(type, args) {
	YAHOO.util.Dom.setStyle("next-arrow", "visibility", "visible");
	YAHOO.util.Dom.setStyle("prev-arrow", "visibility", "visible");
};


/**
 * You must create the carousel after the page is loaded since it is
 * dependent on an HTML element (in this case 'dhtml-carousel'.) See the
 * HTML code below.
 */
var carousel; // for ease of debugging; globals generally not a good idea

var pageLoad = function() 
{
	carousel = new YAHOO.extension.Carousel("dhtml-carousel", 
		{
			numVisible:        1,
			animationSpeed:    0.4,
			scrollInc:         1,
			loadInitHandler:   loadInitialItems,
			prevElement:       "prev-arrow",
			nextElement:       "next-arrow",
			loadNextHandler:   loadNextItems,
			loadPrevHandler:   loadPrevItems,
			prevButtonStateHandler:   handlePrevButtonState,
			nextButtonStateHandler:   handleNextButtonState,
			autoPlay: 6000,
			wrap:true
		}
	);

	carousel2 = new YAHOO.extension.Carousel("dhtml-carousel2", 
		{
			numVisible:        3,
			animationSpeed:    0.4,
			scrollInc:         3,
			loadInitHandler:   loadInitialItems2,
			prevElement:       "prev-arrow2",
			nextElement:       "next-arrow2",
			loadNextHandler:   loadNextItems2,
			loadPrevHandler:   loadPrevItems2,
			prevButtonStateHandler:   handlePrevButtonState2,
			nextButtonStateHandler:   handleNextButtonState2
		}
	);
};

var changePage = function(e, args) {
	var carousel = args[0];
	var pageNum = args[1];

	carousel.scrollTo(pageNum);
};

var changePage2 = function(e, args) {
	var carousel = args[0];
	var pageNum = args[1];

	carousel2.scrollTo(((pageNum-1)*3)+1);
};

/**
 * Illustrates stop autoplay
 */
var stopAutoPlay = function(e) {
	carousel.stopAutoPlay();
	YAHOO.util.Event.addListener("pause-play", 'click', startAutoPlay);
	document.getElementById("pause-play").src = "carousel/images/carousel-large-play.png";
	carousel.setProperty("wrap", false);
};

/**
 * Illustrates start autoplay
 */
var startAutoPlay = function(e) {
	carousel.startAutoPlay();
	YAHOO.util.Event.addListener("pause-play", 'click', stopAutoPlay);
	document.getElementById("pause-play").src = "carousel/images/carousel-large-pause.png";
	carousel.setProperty("wrap", true);
};

YAHOO.util.Event.addListener(window, 'load', pageLoad);
YAHOO.util.Event.addListener("pause-play", 'click', stopAutoPlay);

/**
 * Called via the YUI Connection manager (see makeRequest).
 */
var handleSuccess = function(callbackResponse)
{
	var start = callbackResponse.argument[0];
	var numResults = callbackResponse.argument[1];
	var carousel = callbackResponse.argument[2];
	
  	if(callbackResponse.responseText !== undefined) {		
		var theTrip = eval( '(' + callbackResponse.responseText + ')' );

		carousel.setProperty("size", theTrip.ResultSet.totalResults , true);

		if(listShow == 0) {
			for(var i=1; i<= theTrip.ResultSet.totalResults; i++) {
				addMainNavNumbers(i);
			}	

			listShow = 1;

			var firstItem = document.getElementById("mainNum1");	
			if(firstItem)
			{
				firstItem.style.backgroundImage = "url('carousel/images/carousel-large-circle.png')";
				//thisItem.style.backgroundPosition = "0% 20%";
			}			
		}

		for(var i=0; i< theTrip.ResultSet.totalResultsReturned; i++) {
			var result = theTrip.ResultSet.Result[i];
			carousel.addItem(start+i, fmtTripInnerHTML(result));		
		}
		showButtons();
     }
};

var handleSuccess2 = function(callbackResponse)
{
	var start = callbackResponse.argument[0];
	var numResults = callbackResponse.argument[1];
	var carousel = callbackResponse.argument[2];
	
  	if(callbackResponse.responseText !== undefined) {		
		var theTrip = eval( '(' + callbackResponse.responseText + ')' );

		carousel.setProperty("size", theTrip.ResultSet.totalResults , true);
		//totalResultsSmallAds = theTrip.ResultSet.totalResults+1;

		if(listShow2 == 0) {
			//for(var i=1; i<= (theTrip.ResultSet.totalResults/2); i++) {
			for(var i=1; i<= (theTrip.ResultSet.totalResults/3); i++) {
				addsmallAdsNavNumbers(i);
			}	

			listShow2 = 1;

			var firstItem = document.getElementById("subNum1");	
			if(firstItem)
			{
				firstItem.style.backgroundImage = "url('carousel/images/carousel-dot-current.gif')";
			}			
		}

		for(var i=0; i< theTrip.ResultSet.totalResultsReturned; i++) {
			var result = theTrip.ResultSet.Result[i];
			carousel.addItem(start+i, fmtTripInnerHTML2(result));		
		}
		showButtons();
     }
};

/**
 * Since carousel.addItem uses an HTML string to create the interface
 * for each carousel item, this method takes an individual trip plan
 * result and cobbles together HTML for the innerHTML argument.
 */
var fmtTripInnerHTML = function(result) {

  	var tripInnerHTML = 
  		'<a href="' + 
  		result.Url + 
  		'"><img src="' + 
  		result.Image.Url +
		'" width="' +
		947 +
		'" height="' +
		422+
		'"/>'; /* + 
  		trunc(result.Title, 40, 20) + 
  		'<\/a>' + 
  		trunc(result.Summary, 20, 20);*/
  
	return tripInnerHTML;
	
};

var fmtTripInnerHTML2 = function(result) {

  	var tripInnerHTML = 
  		'<a href="' + 
  		result.Url + 
  		'"><img src="' + 
  		result.Image.Url +
		'" width="' +
		201 +
		'" height="' +
		217+
		'"/>'; 
  
	return tripInnerHTML;
	
};


var handleFailure = function(o)
{
     var result = o.status + " " + o.statusText;
     //alert("Transaction failed.  The error is: " + result);
};
  
/**
 * A utility function for invoking the YUI connection manager (Ajax)
 * with a URL that matches the Yahoo! developer network Trip Planner
 * APIs (see: http://developer.yahoo.com/travel/tripservice/V1/tripSearch.html)
 *
 * The callback object is the configuration object for the YUI Connection
 * manager. If this is successful, the 'handleSuccess' function is called.
 */
var makeRequest = function(carousel, url, start, numResults, whichAds)
{
	var params = '?start=' + start + 
	              '&results=' + numResults; 
	
	if(whichAds != "")
		params += "&ads="+whichAds;

	if(whichAds == "small")
	{
		var callback =
		{
	  		success: handleSuccess2,
	  		failure: handleFailure,
	  		argument: [start, numResults, carousel]
		};
	}
	else
	{
		var callback =
		{
	  		success: handleSuccess,
	  		failure: handleFailure,
	  		argument: [start, numResults, carousel]
		};
	}
	
	var sUrl = url + params; 
	YAHOO.util.Connect.asyncRequest("GET", sUrl, callback, null);
};

/**
 * Just a utility function for cleaning up the returned HTML response
 * and truncating it.
 */
var trunc = function(str, maxLen, maxWordLen) 
{
	// Strip markup
    str = str.replace("<b>", "");
    str = str.replace("<\/b>", "");
    str = str.replace("<B>", "");
    str = str.replace("<\/B>", "");
    
    // Simple truncation
	if(str.length > maxLen) {
		str = str.substring(0,maxLen) + "...";
	}

	// Truncate for long words
	var start = 0;
	var loopCnt = 0;
	var strSlice = str;
	
	do  {
		var spaceBreak = strSlice.indexOf(' ');
		var lenOfWord = spaceBreak;
		if(lenOfWord == -1)
		{
			lenOfWord = strSlice.length;
		}

		if (lenOfWord > maxWordLen) {
			//debugMsg("Long word found in: " + strSlice);
			str = str.substring(0, maxWordLen);  // TRUNCATE
		}
		start = spaceBreak+1;
		strSlice = strSlice.substring(start);
		spaceBreak = strSlice.indexOf(' ');
	} while(spaceBreak != -1)
	
	
	return str;
};

/* SunniPath */
var addMainNavNumbers = function(num)
{
	numLi = document.createElement("li");
	numLi.innerHTML = num;
	//numLi.setAttribute("style","float:left;");
	numLi.className = "mainNavNum";
	numLi.id = "mainNum"+num;
	document.getElementById("mainNumbers").appendChild(numLi);
	YAHOO.util.Event.addListener("mainNum"+num, "click", changePage, [carousel, num]);	
};

var addsmallAdsNavNumbers = function(num)
{
	numLi = document.createElement("li");
	numLi.className = "subNavNum";
	numLi.id = "subNum"+num;
	//numLi.innerHTML = '<a id="tab'+num+'" href="#" />';
	document.getElementById("subNumbers").appendChild(numLi);
	YAHOO.util.Event.addListener("subNum"+num, "click", changePage2, [carousel2, num]);	
};
