// JavaScript Document

function Panel (xmlData, wrapper, itemClickedCallback, color)

{

	/* Constants **/

	var ITEM_PER_LINE = 4;

	var ROWS = 4;

	var GIF_AVAIABLE = 8;

	

	/* Params **/

	var _xml = xmlData;

	var _wrapper = $(wrapper);

	var _itemClickedCallback = itemClickedCallback;

	var _color = color;

	

	/* Objects **/

	var _wrapper;

	var _timer;

	var _total;

	var _gifTotal;

	var _mousePosition = {x: 0, y: 0};

	var pos;

	

	/* Public Methods

	************************************************************************/

	this.getDataItemPannel = function (itemIndex)

	{

		return {path: _xml.find("project:eq(" + itemIndex + ")").attr("path"), xml: _xml};

	}

	

	this.animatePannelOut = function ()

	{

		scrollObjects($(".inner_page"), "x", $(".painel_images", _wrapper).width(), 500);	

	}

	

	/* Private Methods

	**************************************************/

	function parseXML ()

	{

		/* Params **/

		_total = _xml.find("project").length;

		_gifTotal = ITEM_PER_LINE - (_total % ITEM_PER_LINE);

		if(_gifTotal < ITEM_PER_LINE) _gifTotal += ITEM_PER_LINE;

		

		/* Add UL **/

		_wrapper.append("<ul class='painel_images'></ul>");

		

		/* Gif Control **/

		var gifCount = 0;

		var gifPosition = Math.floor(_total / _gifTotal);	

		var gifIndex;

		var gifCurrPosition;

		var gifType = 1;

		

		/* Loop **/

		var i = 0;

		

		_xml.find("project").each(function ()

		{

			var html = "";

			var style = "";

			

			/* Create GIF

			***************************************************/

			if(i % gifPosition == 0) 

			{

				gifIndex = 0;

				gifCurrPosition = Math.floor(Math.random() * gifPosition);		

			}

			

			if(gifIndex == gifCurrPosition && gifCount < _gifTotal) 

			{	

				style = i + gifCount < ITEM_PER_LINE ? "style='border-top: 2px solid " + _color + "; height: 148px;'" : "";

				html += "<li class='panel_item' rel='none' " + style + ">";

				html += "	<div class='panel_tv_hover'></div>";

				html += "	<div class='panel_item_image' style=\"background: url('library/img/shared/ui/gif" + gifType + ".gif')\"></div>";

				html += "</li>";

				gifCount++;

				gifType = gifType < GIF_AVAIABLE ? gifType + 1 : 1;

			}

			

			/* Create ITEM

			***************************************************/

			var projTitle = $(this).find("title").find("pt").text() == "" ? "" : $(this).find("title").find("pt").text();

			var projSituation = $(this).attr("situation") == "" ? "" : "<br />" + $(this).attr("situation");

			var projKinded = $(this).attr("kinded") == "" ? "" : "<br />" + $(this).attr("kinded");

			var projLaunchDate = $(this).attr("launchDate") == "" ? "" : " - " + $(this).attr("launchDate");

			var sizeSqm = $(this).attr("sizeSqm") == "" ? "" : parseInt($(this).attr("sizeSqm"));

			

			if(sizeSqm != "")

			{

				var sizeSqmMod = sizeSqm % 5;

				

				if(sizeSqmMod != 0) 

				{

					if(sizeSqmMod > 3)

					{

						sizeSqm += 5 - sizeSqmMod;	

					}

					else 

					{

						sizeSqm -= sizeSqmMod;

					}

				}

				

				sizeSqm = sizeSqm == undefined ? "" : " - " + sizeSqm.toString() + "mē";

			}

			

			style = i + gifCount < ITEM_PER_LINE ? "style='border-top: 2px solid " + _color + "; height: 148px;'" : "";

			html += "<li class='panel_item' rel='" + i + "' " + style + ">";

			html += "	<div class='panel_item_hover'>";

			html += "		<span class='item_hover_description'>" + projTitle + projSituation + projKinded + projLaunchDate + sizeSqm + "</span>";

			html += "	</div>";

			html += "	<div class='panel_item_image' style=\"background: url('" + $(this).attr("path") + $(this).attr("thumb") +"')\"></div>";

			html += "</li>";

			

			/* Print **/

			$(".painel_images", _wrapper).append(html);

			

			/* increment **/

			gifIndex++;

			i++;

		});

		

		if($(".panel_item", _wrapper).length < ITEM_PER_LINE * (ROWS - 1))

		{

			$(".painel_images", _wrapper).css("margin-top", (_wrapper.height() - $(".painel_images", _wrapper).height()) / 2);

		}

		else

		{

			$(".painel_images", _wrapper).css("margin-top", "-2px");

		}

		

		$(".panel_tv_hover").fadeTo(0, .08);

				

		/* methods **/

		setupControls();

	}

	

	function setupControls ()

	{

		$(".panel_item").unbind("mouseenter");

		$(".panel_item").mouseenter(function () 

		{

			//$(".panel_tv_hover", this).fadeTo(500, .8);

			$(".panel_item_hover" ,this).fadeIn("fast");

		});

		

		$(".panel_item").unbind("mouseleave");

		$(".panel_item").mouseleave(function () 

		{

			//$(".panel_tv_hover", this).fadeTo(500, .2);

			$(".panel_item_hover" ,this).fadeOut("fast");

		});

		

		$(".panel_item").unbind("click");

		$(".panel_item").click(function ()

		{

			if($(this).attr("rel") == "none") return;

			scrollObjects($(".inner_page"), "x", $(".painel_images", _wrapper).width(), 500);

			var imagesPath = _xml.find("project:eq(" + $(this).attr("rel") + ")").attr("path");

			var imagesXML = _xml.find("project:eq(" + $(this).attr("rel") + ")");

			_itemClickedCallback({path: imagesPath, xml: _xml, index: parseInt($(this).attr("rel"))});

		});

		

		/* Setup Rollover

		************************************************/		

		if(_xml.find("project").length + _gifTotal > (ITEM_PER_LINE * ROWS)) 

		{

			if(navigator.userAgent.match(/iPad/i) != null) 

			{

				_wrapper.css("overflow-x", "hidden");

				_wrapper.css("overflow-y", "auto");

			}

			else 

			{

				$(".panel_container").mouseover(function (e)

				{

					_mousePosition.y = e.pageY - 100;

				});

				

				_timer = setInterval(animatePanel, 10);

			}

		}

	}

	

	function animatePanel ()

	{

		pos = (($(".panel_container").height() / 2) - _mousePosition.y) * 0.02;

		$(".painel_images").css("margin-top", parseInt($(".painel_images").css("margin-top")) + pos);

		

		if(parseInt($(".painel_images").css("margin-top")) > -2) $(".painel_images").css("margin-top", "-2px");

		if(parseInt($(".painel_images").css("margin-top")) < $(".panel_container").height() - $(".painel_images").height() + 2) {

			$(".painel_images").css("margin-top", $(".panel_container").height() - $(".painel_images").height() + 2);

		};

	}

	

	

	

	parseXML ();

}