@extends('layouts.app')
@if($articles != '')
	@section('title',"Резултати за ".$searchedWord." | Sport 1")
@else
	@section('title',"Търсене | Sport 1")
@endif

@section('banners_data')
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
<script>
  window.googletag = window.googletag || {cmd: []};
  googletag.cmd.push(function() {
    googletag.defineSlot('/26641721/sport1.bg/d_horizontal_2', [[728, 90], [890, 200], [750, 200], [970, 90], [970, 250]], 'div-gpt-ad-1580308327344-0').addService(googletag.pubads());
    googletag.pubads().enableSingleRequest();
    googletag.pubads().collapseEmptyDivs();
    googletag.enableServices();
  });
</script>

@endsection

@section('structured_data')
	<link rel="canonical" href="{{ url('/').'/search' }}" />
	<script type="application/ld+json">
        {
            "@context": "{{ url('/') }}",
            "@type": "BreadcrumbList",
             "itemListElement": [{
			    "@type": "ListItem",
			    "position": 1,
			    "name": "Търсене",
			    "item": "{{ url('/').'/search' }}"
			  },{
			    "@type": "ListItem",
			    "position": 2,
			    "name": "{{ $searchedWord }}",
			    "item": "{{ url('/').'/search/?word='.$searchedWord }}"
			  }]
        }
 	</script>
@endsection
@section('content')
	@include('layouts._breadcrumb',['pageName'=> ['Търсене','Резултати']])
	<div class="wrap-width">
			<form method="GET" action="{{ route('search.index') }}" class="widget widget-search-form" id="search-form">
				<i class="icon icon-search"></i>
				<input type="text" name="word" class="keywords" value="{{ $searchedWord }}">
				<button type="submit" class="submit btn-generic" aria-label="Търси">Търси</button>
			</form>
			<div class="grid">
				<div class="col-minus-sidebar-1">
					<div class="search-players">
						
					</div>
					@if($articles != ' ')
						@if(count($articles) > 0)
							<header class="widget widget-heading-small">
								<h2 class="title heading-md">
									Резултати
								</h2>
							</header>
						@else
							<header class="widget widget-heading-small">
								<h2 class="title heading-md">
									Последно качени
								</h2>
							</header>
						@endif
						<div class="box-generic">
							<div class="tab-news-search" aria-hidden="false">
								<div class="widget widget-news-grid widget-news-grid-horizontal">
									@if(count($articles) > 0)
										@foreach($articles as $article)
											<a href="{{ url('/article/'.$article['id']) }}" title="{{ $article['title'] }}" class="item grid">
												<div class="photo col-2-5">
													@if(isset($article['imgPaths']['data']['urls']['uploaded']['original']))
									                    <img class="lazyload" data-src="{{ $article['imgPaths']['data']['urls']['uploaded']['original'] }}" alt="{{ $article['title'] }}">
									                @elseif(isset($article['imgPaths']['data']['urls']['16x9']['770_433']))
									                    <img class="lazyload" data-src="{{ $article['imgPaths']['data']['urls']['16x9']['770_433'] }}" alt="{{ $article['title'] }}">
									                @else
									                    <img class="lazyload" data-src="../resources/image/temp/image_placeholder.png" alt="{{ $article['title'] }}">
									                @endif
												</div>
												<div class="col-3-5">
													<h2 class="title heading-sm">{{ $article['title'] }}</h2>
													<em class="time">{{ date('d F Y',strtotime(substr($article['fromDate'],0, strpos($article['fromDate'],' ')))).' | '.substr($article['fromDate'],-8,-3) }}</em>
												</div>
											</a>
										@endforeach
										@if(count($newestArticles) > 0)
													</div>
												</div>
											</div>
											<div class="box-generic">
												<div class="tab-news-search" aria-hidden="false">
													<div class="widget widget-news-grid widget-news-grid-horizontal">
														<header class="widget widget-heading-small">
															<h2 class="title heading-md">
																Последно качени
															</h2>
														</header>
													@foreach($newestArticles as $article)
														<a href="{{ url('/article/'.$article['id']) }}" title="{{ $article['title'] }}" class="item grid">
															<div class="photo col-2-5">
																@if(isset($article['imgPaths']['data']['urls']['uploaded']['original']))
												                    <img class="lazyload" data-src="{{ $article['imgPaths']['data']['urls']['uploaded']['original'] }}" alt="{{ $article['title'] }}">
												                @elseif(isset($article['imgPaths']['data']['urls']['16x9']['770_433']))
												                    <img class="lazyload" data-src="{{ $article['imgPaths']['data']['urls']['16x9']['770_433'] }}" alt="{{ $article['title'] }}">
												                @else
												                    <img class="lazyload" data-src="../resources/image/temp/image_placeholder.png" alt="{{ $article['title'] }}">
												                @endif
															</div>
															<div class="col-3-5">
																<h2 class="title heading-sm">{{ $article['title'] }}</h2>
																<em class="time">{{ date('d F Y',strtotime(substr($article['fromDate'],0, strpos($article['fromDate'],' ')))).' | '.substr($article['fromDate'],-8,-3) }}</em>
																
															</div>
														</a>
													@endforeach
										@endif
										{!! $articles->render() !!}
									@else
										@if(count($newestArticles) > 0)
											@foreach($newestArticles as $article)
												<a href="{{ url('/article/'.$article['id']) }}" title="{{ $article['title'] }}" class="item grid">
													<div class="photo col-2-5">
														@if(isset($article['imgPaths']['data']['urls']['uploaded']['original']))
										                    <img class="lazyload" data-src="{{ $article['imgPaths']['data']['urls']['uploaded']['original'] }}" alt="{{ $article['title'] }}">
										                @elseif(isset($article['imgPaths']['data']['urls']['16x9']['770_433']))
										                    <img class="lazyload" data-src="{{ $article['imgPaths']['data']['urls']['16x9']['770_433'] }}" alt="{{ $article['title'] }}">
										                @else
										                    <img class="lazyload" data-src="../resources/image/temp/image_placeholder.png" alt="{{ $article['title'] }}">
										                @endif
													</div>
													<div class="col-3-5">
														<h2 class="title heading-sm">{{ $article['title'] }}</h2>
														<em class="time">{{ date('d F Y',strtotime(substr($article['fromDate'],0, strpos($article['fromDate'],' ')))).' | '.substr($article['fromDate'],-8,-3) }}</em>
														
													</div>
												</a>
											@endforeach
										@endif
									@endif
							</div> <!-- tab -->
						</div> <!-- box -->
						</div> 
				<!-- /26641721/sport1.bg/d_horizontal_2 -->
				<div id='div-gpt-ad-1580308327344-0' class="widget widget-banner">
				  <script>
				    googletag.cmd.push(function() { googletag.display('div-gpt-ad-1580308327344-0'); });
				  </script>
				</div>

			</div> <!-- grid -->
			@include('layouts.sidebars._search-side-bar',['mostViewed'=>$mostViewed])
					@else
						<header class="widget widget-heading-small mt-3">
							<h2 class="title heading-md">
								Няма намерени резултати за {{ $searchedWord }}
							</h2>
						</header>
					</div> 
			@include('layouts.sidebars._search-side-bar',['mostViewed'=>$mostViewed])
			</div> <!-- grid -->
					@endif
			
		</div>
