@extends('adminlte::page')
@section('title', $pageTitle)
@section('content_header')
	<h1>{{ $pageTitle }}</h1>
@stop
@section('content')
	@include('advancedsearch.analytics.tabs')
	@include('advancedsearch.analytics.selectfilter')
	@if($clicks->count())
		<table class="table table-striped text-center">
			<tr>
				<td colspan="2">Top Click Products for Today</td>
			</tr>
			<tr>
				<td>
					Total Products Clicked:
					<h4>{{$totalProducts}}</h4>
				</td>
				<td>
					Total Clicks:
					<h4>{{$totalClicks}}</h4>
				</td>
			</tr>
		</table>
		<div class="row">
			<div class="col-sm-3">
				Top {{$totalProducts}} Clicked Products
				<table class="table table-striped">
					<tr>
						<th>SKU</th>
						<th># of Clicks</th>
					</tr>
					@foreach($clicks as $click)
						<tr>
							<td>{{$click->productId}}</td>
							<td class="text-center">{{$click->clicks}}</td>
						</tr>
					@endforeach
				</table>
			</div>
			<div class="col-sm-9">
				@foreach($clicks->chunk(4) as $chunk)
					<div class="row">
						@foreach($chunk as $cell)
							<div class="col-sm-4">
								<div class="clickcell">
									<span>{{$cell->clicks}}</span>
									<img src="{{$cell->product->imageUrl}}" alt="{{$cell->product->name}}">
									<div class="name">{!!$cell->product->name!!}</div>
									<div class="id">ID: {{$cell->product->yid}}</div>
									<div class="searches">
										<strong>Clicks by search</strong>
										@foreach($cell->searches as $search => $count)
											<div class="row">
												<div class="col-xs-9">
													@if($search === "NULL")
														Empty Search
													@else
														{{$search}}
													@endif
												</div>
												<div class="col-xs-3 text-right">
													{{$count}}
												</div>
											</div>
										@endforeach
									</div>
								</div>
							</div>
						@endforeach
					</div>
				@endforeach
			</div>
		</div>
	@else
		<div class="text-center"><h3>Sorry, you do not have any matching analytics from that time frame.</h3></div>
	@endif
@stop