<f:layout name="Default" />

{namespace sg=SGalinski\SgNews\ViewHelpers}

<f:section name="main">
	<div id="tx-sgnews-newslist">
		<f:render partial="Filter" arguments="{tagTabs: tagTabs, categoryTabs: categoryTabs, categories: categories,
				tags: tags, selectedTag: selectedTag, selectedCategory: selectedCategory}" />
	</div>
	<br />
	<div class="tx-sgnews-categories">
		<ul class="nav nav-tabs">
			<li class="tx-sgnews-category active">
				<a data-toggle="tab" href="#sgnewsTab0">
					<f:translate key="frontend.overview.allTabLabel" />
				</a>
			</li>
			<f:for each="{newsItems}" as="dataItems">
				<li class="tx-sgnews-category">
					<a data-toggle="tab" href="#sgnewsTab{dataItems.record.uid}">
						<f:if condition="{dataItems.recordType} == 'category'">
							<f:then>
								{dataItems.record.subtitleWithFallbackToTitle}
							</f:then>
							<f:else>
								{dataItems.record.title}
							</f:else>
						</f:if>
					</a>
				</li>
			</f:for>
		</ul>

		<div class="tab-content">
			<div class="tab-pane active" id="sgnewsTab0">
				<h4 class="tx-sgnews-tab-title"><f:translate key="frontend.overview.allTabLabel" /></h4>
				<ul class="tx-sgnews-list tx-sgnews-list-0 row" data-record="0">
					<f:for each="{allNews}" as="newsMetaDataEntry">
						<li class="col-md-4 col-sm-6 col-xs-12">
							<f:render partial="Teaser" arguments="{
								newsMetaData: newsMetaDataEntry,
								headerTag: '<h2>',
								closingHeaderTag: '</h2>',
								showCategory: '{f:if(condition: \'{groupBy} == \" category\"\', then: 0, else: 1)}'
							}" />
						</li>
					</f:for>
				</ul>
			</div>
			<f:for each="{newsItems}" as="dataItems">
				<div class="tab-pane" id="sgnewsTab{dataItems.record.uid}">
					<f:if condition="{dataItems.newsCount} == 0">
						<p>
							<f:translate key="frontend.filter.no_result" />
						</p>
					</f:if>
					<h4 class="tx-sgnews-tab-title">{dataItems.record.title}</h4>
					<ul class="tx-sgnews-list tx-sgnews-list-{dataItems.record.uid} row" data-record="{dataItems.record.uid}">
						<f:for each="{dataItems.newsMetaData}" as="newsMetaDataEntry">
							<f:if condition="{newsMetaDataEntry.news}">
								<li class="col-md-4 col-sm-6 col-xs-12">
										<f:render partial="Teaser" arguments="{
											newsMetaData: newsMetaDataEntry,
											headerTag: '<h2>',
											closingHeaderTag: '</h2>',
											showCategory: '{f:if(condition: \'{groupBy} == \" category\"\', then: 0, else: 1)}'
									}" />
								</li>
							</f:if>
						</f:for>
					</ul>

					<f:if condition="{dataItems.recordType} == 'category'">
						<div class="text-center">
							<a class="btn btn-md btn-success category-{dataItems.recordId}" href="{f:uri.page(pageUid: '{dataItems.recordId}')}">
								<f:translate key="frontend.overview.showAllEntries" />
							</a>
						</div>
					</f:if>
				</div>
			</f:for>
		</div>
	</div>
	<sg:pageBrowser numberOfPages="{numberOfPages}" />
</f:section>