{% extends 'base/structure.html.twig' %}

{% block body %}
{% if not app.request.get('fb') is defined or not app.request.get('fb') %}
<script>
	googletag.cmd.push(function () {
		googletag
			.defineSlot('/19991396/elfann2-inread', [2, 2], 'div-gpt-ad-news-inread')
			.setTargeting('articleID', '{{ news.id }}')
			.setTargeting('page', 'news')
			.setTargeting('section', 'middle_of_article')
			.setTargeting('disableadx', {{ disableAdx|default(0) }})
		.addService(googletag.pubads());
	googletag.pubads().enableSingleRequest();
	googletag.enableServices();
			});
</script>
{% endif %}
<div class="news_body" itemscope itemtype="http://schema.org/NewsArticle">
{% include 'news/newsItemProp.html.twig' %}
	<input id="newsId" type="hidden" value="{{ news.id }}">
<script>
	var script = document.createElement('script');
	script.src = "https://www.elfann.com/newsHits?id=" + document.getElementById('newsId').value + "&v=" + Math.floor(Math.random() * 10000);
	script.async = "true";
	window.document.getElementsByTagName("head")[0].appendChild(script);
</script>

<div class="top ltr" id="topsection" data-id="{{unreadnewsid}}" data-title="{{title}}" data-slug="{{slug}}" data-noajax="{{noajax}}" data-mainId="{{mainid}}" data-mainslug="{{mainslug}}" data-maintitle="{{maintitle}}">
	<div class="container-xl">
		<div class="row">
			<div class="col-12">
				{% if news is defined %}
				<div class="authorname" itemprop="author" itemscope itemtype="http://schema.org/Person">
						{% if news.author %}
							<a itemprop="url" href="{{ authorInfo.getUrl() }}">
							<span itemprop="name">
						{{ news.author }}
						</span>
						</a>

						&nbsp;-&nbsp;
						{% else %}
						<span itemprop="name" hidden>{{ news.categoryName }}</span>
						<span itemprop="url" hidden>{{ news.getUrl() }}</span>

						{% endif %}
					

					{{ news.categoryName }}
				</div>

				<h1 class="title">
					{% if authorInfo is defined and authorInfo.picture != null %}
					<a href="{{ authorInfo.getUrl() }}" ><img src="{{ authorInfo.getAuthorPicture() }}" alt=""></a>
					{% endif %}
					<span itemprop="headline">{{ news.title }}</span>

				</h1>
				<div class="min_row">
					<p></p>
				</div>
				<div class="date">
					<b>{{ news.getStringDate() }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{ news.timestamp|date('H:i')
						}}</b>
				</div>
				{% endif %}
			</div>
		</div>
	</div>
	{% if app.request.get('webview')!=2 and app.request.get('webview')!=1 %}
	<span class="hide_social" id="hide_social"><i class="fas fa-share-alt"></i></span>
	{% endif %}
</div>

