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

{% block pageContent %}
<div>
	{% if season.isSingle() %}
		<h1>{{ '_MATCH_SUMMARY_'|trans }} {{ match.playerA.getFullname() }} vs {{ match.playerB.getFullname() }}</h1>
	{% else %}
		<h1>{{ '_MATCH_SUMMARY_'|trans }} {{ match.playerA1.getFullname() }},{{ match.playerA2.getFullname() }} vs {{ match.playerB1.getFullname() }},{{ match.playerA2.getFullname() }}</h1>
	{% endif %}
	<a class="heading matchHeader" href="{{ season.getUrl() }}">
		<span class="label">{{ competition.name }}</span>
		<span class="arrow"><span class="border-right"></span><i class="icon-triangle-left"></i></span>
	</a>
	<div class="match-summary">
		<div class="main-content">
			<div class="head">
				{% if season.isSingle() %}
					<div class="matchTeams">
						<div class="column">
							<a class="team-name" href="{{ match.teamsA.getUrl() }}">{{ match.playerA.getFullname() }}</a>
						</div>
						<div class="column">
							{% if match.isFixture %}
								<span class="matchTime {{ match.status }} score" data-time="{{ match.getMatchTime() }}">{{ match.getMatchTime() }}</span>
							{% else %}
								<span class="matchTime {{ match.status }} score" data-time="{{ match.getMatchTime() }}">{{ match.getTennisRoundScore() }}</span>
							{% endif %}
						</div>
						<div class="column">
							<a class="team-name" href="{{ match.teamsB.getUrl() }}">{{ match.playerB.getFullname() }}</a>
						</div>
					</div>
					<div class="matchInfo">
						<div class="column">
							<img src="https://secure.cache.images.core.optasports.com/tennis/players/150x150/{{ match.playerA.person_id }}.png">
						</div>
						<div class="column mainInfo">
							<ul>
								<li><span class="info">{{ '_DATE_'|trans }}</span><span class="value">{{ match.getMatchDate() }}</span></li>
								<li><span class="info">{{ 'THE_TIME'|trans }}</span><span class="matchTime Fixture value" data-time="{{ match.getMatchTime() }}">{{ match.getMatchTime() }}</span></li>
								<li><span class="info">{{ '_LOCATION_AR_'|trans }}</span><span class="value">			{{ competition.getAreaAr() }}</span></li>
							</ul>
						</div>
						<div class="column">
							<img src="https://secure.cache.images.core.optasports.com/tennis/players/150x150/{{ match.playerB.person_id }}.png">
						</div>
					</div>
				{% else %}
					<div class="matchTeams">
						<div class="column">
							<a class="team-name" href="{{ match.teamsA1.getUrl() }}">{{ match.playerA1.getFullname() }}</a>
							<a class="team-name" href="{{ match.teamsA2.getUrl() }}">{{ match.playerA2.getFullname() }}</a>
						</div>
						<div class="column">
							{% if match.isFixture %}
								<span class="matchTime {{ match.status }} score" data-time="{{ match.getMatchTime() }}">{{ match.getMatchTime() }}</span>
							{% else %}
								<span class="matchTime {{ match.status }} score" data-time="{{ match.getMatchTime() }}">{{ match.getTennisRoundScore() }}</span>
							{% endif %}
						</div>
						<div class="column">
							<a class="team-name" href="{{ match.teamsB1.getUrl() }}">{{ match.playerB1.getFullname() }}</a>
							<a class="team-name" href="{{ match.teamsB2.getUrl() }}">{{ match.playerB2.getFullname() }}</a>
						</div>
					</div>
					<div class="matchInfo">
						<div class="column">
							<img src="https://secure.cache.images.core.optasports.com/tennis/players/150x150/{{ match.playerA.person_id }}.png">
						</div>
						<div class="column mainInfo">
							<ul>
								<li><span class="info">{{ '_DATE_'|trans }}</span><span class="value">{{ match.getMatchDate() }}</span></li>
								<li><span class="info">{{ 'THE_TIME'|trans }}</span><span class="matchTime Fixture value" data-time="{{ match.getMatchTime() }}">{{ match.getMatchTime() }}</span></li>
								<li><span class="info">{{ '_LOCATION_AR_'|trans }}</span><span class="value">			{{ competition.getAreaAr() }}</span></li>
							</ul>
						</div>
						<div class="column">
							<img src="https://secure.cache.images.core.optasports.com/tennis/players/150x150/{{ match.playerB.person_id }}.png">
						</div>
					</div>
				{% endif %}
				{% if match.sets is defined and match.sets %}
					<div class="matchGoals">
						<table class="strippedTable">
							{% for set in match.sets %}
								<tr>
									<td>

									</td>
									<td class="time">
										{{ set.score_a }} - {{ set.score_b }}
									</td>
									<td>

									</td>
								</tr>
							{% endfor %}
						</table>
					</div>
				{% endif %}
			</div>
		</div>
	</div>
	{% if not playerAMatches is empty %}
	<div class="section tableSection">
		<h3>
			{% if season.isSingle() %}
				{{ match.playerA.getFullname() }}
			{% else %}
				{{ match.playerA1.getFullname() }}, {{ match.playerA2.getFullname() }}
			{% endif %}
		</h3>
		<div class="sectionContent">
		{{ playerAMatches|raw }}
		</div>
	</div>
	{% endif %}
	{% if not playerBMatches is empty %}
	<div class="section tableSection">
		<h3>
			{% if season.isSingle() %}
				{{ match.playerB.getFullname() }}
			{% else %}
				{{ match.playerB1.getFullname() }}, {{ match.playerB2.getFullname() }}
			{% endif %}
		</h3>
		<div class="sectionContent">
			{{ playerBMatches|raw }}
		</div>
	</div>
	{% endif %}
</div>

{% endblock %}