/// <reference path="../includeReference.js" />

var CategoryListView = new function()
{



	this.createCategoryListDiv = function(categories/*can be undefined*/,level/* category depth , can be undefined */,bgColor/*can be undefined*/)
	{
		if (categories == undefined)
		{
			categories = T_Categories.getMainCategories();
			level=0;
		}		


		var divCategories = document.createElement("div");		
		if (T_MenuLanguages.isLangRTL())
		{
			divCategories.setAttribute("dir", "rtl");
		}

		for (var index in categories)
		{
			var category=categories[index];
			var divCategory = document.createElement("div");

			divCategory.onclick = this.categoryClicked;
			divCategory.setAttribute("categoryID", category);
			var bHasImage = false;
			var imgCategory =CategoryImages.getImage(category,T_MenuLanguages.getCurrentLanguageCode());
			if (imgCategory ) {
			    //divCategory.style.background = "url('" + sCategoryImage + "')";
			    divCategory.appendChild(imgCategory);
			    divCategory.style.fontSize = "0px";//this remove spaces around the img due to spaces in the HTML
			    var iMaxWidth = 0.9 * document.body.clientWidth;
			    
			    imgCategory.style.maxWidth=iMaxWidth+"px";
			    bHasImage = true;
			}
			else
			{
			    divCategory.setAttribute("align", T_MenuLanguages.isLangRTL() ? "right" : "left");
			    divCategory.className = "divSelectCategory";
			    if (bgColor != undefined)
			        divCategory.style.backgroundColor = bgColor;

			    
			    divCategory.textContent = T_Categories.getCategoryName(category);
			}

			if (level != undefined)
			    divCategory.setAttribute("level", level);


			divCategory.style.position="relative";
			divCategories.appendChild(divCategory);

            			
			if (T_Categories.isParent(category) && !bHasImage)
			{
				var imgArrowDown=document.createElement("img");
				imgArrowDown.className = "cssArrow";

				imgArrowDown.src=CachedImages.getArrowDownURL();
				imgArrowDown.style.height="1em";


				imgArrowDown.style.position="absolute";
				imgArrowDown.style.bottom="0px";
				if (T_MenuLanguages.isLangRTL())
					imgArrowDown.style.left="5px";
				else
					imgArrowDown.style.right="5px";

				//divCategory.appendChild(imgArrowUp);
				divCategory.appendChild(imgArrowDown);			
				var imgArrowUp = imgArrowDown.cloneNode(true);
				imgArrowUp.src=CachedImages.getArrowUpURL();
				imgArrowUp.style.display="none";
				divCategory.appendChild(imgArrowUp);
			}

		}


		return divCategories;
	};




	this.categoryClicked = function(e)
	{

		if (GUI.isDoubleFired())
			return;

		this.lastClickTime=new Date();


		var div = e.target;
		if (div.tagName.toLowerCase() == "img")
		    div = div.parentElement;

		var sCategoryID = div.getAttribute("categoryID");

		var subCategories = T_Categories.getCategoriesByParent(sCategoryID);

		var bHasSubCategories = false;

		for (var category in subCategories)
		{
			bHasSubCategories = true;
			break;
		}


		if (bHasSubCategories == true)
		{
			var arrows = div.getElementsByTagName("img");
			for (var i = 0; i < arrows.length; i++) {
			    if (arrows[i].className != "cssArrow")
			        continue;

			    if (arrows[i].style.display == "none")
			        arrows[i].style.display = "";
			    else
			        arrows[i].style.display = "none";
			}
			if (div.expanded=="true") //remove current sub categories
			{			

				div.nextSibling.parentElement.removeChild(div.nextSibling);
				div.expanded="false";


			}
			else
			{ //add subCategories

				div.expanded="true";
				var level = parseInt(div.getAttribute("level"))+1;			
				var opacity=(1-level*0.2)+"";

				//get the bg color and add alpha to it 
				var bgColor="";
				bgColor=window.getComputedStyle(div).getPropertyValue("background-color");

				if (bgColor.indexOf("rgba")>=0)
				{
					var i =bgColor.lastIndexOf(",");
					bgColor=bgColor.substring(0,i);
					bgColor+=(","+opacity+")");
				}
				else if (bgColor.indexOf("rgb")>=0)
				{
					var i =bgColor.lastIndexOf(")");
					bgColor=bgColor.substring(0,i);
					bgColor+=(","+opacity+")");
					bgColor=bgColor.replace("rgb", "rgba");
				}
				else if (bgColor.indexOf("#")>=0)
				{	//TODO		

					bgColor+="ee";
				}


				var divSubCategories = CategoryListView.createCategoryListDiv(subCategories,level, bgColor);

				divSubCategories.className="subCategory";
				//setAttribute("divType", "subCategory");

				var parent = div.parentNode;

				if (parent.lastchild == div)
				{
					parent.appendChild(divSubCategories);
				} 
				else
				{
					parent.insertBefore(divSubCategories, div.nextSibling);
				}




				//scroll to see the div				
				var pageHeight=MainScrollView.getScrollVisibleHeight(div);
				var scrollY=div.offsetTop;

				//don't scroll more than needed (align subcategories to the bottom)
				if (div.clientHeight+divSubCategories.clientHeight<pageHeight)
					scrollY=div.offsetTop-(pageHeight-(div.clientHeight+divSubCategories.clientHeight));

				var scroller=MainScrollView.getScrollParent(div);
				scroller.refresh();
				if(scrollY>=0)
					scroller.scrollTo(0,-scrollY,200);


			}
		}
		else
		{			
			var newDiv = DishListView.createDishListDiv(sCategoryID);
			if (newDiv != null)
			{
				if (MainScrollView.isScrolling())			
					return;


				MainScrollView.clearNextPages();

				MainScrollView.addView(newDiv, false);
				MainScrollView.goNextPage();
			}
			else alert("Empty Category");
		}

	};


};