<div class="home ltr">
	<div class="container-xl">
		<div class="row">
			<div class="col-lg-8 col-xl-9 news_container">
				<div class="row" id="rightcolumn">
					<div class="col-lg-1 order-lg-1 social-bar">
						<div class="img" data-url="{{ newsUrlWithUtm }}" data-twitterurl="{{ newsTwitterUrl }}"
							data-fburl="{{ newsUrl }}" data-title="{{ news.title|raw }}" data-email="0" data-wa="0"
							id="socialbars">
							<ul class="socials">
								{% set waText = news.url()|replace({'&quot;': ''}) %}
								<a href="https://web.whatsapp.com/send?text={{ waText }}"
									onclick="gtag('event', 'Social Button', {'event_category': 'News Page', 'event_label': 'WhatsApp'});"
									rel="nofollow" data-href="{{ 'whatsapp://send?text=' ~ waText|url_encode }}"
									data-text="{{ waText }}" target="_blank" data-id="{{ news.id }}"
									class="desktopsocial">
									<span class="wacounter sm-counter">
										{% if news.whatsappShares %}
										{{ news.whatsappShares }}
										{% endif %}
									</span>
									<img src="{{ asset('build/images/whatsapp.png') }}"></a>
								<a href="whatsapp://send?text={{ waText }}"
									onclick="gtag('event', 'Social Button', {'event_category': 'News Page', 'event_label': 'WhatsApp'});"
									rel="nofollow" data-href="{{ 'whatsapp://send?text=' ~ waText|url_encode }}"
									data-text="{{ waText }}" target="_blank" data-id="{{ news.id }}"
									class="mobilesocial">
									<span class="wacounter sm-counter">
										{% if news.whatsappShares %}
										{{ news.whatsappShares }}
										{% endif %}
									</span>
									<img src="{{ asset('build/images/whatsapp.png') }}"></a>
								<a href="https://twitter.com/intent/tweet?url={{ newsTwitterUrl }}/{{ news.title }}"
									rel="nofollow" target="_blank"
									onclick="gtag('event', 'Social Button', {'event_category': 'News Page', 'event_label': 'Twitter'});">
									<span class="countertwitter sm-counter">
										{% if news.tweets %}
										{{ news.tweets }}
										{% endif %}
									</span>
									<img src="{{ asset('build/images/twitter.webp') }}"></a>
								<a href="https://www.facebook.com/sharer/sharer.php?u={{ newsUrl }}" target="_blank"
									rel="nofollow"
									onclick="gtag('event', 'Social Button', {'event_category': 'News Page', 'event_label': 'Facebook'});">
									<span class="counterfacebook sm-counter">
										{% if news.facebook %}
										{{ news.facebook }}
										{% endif %}
									</span>
									<img src="{{ asset('build/images/facebook.jpg') }}"></a>
								{# <a href="mailto:?&subject=The%20subject%20of%20the%20email&body=The%20body%20of%20the%20email"
									rel="nofollow" title="Share by Email">
									<span class="emailcounter sm-counter">
										{% if news.emailShares %}
										{{ news.emailShares }}
										{% endif %}
									</span>
									<img src="{{ asset('build/images/email_logo.jpg') }}">
								</a> #}
							</ul>
						</div>
					</div>
					<div class="col-lg-11 inside">
						{% if news is defined %}
						<span class="" data-href="{{ news.getBasePicture()|files('728_400') }}">
							<img class="imgnews" src="{{ news.getBasePicture()|files('728_400') }}" itemprop="image" itemtype="http://schema.org/ImageObject">
							<span itemprop="url" hidden>src="{{ news.getBasePicture()|files('728_400') }}"</span>
							<span itemprop="width" content="728"></span>
							<span itemprop="height" content="400"></span>
						</span>
						{{ ads is not null ? ads.printAd('desktop', 'under_image',1)|raw : '' }}
						<div class="d-md-none ad-inside">
							{{ ads is not null ? ads.printAd('mobile', 'under_image_static',1)|raw : '' }}
						</div>
						<div class="subtext3">
							<div class="articleBody">
								{% if readMoreNews is defined %}
								{{ bodyChunks|raw }}
								{% endif %}
							</div>
						</div>
						{% include "news/newsAlbum.html.twig" %}
						<div class="btn body_tags" id="like">
							{% for tag in tags %}
							<a class="btn1 d-flex flex-wrap" href="{{ tag.url() }}">{{
								tag.tag }}</a>
							{% endfor %}
						</div>
						{% endif %}
						{# <div class="d-md-block"> #}
							<div class="adds-img ltr add d-md-none">
								{{ ads is not null ? ads.printAd('mobile', 'newsfeed_top',1)|raw : '' }}
							</div>
							<div class="row ">
								<div class="col-lg-12 txt">
									إقرأ أيضاً</div>
							</div>
							<div class="row margin-30">
								{% for news in relatedNews %}
								{% if loop.index < 4 %} <div class="col-lg-4 col-12 display">

									<a class="newsimg more-news" title="{{ news.title }}" {% if news.getUrl() is defined
										%} href="{{ news.getUrl() }}"
										 {% endif %} category="{{ news.categoryName }}">
										<div class="overflow">
											<div class="scale">
												<img src="{{ news.getNewsFeedPicture() }}">
											</div>
										</div>
										<div>
											<div class="title">{{ news.categoryName }}</div>
											<div class="txtNews">{{ news.title }}</div>
										</div>
										
									</a>
									

							</div>
							{% if loop.index == 3 %}
								{% set index = loop.index %}
							{{ ads is not null ? ads.printAd('desktop', 'newsfeed',1)|raw : '' }}
							<div class="d-md-none">
								{{ ads is not null ? ads.printAd('mobile', 'newsfeed-mobile',1)|raw : '' }}
							</div>
							{% endif %}
							{% endif %}
							{% endfor %}
						</div>
					{# </div> #}
					<div id="load"></div>
				</div>
			</div>
		</div>
		<div class="col-lg-4 col-xl-3 order-lg-first block-1">
			<div id="leftcolumn">
				<div class="topNews">
					{# {% if relatedNews is not empty %}
					<ul class="order-md-first relatedNews">
						<li>
							<h2>أخبار مرتبطة</h2>
						</li>
						{% for news in relatedNews %}
						<li>
							<a class=" txt_cont" title="{{ news.title }}" href="{{ news.getUrl() }}"
								category="{{ news.categoryName }}">
								<img class="lastNews_Img" src="{{ news.getPictureUrl('120_71') }}">
								<div class="text">
									<span>
										{{ news.categoryName }}</span>
									{{ news.title }}
								</div>
							</a>
						</li>
						{% endfor %}
					</ul>
					{% endif %}
					<div class="small-ads insides">
						<div class="d-md-block">
						{{ ads is not null ? ads.printAd('desktop', 'left_top',1)|raw : '' }}
						</div>
						<div class="d-md-none">
							{{ ads is not null ? ads.printAd('mobile', 'newsfeed-mobile',1)|raw : '' }}
						</div>
					</div> #}
					<div class="orderMobile latestNews">
						{{ render(controller('App\\Controller\\DefaultController::indexAction')) }}


					<div class="small-ads insides">
						{{ ads is not null ? ads.printAd('desktop', 'left_bottom',1)|raw : '' }}
						<div class="d-md-none">
							{{ ads is not null ? ads.printAd('mobile', 'newsfeed-mobile',1)|raw : '' }}
						</div>
					</div>

					<div class="row row-padd">

						<div class="box-inline">
							<div class="box-2 mostread" id="boxmost">
								<span class="txt-right mo">{{ '_MOST_READ_'|trans }}</span>
							</div>
							<div class="box-3" id="boxun">
								<span class="txt-right un">{{ '_UNREAD_NEWS_'|trans }}</span>
							</div>
						</div>
						<!-- Unread News -->
						{{ render(controller('App\\Controller\\DefaultController::unreadNews')) }}
						<!-- Most Read -->
						{{ render(controller('App\\Controller\\NewsController::mostRead')) }}

						

					</div>
					<div class="small-ads insides">
						<div class="d-md-block">
						{{ ads is not null ? ads.printAd('desktop', 'left_top',1)|raw : '' }}
						</div>
						<div class="d-md-none">
							{{ ads is not null ? ads.printAd('mobile', 'newsfeed-mobile',1)|raw : '' }}
						</div>
					</div> 
					</div>

				</div>
			</div>
		</div>
	</div>
</div>
</div>

{% endblock %}