{% block page %}
<section class="section news{{ data.store_enabled ? ' has-store' }}" id="news{{ page.sub_group ? '_sub_' ~ page.sub_group }}">
	<h1>{{ page.name }}</h1>
	{% block title %}
		<h2 class="header-text">{{ page.name }}</h2>
		<h3 class="text-center">{{ page.desc }}</h3>
	{% endblock %}
	
	{% if page.filter %}
		{% block filter %}
		<div class="content">
			{# include 'pages/news_filter.twig' #}
			
			<script>
				(function($){
					
					$(function(){
						
						{# http://vestride.github.io/Shuffle/ #}
						var $news=$('#news{{ page.sub_group ? '_sub_' ~ page.sub_group}} .content + .content');
						
						$news.shuffle({
							itemSelector: 'article'
						});
						
						$('#store_shuffle_{{ page.sub_group }},#store_shuffle_cat_{{ page.sub_group }} input').on('keyup change',function(){
							var v=document.getElementById('store_shuffle_{{ page.sub_group }}').value.toLowerCase(),
								c=$('#store_shuffle_cat_{{ page.sub_group }} input:checked').val();
							$news.shuffle('shuffle',function($item,i){
								return (!c||this.getAttribute('data-cat')==c)&&(!v||$item.find('h1').text().toLowerCase().indexOf(v)!=-1);
							});
						});
						
					});
					
				})(jQuery);
				</script>
				<div class="shuffle_filter">
					<input type="text" id="store_shuffle_{{ page.sub_group }}" placeholder="{{ out.store.search }}">
					{% if data.categories %}
						<ul id="store_shuffle_cat_{{ page.sub_group }}">
							<li>
								<input type="radio" id="store_shuffle_cat_{{ page.sub_group }}_0" name="store_shuffle_cat_{{ page.sub_group }}" checked="checked" value="">
								<label for="store_shuffle_cat_{{ page.sub_group }}_0" class="submit-btn">{{ out.store.all }}</label>&nbsp;
							</li>
							{% for category in data.categories %}
								<li>
									{% block filter_category %}
										<input type="radio" id="store_shuffle_cat_{{ page.sub_group }}_{{ category.id_category }}" name="store_shuffle_cat_{{ page.sub_group }}" value="{{ category.id_category }}">
										&nbsp;<label for="store_shuffle_cat_{{ page.sub_group }}_{{ category.id_category }}" class="submit-btn">{{ category.desc }}</label>
									{% endblock %}
								</li>
							{% endfor %}
							<li class="clearfix"></li>
						</ul>
					{% endif %}
					
					<div class="clearfix"></div>
				</div>
			
		</div>
		{% endblock %}
	{% endif %}
	
	{% block content %}
		<div class="content">
			{# include 'pages/news_articles.twig' #}
			
			{% for news in data.news %}
				{% set title = (site.show_news_categories and news.category ? news.category ~ ' - ') ~ news.title %}
				
				{% set has_content = news.title_text1 or news.title_text2 or news.title_text3 or (news.text1 and news.text1 != '<br>') or (news.text2 and news.text2 != '<br>') or (news.text3 and news.text3 != '<br>') %}
				
				{% block article %}
					<article id="news_{{ news.id_n }}" class="col-md-{{ cols }} col-sm-6 col-xs-12" data-cat="{{ news.id_news_categories }}">
						<h1>{{ title | raw }}</h1>
						
						{% block article_header %}
							<div class="article-image">
								{% if news.youtube %}
									{% block article_header_youtube %}
										<div class="embeddedvideo" style="background:url('{{ constant('ROOT_URL_SCHEME') }}://img.youtube.com/vi/{{ news.youtube }}/0.jpg');background-size:cover;background-position:center center;">
											<img src="{{ youtube_src }}" data-id="{{ news.youtube }}" class="youtube_video" style="background:url('/images/youtube-play.png') no-repeat center;" alt="{{ news.title }}"/>
										</div>
									{% endblock %}
								{% else %}
									{% block article_header_image %}
										{% if page.full_page %}
											<a href="/{{ constant('SITE_LANG') }}/news/{{ news.id_n }}/{{ (category|raw ~ news.title|raw) }}.html" target="_self">
										{% else %}
											<a href="{{data.store_enabled ? '/store' }}/get/{{ news.id_n }}.html?lightbox%5Bwidth%5D=640&amp;lightbox%5Bheight%5D=75p" rel="nofollow">
										{% endif %}
											<img src="{{ news.src_thumb }}" alt="{{ news.title }}"/>
										</a>
									{% endblock %}
								{% endif %}
							</div>
						{% endblock %}
						
						{% block article_title %}
							<h2>{{ title | raw }}</h2>
							<h3 class="calendar"><i class="fa fa-calendar la-lg"></i> <time datetime="{{ news.html5_date }}">{{ news.date }}</time></h3>
							{% block _ext_store_news_articles_price %}{% endblock %}
						{% endblock %}
						
						{% block article_contents %}
							{% if news.html and news.html != '<br>' and news.html != '<p>&nbsp;</p>' %}
								{% block article_content %}
									{{ ('<p>' ~ news.html ~ '</p>') | preg_replace(cleaner.p.regex, cleaner.p.replace) | raw }}
								{% endblock %}
							{% endif %}
							
							{% for doc in news.doc_list %}
								{% block article_doc %}
									<a href="/{{ doc.src }}" target="_blank" class="button" rel="nofollow">
										<i class="fa fa-file-pdf-o"></i>&nbsp;{{ doc.title }}
									</a>&nbsp;
								{% endblock %}
							{% endfor %}
							
							{% if news.url %}
								{% block article_read_more %}
									<a href="{{ news.url }}" target="_blank" class="button" rel="nofollow"><i class="fa fa-link"></i> {{ out.read_more }}</a>
								{% endblock %}
							{% endif %}
						
						{% endblock %}
						
						
						{% block article_hidden_section %}
							<section>
								<h1>{{ title | raw }}</h1>
								<h2>{{ title | raw }}</h2>
								
								{% if (news.n_images > 1) and site.lightbox_news_thumbs %}
									{% block article_hidden_slideshow %}
									<div>
										<div>
											<img src="/{{ news.src_thumb }}" class="img-responsive" style="width:128px;border:3px solid #FFF">
										</div>
									</div>
									{% endblock %}
								{% endif %}
								
								{% if has_content %}
									<article class="col-md-4 col-sm-6 col-xs-12">
										<h1>{{ news.title_text1 }}</h1>
										<h2>{{ news.title_text1 }}</h2>
										<p>{{ news.text1 | raw }}</p>
									</article>
									<article class="col-md-4 col-sm-6 col-xs-12">
										<h1>{{ news.title_text2 }}</h1>
										<h2>{{ news.title_text2 }}</h2>
										<p>{{ news.text2 | raw }}</p>
									</article>
									<article class="col-md-4 col-sm-6 col-xs-12">
										<h1>{{ news.title_text3 }}</h1>
										<h2>{{ news.title_text3 }}</h2>
										<p>{{ news.text3 | raw }}</p>
									</article>
									<div class="clearfix"></div>
								{% endif %}
							</section>
						{% endblock article_hidden_section %}
						
						<div class="clearfix"></div>
					</article>
				{% endblock article %}
				
				{% if not loop.last %}
					{{ fn_clearfix(index=loop.index, columns=page.columns) | raw }}
				{% endif %}
			{% endfor %}
			
			<div class="clearfix"></div>
		</div>
	{% endblock content %}
</section>
{% endblock page %}