@extends('layouts/fullLayoutMaster')

@section('title', $category->name)

@section('vendor-style')

@endsection
@section('page-style')


 @endsection

@section('content')
<div class="market_left_category">

<ul class="market_left_category_lists">

</ul>
</div>
<div class="market_right_category">

<div class="market-product_filter hide_search">
    <div class="market-product_filter_header">
        <h4>Категория</h4>
        <button type="button" data-tag="reset" data-text="strClear" class="hide">Сбросить</button>
    </div>

    <div class="market-product_filter_search">
        <input type="text" name="cat_search" placeholder="Поиск">
    </div>

    <div class="market-product_filter_items">
        <div class="market-product_filter_items-in">
			<h4 class="market-product_filter_group-title"></h4>
			@foreach($subcategory as $subitem)
			<div class="market-product_filter_item" data-id="{{ $subitem->id }}">
				<span class="market-product_filter_item-in" data-count="{{ Helper::getCountCategoryProductGlobal($subitem->id) }}">{{ $subitem->name }}</span>
			</div>
			@endforeach
		</div>
        <div class="market-product_filter_no-items hide">Ничего не нашлось</div>
    </div>
    <button class="market-product_filter_fold hide" type="button" >Смотреть&nbsp;все</button>
</div>

</div>


<div class="catalogs_list-market">

<div class="catalogs_list-market_backsearch">

 <div class="menu_filter-item" id="marketOpenFilter">
 <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M14.3201 19.07C14.3201 19.68 13.92 20.48 13.41 20.79L12.0001 21.7C10.6901 22.51 8.87006 21.6 8.87006 19.98V14.63C8.87006 13.92 8.47006 13.01 8.06006 12.51L4.22003 8.47C3.71003 7.96 3.31006 7.06001 3.31006 6.45001V4.13C3.31006 2.92 4.22008 2.01001 5.33008 2.01001H18.67C19.78 2.01001 20.6901 2.92 20.6901 4.03V6.25C20.6901 7.06 20.1801 8.07001 19.6801 8.57001" stroke="currentColor" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M16.0701 16.5201C17.8374 16.5201 19.2701 15.0874 19.2701 13.3201C19.2701 11.5528 17.8374 10.1201 16.0701 10.1201C14.3028 10.1201 12.8701 11.5528 12.8701 13.3201C12.8701 15.0874 14.3028 16.5201 16.0701 16.5201Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M19.8701 17.1201L18.8701 16.1201" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</svg>


 Фильтры</div>
 <div class="market_category_search">
<form method="POST" id="productSearch" enctype="multipart/form-data">
@csrf
<input type="hidden" name="category_id" value="{{ $category->id }}">
<div class="modal_searchgroup">
	<input type="text" class="form-control" id="productSearchText" name="text" placeholder="Найти товары..">
		<button type="button" id="btn_search" class="btn-input-right_icon"><svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-search"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg></button>		
	</div>	
</form>

</div>

</div>
</div>
<div class="market-breadCrumbs">
<a class="market-breadCrumbs-item" href="/market">Категории
			<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M8.90991 19.92L15.4299 13.4C16.1999 12.63 16.1999 11.37 15.4299 10.6L8.90991 4.07996" stroke="currentColor" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
			</svg>
</a>
		@php $last = $breadCrumbs[count($breadCrumbs) - 1]; @endphp
		@foreach($breadCrumbs as $breadCrumb)
		<a class="market-breadCrumbs-item" href="/market/category/{{ $breadCrumb->id }}">{{ $breadCrumb->name }}
		@if($breadCrumb->id != $last->id)
			<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
				<path d="M8.90991 19.92L15.4299 13.4C16.1999 12.63 16.1999 11.37 15.4299 10.6L8.90991 4.07996" stroke="currentColor" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/>
			</svg>
		@endif
		</a>
		@endforeach
</div>

<div class="catalogs-list">
	@include('includes/market/products', ['category' => $category, 'products' => $products])
</div>
<div class="nextPage_btn" data-page="1" onclick="nextPage();">Показать ещё</div>
@endsection
@section('content-right')	
 {{-- <div class="catalogs-list_subcats">
	<a href="/market/category/{{ $category->id }}" class="catalogs-list_subcats_item active">Все товары</a>
	@if (isset($category->categories))
		@foreach($category->categories as $cat)
			<a href="/market/category/{{ $cat->id }}" class="catalogs-list_subcats_item">{{ $cat->name }}</a>
		@endforeach
	@endif
</div>
	<div class="market_filter">
		<div class="market_filter_productCount"> </div>
	</div>  --}}
@endsection
@section('vendor-script')

@endsection
@section('page-script')
<script src="/js/scripts/market.js"></script>
<script>

$(document).mouseup( function(e){
		var rightblock = $( ".market_right_category" );
		if ( !rightblock.is(e.target)
		    && rightblock.has(e.target).length === 0 ) {
				$('.market_right_category').removeClass('open');
		}
});
$(document).on('keyup', function(e) {
	if ( e.key == "Escape" ) {
		$('.market_right_category').removeClass('open');
	}
});

$('.market-product_filter_item').on('click', function() {
	$(this).toggleClass('is-active');
	var id =  $(this).data('id');
	var param = 'category[]='+id;
	if($(this).hasClass('is-active')){
		selectFilter(param, 'add');
	}else{
		selectFilter(param, 'remove');
	}

});

$('#marketOpenFilter').on('click', function() {
	$('.market_right_category').toggleClass('open');
});
function selectFilter(param, has){
	var url = window.location.pathname + window.location.search;
	if(has == 'add'){
if(typeof(window.location.search) == 'undefined' || window.location.search == ''){
	newURL = url + '?' + param;
}else{
	newURL = url + '&' + param;
}
}else{
	var newURL = url.replace('&' + param, '');
	var newURL = newURL.replace(param + '&', '');
	var newURL = newURL.replace('?' + param, '');
}

history.pushState(null, null, newURL);

console.log(newURL);
	$.ajax({
        url: newURL,
			  type: "GET",
		 headers: { 'X-CSRF-Token': $('meta[name="csrf-token"]').attr('content') },
			  data: {},
			  dataType: "text",
			  cache: false,
		success:function(response){
			$('.catalogs-list').html(response);
		},
		error: function(response) {
		  if(typeof(response.data) != 'undefined') {
				 toastr.error(response.data);
			}else{
				jQuery.each(response.responseJSON.errors, function(key, value){
								toastr.error(value);
							});
			}
		} 
   });
}
</script>
@endsection