// Jumbotron feed

var oXMLHttpJumbotron;

function GetJumbotronXMLHttpObject()
{
     oXMLHttpJumbotron = null;

      try
      {
            oXMLHttpJumbotron = new ActiveXObject("MSXML2.XMLHTTP");
      }
      catch (E)
      {
            try
            {
                  oXMLHttpJumbotron = new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch (E)
            {
              oXMLHttpJumbotron = null;
            }
    }

      if ((oXMLHttpJumbotron == null) && (typeof(XMLHttpRequest) != 'undefined'))
      {
            oXMLHttpJumbotron = new XMLHttpRequest();
      }

      return oXMLHttpJumbotron;
}


var jumboObj = new Object;

var currentFeat = 0;

var panePosition = 0;

var paneCount = 0;

function loadJumbotron()
{

	if(oXMLHttpJumbotron)
	{
		oXMLHttpJumbotron.abort();
	}

	oXMLHttpJumbotron = GetJumbotronXMLHttpObject();

	var url = "php/getJumbotronInfo.php";

	oXMLHttpJumbotron.open("POST", url, true);

	oXMLHttpJumbotron.onreadystatechange = function()
	    {
		  if (oXMLHttpJumbotron.readyState == 4)
		  {
			var JSONObject = new Object;

			var response = oXMLHttpJumbotron.responseText;

			//alert(response);
			JSONObject = JSON.parse(response);

			jumboObj = JSONObject.JumboTron;
			
			buildCarousel();
		  }
	    }

	oXMLHttpJumbotron.send(null);

}

function loadFeature(featId)
{
	currentFeat = featId;
	setStage();
}


function buildCarousel()
{
	var selHtml = "";

	selHtml = '<div style="position:relative; width:100%; height 100%;"><div id="carouselMask"><div id="belt">';

	propVid = "";

	for(property in jumboObj)
	{
		if(paneCount == 0) defaultProp = property;

		var thumb = jumboObj[property].thumbUrl;

		var title = jumboObj[property].title;

		selHtml += '<div id="panel" onclick="loadFeature(\''+ property +'\');" onmouseover="this.style.cursor=\'pointer\'"><div style="position: relative; border: 1px solid #ffffff; width 130px; height: 90px;"><img src="'+thumb +'" /></div>'+ title +'</div>';

		paneCount++;
	}

	selHtml += '</div></div></div>';
	$("#carousel").html(selHtml);
	$("#carouselContainer").css({ display: "block" });
	
	jumboLoaded = true;

	setStage();
}

function shiftPane(dir)
{
	switch(dir)
	{
		case "left":
			if(panePosition > 0)
			{
				panePosition--;
				$("#belt").animate({"left": "+=150px"}, 500);
				if(panePosition == 0) $("#stepLeft").css({ visibility: "hidden" });
				if(panePosition < (paneCount - 5)) $("#stepRight").css({ visibility: "visible" })
			}
			break;

		case "right":
			if(panePosition < (paneCount - 5))
			{
				panePosition++;
				$("#belt").animate({"left": "-=150px"}, 500);
				if(panePosition >= (paneCount - 5))
				{
					$("#stepRight").css({ visibility: "hidden" });
				} else {
					$("#stepRight").css({ visibility: "visible" });
				}
				if(panePosition > 0) $("#stepLeft").css({ visibility: "visible" });
			}
			break;
	}
}