<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{$language.lblProductCategories}</title>
{include file='CommonJavaScript.tpl'}
<link rel="stylesheet" type="text/css" href="{$view_styles}/popup.css" media="screen" />
<link rel="stylesheet" type="text/css" href="{$view_styles}/add-edit.css" media="screen" />	
{form->rootpath_script}
{form->basepath_script}
</head>
<body>
<div class="popup-block">
	<div class="clear"></div>
	{if $resCategories|@count>0} 
			<div class="form_listing02 clearfix">
				<div class="clearfix"> 
	
				 <div class="category-section pos-relative">
				  <div class="div-city">
                      <div class="fixed-section">
                          <h2>{$language.lblProductCategory}</h2>
                      {assign var="categoryValue" value=""}

				{form->textbox name="filterCategories" class="filterBrands text-box margin-bottom" placeholder="Search Categories"}
                          </div>
				{assign var="categoryValue" value=""}
			        <ul  class="dragtree categoryList" id="categoryList">
							  

                <!--menu function-->
                 {function name=categories level=0 catValues=0}

                {foreach from=$data item="productCategory"} 
					
					 {if $productCategory.productCategoryStatus=='Inactive'}
				  {*assign var="categoryName" value="<span class='inactive'>"|cat:$productCategory.productCategoryName|cat:"</span>"*}              
                                  {assign var="categoryName" value=$productCategory.productCategoryName}
                                  {else}
				  {assign var="categoryName" value=$productCategory.productCategoryName} 
				  {/if}
					
		
                        <li  data-level="{$level}" category="{$productCategory.productCategoryID}" catname="{$productCategory.productCategoryName}" class="left-spacing {if $productCategory.productCategoryID==1} ui-state-disabled {/if} li_catIDs" >
                     
                           
                                  
							
									{if !(in_array($productCategory.productCategoryID, $categoryIDList|default:array()))}
                                    <span class="expand {if !(!empty($productCategory['children']) && is_array($productCategory['children']))}hide{/if}"></span>
									{else}
									<span class="expand colapse {if !(!empty($productCategory['children']) && is_array($productCategory['children']))}hide{/if}"></span>
									{/if}
																		  
									 {assign var="categoryValue" value=$catValues|cat:","|cat:$productCategory.productCategoryID}
										{*{if !(in_array($productCategory.productCategoryID, $categoryIDList|default:array()))}
										 {assign var="disable" value="disabled"}
										 {else}
										  {assign var="disable" value=""}
										 {/if}*}

									{form->checkbox   name="categoryIDs" class="categoryTree selectCheckBoxItems" id="category" options=$productCategory.productCategoryID|cat:"->"|cat:"&nbsp;"|cat:$categoryName value="{if $productCategory.productCategoryID|in_array:$categoryIDs} 
									 {$productCategory.productCategoryID}
									{/if}"} 
																			<span class="hiddenTitle hide">	 
												{$productCategory.productCategoryName}
											</span>
                         
							{assign var="children" value=$productCategory['children']|default:''}
                             {if isset($productCategory['children']) && is_array($productCategory['children']) && !empty($productCategory['children'])}
                               <ul id="" class="categoryList {if !(in_array($productCategory.productCategoryID, $categoryIDList|default:array()))}hide {/if}"> 
                            {call name=categories data=$children level=$level+1 catValues=$categoryValue}  <!--menu function calling-->
                            </ul>
                          
                        {else}
                             {if (is_array($productCategory)) && (isset($productCategory['menuItemID'])) && (is_numeric($productCategory['menuItemID']))}
                        </li>	
                        {/if}
                    {/if}
            {/foreach}  
          {/function}
          {call categories data=$resCategories} <!--menu function calling-->
             	 </ul>  
</div>
				</div>
				
				</div>
				<div class="clear"></div>
			</div>
			<div class="submit-block clearfix textto_center pos-fixed">
				<span>&nbsp; </span> 
				{form->button name="addCategoryButton" class="blueBtn-1" value=$language.lblPromotionSchemaLinkCategory}
				{$language.lblOr} 
				{html->anchor onclick="parent.$.colorbox.close();" id="cancel" class="grayBtn3" caption="{$language.lblCancel}"}
			</div>
	{else}
        <div class="message_info"> {$language.msgNoRecords}</div>	
	{/if}	
</div>
<script>
var wHeight = $(window).height();
var docHeight=$(document).height();

if(docHeight>wHeight){
	$(".popup-block").addClass("footerfix");
}
else{
	$(".popup-block").removeClass("footerfix");
}
var lblSelectItem ="{$language.lblSelectItem}";	
$(document).ready(function (){	
		$(".expand").click(function(){
		if($(this).hasClass('colapse')){
			$(this).removeClass('colapse');
			$(this).closest('li').find('ul:first').addClass('hide');
		}
		else{
			$(this).addClass('colapse'); 
			$(this).closest('li').find('ul:first').removeClass('hide');
		}
	});
	
    $(document).on('click', ".expandable", function () {
        var id = $(this).attr("id");
        $("#div" + id).fadeIn();
        $(this).removeClass("expandable").addClass("collapsable");
    });
    $(document).on('click',".collapsable",function () {
        var id = $(this).attr("id");
        $("#div" + id).fadeOut();
        $(this).removeClass("collapsable").addClass("expandable");
    });		
		$(document).on('keyup',"#filterCategories",function(){
		
		var val = $(this).val();
		$(".li_catIDs").each(function() {
		//console.log($(this).attr('catname').toLowerCase().indexOf(val));
		if ($(this).attr('catname').toLowerCase().indexOf(val) > -1) {
			if($(this).attr('data-level') == 0){
				$(this).removeClass("hide").addClass("show");
			}
		}else{
			if($(this).attr('data-level') == 0){
				$(this).removeClass("show").addClass("hide");
			}
		}			
		});
	})		
$(document).on('click', ".listAllCheckBoxItems", function () {
	if ($(this).prop("checked") == true) {
		$(".selectCheckBoxItems").prop("checked", true);
	} else {
		$(".selectCheckBoxItems").prop("checked",false);
	}
});	
$(document).on('click', "#addCategoryButton", function () {
	if($(".categoryTree:checked").size()==0)
	{
		jAlert(lblSelectItem);
		return false;
	} 
	var selectedDataObj = [];
	$('.categoryTree:checked').each(function () {        
		selectedDataObj.push({
            id: $(this).val(),
            title: $(this).next(".hiddenTitle").html()
        });
	}); 
	parent.$.colorbox.close();
	parent.addItemFromPicker(selectedDataObj); 
});	
});	
setCheckboxSelected();
function setCheckboxSelected()
{
	var currentSelected = parent.currentPopupPicker.nextAll().find(".popupPickerDataValues:first").val();
	if(currentSelected)
	{
		var selectedIds = currentSelected.split(",");
		$('.selectCheckBoxItems').each(function () { 
			if($.inArray($(this).val(),selectedIds)>-1)
			$(this).prop("checked", true);
		});
	}
}
</script>	
</body>
</html>