@extends('mobile.layouts.mobile-app')

@section('title', $searchedWord.' | Sport 1')

@section('banner_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/m_box_2', [[320, 50], [320, 100], [300, 250], [300, 300], [300, 600]], 'div-gpt-ad-1580393771950-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": "{{ $searchedWord }}",
			    "item": "{{ url('/').'/search/?word='.$searchedWord }}"
			  }]
        }
 	</script>
@endsection
@section('content')
	<div class="global-wrap">
		@include('mobile.layouts._breadcrumb',['pageName'=> $searchedWord])
		<div class="widget widget-tabs-lined widget-tabs-lined-mobile">
			<div class="search-players">
						
			</div>
			<div class="box-generic-mobile">
					@if(empty($articles) == false)
					<div class="widget widget-news-grid widget-news-grid-horizontal-mobile">
						@if(count($articles) > 0)
							@foreach($articles as $art)
							<a href="{{ url('article/'.$art['id']) }}" title="{{ $art['title'] }}" class="item grid">
								<div class="photo col-1-2">
									@if(isset($art['imgPaths']['data']['urls']['uploaded']['original']))
					                    <img class="lazyload" data-src="{{ $art['imgPaths']['data']['urls']['uploaded']['original'] }}" alt="{{ $art['title'] }}">
					                @elseif(isset($art['imgPaths']['data']['urls']['16x9']['770_433']))
					                    <img class="lazyload" data-src="{{ $art['imgPaths']['data']['urls']['16x9']['770_433'] }}" alt="{{ $art['title'] }}">
					                @else
					                    <img class="lazyload" data-src="../resources/image/temp/image_placeholder.png" alt="{{ $art['title'] }}">
					                @endif
								</div>
								<div class="col-1-2">
									<h2 class="title heading-xxs">{{ $art['title'] }}</h2>
									@if(isset($art['updated']))
					                    <em class="time time-custom time-updated">
					                        @include('layouts.logos.icons.updated',['width'=>'13px','height'=>'13px','fill'=>'gray'])
					                         {{ date('d F Y',strtotime(substr($art['updated'],0, strpos($art['updated'],' ')))).' | '.substr($art['updated'],-8,-3) }}
					                    </em>
					                @else
					                    <em class="time time-custom">
					                        {{ date('d F Y',strtotime(substr($art['fromDate'],0, strpos($art['fromDate'],' ')))).' | '.substr($art['fromDate'],-8,-3) }}
					                    </em>
					                @endif
									{{-- <p>{!! mb_substr(strip_tags($art['content'],"<p>,</br>"),0,100).'...</p>' !!}</p> --}}
								</div>
							</a>
							@endforeach
						</div> <!-- widget -->

						@endif
					 	@else
					 		<header class="widget widget-heading-small mt-3">
								<h2 class="title heading-md">
									Няма намерени резултати за <span style="font-style:italic; font-weight: 900;">{{ $searchedWord }}</span>
								</h2>
							</header>
					 	@endif
			</div> <!-- box -->
			{{-- <a href="" title="" class="widget widget-view-more-load">
				<i class="icon icon-more-down"></i>
			</a> --}}
		</div> <!-- tabs -->
		<div class="banner-s">
			{{-- @include('layouts.side-bar-components._vertical-banner',
			['bannerURL'=>'../resources/image/temp/banner-300-2.jpg']) --}}
			<!-- /26641721/sport1.bg/m_box_2 -->
<div id='div-gpt-ad-1580393771950-0' class="widget widget-banner">
  <script>
    googletag.cmd.push(function() { googletag.display('div-gpt-ad-1580393771950-0'); });
  </script>
</div>

		</div>
	</div>
@endsection

@push('scripts-mobile')
<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 = $('.search-players');
				console.log(data);
				for(temp in data){
					image = './resources/image/temp/player_icon.png';
					console.log('image');
					console.log(image);
					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 = 'Вратар';
					}
					console.log('result');
					console.log(typeof(data[temp].url_thumb) !== undefined);
					if(data[temp].hasOwnProperty('url_thumb')){
						image = data[temp].url_thumb;
					}else if(data[temp].hasOwnProperty('url_image')){
						image = data[temp].url_image;
					}
					console.log(image);
					dummy = `<div class="box-generic-mobile"><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 href="./player/${data[temp].id}" title="${data[temp].name}" class="widget widget-view-more">
									<span class="label">Виж повече</span>
									<i class="icon icon-view-more"></i>
								</em>
							</div>
						</div> <!-- grid -->
					</a></div>`;
					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