{namespace events=GeorgRinger\Eventnews\ViewHelpers}
{namespace n=GeorgRinger\News\ViewHelpers}
<f:layout name="General" />

<f:section name="content">
	<div class="row">
		
		<div class="col-md-12">
						<events:calendar newsList="{newsWithNoDaySupport}" demand="{demand}" firstDayOfWeek="1">
				<table class="table">
					<tr class="title">
						<th colspan="7">
							<ul class="pager">
								<li class="previous">
									<f:link.page rel="nofollow" pageUid="{currentPageId}" additionalParams="{tx_news_pi1:{overwriteDemand:{month:previousMonthData.month,year:previousMonthData.year}}}">
										&larr; 
									</f:link.page>
								</li>
								<li>{f:format.date(date:currentMonthData.date,format:'%B %Y')}</li>
								<li class="next">
									<f:link.page rel="nofollow" pageUid="{currentPageId}" additionalParams="{tx_news_pi1:{overwriteDemand:{month:nextMonthData.month,year:nextMonthData.year}}}">
										 &rarr;
									</f:link.page>
								</li>
							</ul>
						</th>
					</tr>
					<tr class="days">
						<f:for each="{weeks.0}" as="day">
							<th>
								{f:format.date(date: day.ts, format: '%a')}
							</th>
						</f:for>
					</tr>
					<f:for each="{weeks}" as="week">
						<tr>
							<f:for each="{week}" as="day">
								<f:render section="calday" arguments="{day:day, settings:settings}" />
							</f:for>
						</tr>
					</f:for>
				</table>
			</events:calendar>
		</div>
		
	</div>
</f:section>

<f:section name="listItem">
	<div class="col-md-12" style="border: 1px solid #ccc;">
		<strong>
			<n:link newsItem="{n}" settings="{settings}">{n.title}</n:link>
			| {f:format.date(date:n.datetime.date,format:'%d.%m')}</strong>
		<ul>
			<f:if condition="{n.organizer}">
				<li><strong>
					<f:translate key="organizer" extensionName="eventnews" />
				</strong>: {n.organizer.title}
					<small>(uid: {n.organizer.uid})</small>
				</li>
			</f:if>
			<f:if condition="{n.location}">
				<li><strong>
					<f:translate key="location" extensionName="eventnews" />
				</strong>: {n.location.title}
					<small>(uid: {n.location.uid})</small>
				</li>
			</f:if>
			<f:if condition="{n.eventEnd}">
				<li>
					<strong>
						<f:translate key="event_end" extensionName="eventnews" />
					</strong>: {f:format.date(date:n.eventEnd.date,format:'%d.%m.%Y')}
				</li>
			</f:if>
		</ul>
	</div>
</f:section>


<f:section name="calday">
	<td class="day{f:format.date(date: day.ts, format: 'N')} {f:if(condition: day.curmonth, then: 'curmonth', else: 'othermonth')}{f:if(condition: day.news, then: ' hasevents')}{f:if(condition: day.curday, then: ' today')}">
		<f:if condition="{day.dayBelongsToCurrentMonth}">
			<f:if condition="{day.news}">
				<f:then>
					<strong>
						<a href="#" data-toggle="modal" data-target="#exampleModal{day.day}">{day.day}</a>
					</strong>
<div class="modal fade" id="exampleModal{day.day}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        
        
        {f:format.date(date: day.ts, format: '%d %B %Y')}
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <f:for each="{day.news}" as="newsItem">
						<div style="border-bottom: 1px solid #ccc;margin:2px;padding:2px">
							
                          <n:link newsItem="{newsItem}" settings="{settings}">{newsItem.title}</n:link>
						</div>
					</f:for>
      </div>
    </div>
  </div>
</div>
				</f:then>
				<f:else>
					{day.day}
				</f:else>
			</f:if>
		</f:if>
	</td>
</f:section>