@endsection

@push('scripts')
	<script>
		function getPlayers(name){
		   var api_url = `https://football.api.sportal365.com/players?name=${name}&expand=club%2Ccurrent_league`;
			var key = 'd5cb82a2ee228f92709fb79f3824134a:8e26cc98e71e0b5d731cd14bf7df97c4';
			var headers = {
					method: 'GET',
					mode: 'cors',
					cache: 'no-cache',
					headers: {
			    "Authorization": "Basic " + btoa(key),
			    "X-Project": "sport1.bg",
			    "Accept-Language": "bg",
			   }
			};
			var request = new Request(api_url,headers);
			var currLeague;
			fetch(request)
			.then((resp) => resp.json())
			.then(function(data){
				let dummy;
				let position;
				let image;
				let years;
				let date = new Date();
				let thisYear = date.getFullYear();
				let target = $(".col-minus-sidebar-1").children('.search-players');
				console.log(data);
				for(temp in data){
					image = './resources/image/temp/player_icon.png';
					
					if(typeof data[temp].birthdate !== undefined){
						years = thisYear - data[temp].birthdate.substr(0,4);
					}else{
						years = 'Няма информация';
					}
					if(data[temp].position == 'forward'){
						position = 'Нападател';
					}else if(data[temp].position == 'midfielder'){
						position = 'Халф';
					}else if(data[temp].position == 'defender'){
						position = 'Защитник';
					}else{
						position = 'Вратар';
					}
					if(data[temp].hasOwnProperty('url_thumb')){
						image = data[temp].url_thumb;
					}else if(data[temp].hasOwnProperty('url_image')){
						image = data[temp].url_image;
					}
					dummy = `<a href="./player/${data[temp].id}" title="${data[temp].name}" class="widget widget-player-profile">
						<div class="grid">
							<div class="col-1-4">
								<div class="profile-image">
									<img data-src="${image}" alt="${data[temp].name}" class="photo lazyload">
									<span class="number">X</span>
								</div>
							</div>
	
							<div class="col-3-4">
								<h2 class="profile-name heading-md">${data[temp].name}</h2>
								<h5 class="profile-team"> </h5>
		
								<ul class="profile-properties">
									<li class="entry">
										<span class="label">Националност</span>
										<span class="divider"></span>
										<span class="content">${data[temp].country.name}</span>
									</li>
									<li class="entry">
										<span class="label">Дата на раждане</span>
										<span class="divider"></span>
										<span class="content">${data[temp].birthdate}</span>
									</li>
									<li class="entry">
										<span class="label">Години</span>
										<span class="divider"></span>
										<span class="content">${years}</span>
									</li>
									<li class="entry">
										<span class="label">Височина (cm)</span>
										<span class="divider"></span>
										<span class="content">${data[temp].height}</span>
									</li>
									<li class="entry">
										<span class="label">Тегло (kg)</span>
										<span class="divider"></span>
										<span class="content">${data[temp].weight}</span>
									</li>
									<li class="entry">
										<span class="label">Позиция</span>
										<span class="divider"></span>
										<span class="content">${position}</span>
									</li>
								</ul>
		
								<em class="widget widget-view-more">
									<span class="label">Виж повече</span>
									<i class="icon icon-view-more"></i>
								</em>
							</div>
						</div> <!-- grid -->
					</a>`;
					target.append(dummy);
				}
			}).catch(function(error){
				console.log(error);
			});
		}
		let name = decodeURI(window.location.search.substring(6,window.location.search.length));
		if(name !== ''){
			getPlayers(name);
		}
	</script>
@endpush