<commit_before><br/>
<th:block xmlns:th="http://www.thymeleaf.org">
	<!--/*@thymesVar id="playerId" type="java.lang.Integer"*/-->
	<!--/*@thymesVar id="playerName" type="java.lang.String"*/-->
	<!--/*@thymesVar id="seasons" type="java.util.List<java.lang.Integer>"*/-->
	<!--/*@thymesVar id="levels" type="java.util.EnumSet<org.strangeforest.tcb.stats.model.TournamentLevel>"*/-->
	<!--/*@thymesVar id="surfaces" type="org.strangeforest.tcb.stats.model.Surface[]"*/-->
	<!--/*@thymesVar id="rounds" type="org.strangeforest.tcb.stats.model.Round[]"*/-->
	<!--/*@thymesVar id="tournaments" type="java.util.List<org.strangeforest.tcb.stats.model.TournamentItem>"*/-->
	<!--/*@thymesVar id="tournamentEvents" type="java.util.List<org.strangeforest.tcb.stats.model.TournamentEventItem>"*/-->
	<!--/*@thymesVar id="season" type="java.lang.Integer"*/-->
	<!--/*@thymesVar id="level" type="java.lang.String"*/-->
	<!--/*@thymesVar id="surface" type="java.lang.String"*/-->
	<!--/*@thymesVar id="round" type="java.lang.String"*/-->
	<!--/*@thymesVar id="opponentId" type="java.lang.Integer>"*/-->
	<!--/*@thymesVar id="opponentName" type="java.lang.String>"*/-->
	<!--/*@thymesVar id="tournamentEventId" type="java.lang.Integer>"*/-->
	<!--/*@thymesVar id="outcome" type="java.lang.String"*/-->
	<!--/*@thymesVar id="categoryClasses" type="java.util.Map<java.lang.String, java.util.List<org.strangeforest.tcb.stats.model.StatsCategory>>"*/-->
	<script type="text/javascript">
		var lastMatchesStatsFilter;
		$(function() {
			var $matchesTable = $("#matchesTable");
			var device = detectDevice();
			setBootgridColumnsVisible($matchesTable, ["stats"], deviceGreaterOrEqual(device, "md"));
			setBootgridColumnsVisible($matchesTable, ["surface"], deviceGreaterOrEqual(device, "sm"));
			if (!deviceGreaterOrEqual(device, "md"))
				setBootgridColumnsWidths($matchesTable, ["tournament", "match", "score"], [150, 250, 125]);
			$matchesTable.bootgrid({
				ajax: true,
				ajaxSettings: {
					method: "GET",
					cache: false
				},
				url: "/matchesTable?playerId=[[${playerId}]]",
				requestHandler: function(request) {
					request.season = $("#matchesSeason").val();
					request.level = $("#matchesLevel").val();
					request.surface = $("#matchesSurface").val();
					request.round = $("#matchesRound").val();
					request.opponent = $("#matchesOpponent").val();
					request.tournamentId = $("#matchesTournament").val();
					request.tournamentEventId = $("#matchesTournamentEvent").val();
					request.outcome = $("#matchesOutcome").val();
					lastMatchesStatsFilter = matchesStatsFilter();
					if (lastMatchesStatsFilter.hasFilter()) {
						request.statsCategory = lastMatchesStatsFilter.category;
						request.statsFrom = lastMatchesStatsFilter.from;
						request.statsTo = lastMatchesStatsFilter.to;
					}
					return request;
				},
				rowCount: [15, 20, 50, -1],
				formatters: {
					"date": dateFormatter,
					"tournament": tournamentEventFormatter,
					"surface": surfaceFormatter,
					"match": matchFormatter,
					"stats": function(column, row) {
						return row.hasStats ? "<a id='matchStats-" + row.id + "' href='#' class='label label-info label-btn glyphicon glyphicon-stats' onclick='showMatchStats(" + row.id + ", event)' title='Match Statistics'> Stats</a>" : "";
					}
				},
				labels: {
					loading: bootgridTemplateLoading,
					noResults: "No matches found"
				},
				templates: {
					paginationItem: bootgridTemplatePaginationItem
				}
			}).on("loaded.rs.jquery.bootgrid", function() {
				$("#matchesStats").popover("destroy").removeClass("loaded");
			});
			var $matchesTableHeader = $("#matchesTable-header");
			var $search = $matchesTableHeader.find("div.search");
			$search.before($("#matchesStats").remove());
			$search.before($("#matchesTournamentDiv").remove());
			$search.before($("#matchesTournamentEventDiv").remove());
			$search.before($("#matchesOutcomeDiv").remove());
			$("[data-toggle='tooltip']").tooltip();
		});
		function reloadMatches() {
			updateMatchesStatsCategoryStat();
			$("#matchesTable").bootgrid("reload");
		}
		function matchesStatsFilter() {
			return new StatsFilter($("#matchesStatsCategory"), $("#matchesStatsFrom"), $("#matchesStatsTo"))
		}
		function validateMatchesStatsFilter() {
			return validateStatsFilter($("#matchesStatsFrom"), $("#matchesStatsTo"), $("#matchesStatsRange"))
		}
		function matchesStatsFilterChanged() {
			if (validateMatchesStatsFilter() && !lastMatchesStatsFilter.equals(matchesStatsFilter()))
				reloadMatches();
		}
		function updateMatchesStatsCategoryStat() {
			var $category = $("#matchesStatsCategory");
			var $label = $("#matchesStatsCategoryLabel");
			var category = $category.val();
			if (category) {
				var url = "/matchesStat" + matchStatsParams();
				url += "&statsCategory=" + category;
				$.get(url, function (data) {
					var type = $category.find(":selected").data("type");
					var stat = parseFloat(data);
					switch (type) {
						case "PERCENTAGE": stat = stat.toFixed(1) + "%"; break;
						case "RATIO": stat = stat.toFixed(2); break;
					}
					$label.html(stat);
				});
			}
			else
				$label.html("");
		}
		function matchesStatsCategoryChanged() {
			updateMatchesStatsCategoryStat();
			matchesStatsFilterChanged();
		}
		function clearMatchesFilter() {
			$("#matchesSeason").val("");
			$("#matchesLevel").val("");
			$("#matchesSurface").val("");
			$("#matchesRound").val("");
			$("#matchesOpponent").val("");
			$("#matchesTournament").val("");
			$("#matchesTournamentEvent").val("");
			$("#matchesOutcome").val("");
			$("#matchesStatsCategory").val("");
			$("#matchesStatsFrom").val("");
			$("#matchesStatsTo").val("");
			$("#matchesTable").bootgrid("search", "");
			reloadMatches();
		}
		function matchStatsParams() {
			var params = "?playerId=[[${playerId}]]";
			params += "&season=" + $("#matchesSeason").val();
			params += "&level=" + $("#matchesLevel").val();
			params += "&surface=" + $("#matchesSurface").val();
			params += "&round=" + encodeURIComponent($("#matchesRound").val());
			params += "&opponent=" + $("#matchesOpponent").val();
			params += "&tournamentId=" + $("#matchesTournament").val();
			params += "&tournamentEventId=" + $("#matchesTournamentEvent").val();
			params += "&outcome=" + $("#matchesOutcome").val();
			params += "&searchPhrase=" + $("#matchesTable-header").find("input.search-field").val();
			return params;
		}
		function showMatchesStats(event) {
			var $matchesStats = $("#matchesStats");
			if (!$matchesStats.hasClass("loaded")) {
				event.preventDefault();
				if (!validateMatchesStatsFilter())
					return;
				var url = "/matchesStats" + matchStatsParams();
				var statsFilter = matchesStatsFilter();
				if (statsFilter.hasFilter()) {
					url += "&statsCategory=" + statsFilter.category;
					url += "&statsFrom=" + statsFilter.from;
					url += "&statsTo=" + statsFilter.to;
				}
				$.get(url, function(data) {
					$matchesStats.addClass("loaded").popover({content: data, html: true, placement: "auto left"});
					$matchesStats.on("show.bs.popover", function() { $(this).data("bs.popover").tip().css("max-width", "1000px"); }).click();
					$matchesStats.data("statsURL", url);
				});
			}
		}
	</script>
	<div class="row">
		<div class="col-md-2">
			<select id="matchesSeason" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter seasons">
				<option value="">All seasons</option>
				<option th:each="aSeason : ${seasons}" th:value="${aSeason}" value="2005" th:text="${aSeason}" th:selected="${aSeason == season}">2005</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesLevel" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by tournament level">
				<option value="">All levels</option>
				<option th:each="aLevel : ${levels}" th:value="${aLevel.code}" th:class="|bg-level-${aLevel.code}|" value="G" class="bg-level-G" th:text="${aLevel.text}" th:selected="${aLevel.code == level}">Grand Slam</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesSurface" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by surface">
				<option value="">All surfaces</option>
				<option th:each="aSurface : ${surfaces}" th:value="${aSurface.code}" th:class="|bg-surface-${aSurface.code}|" value="H" class="bg-surface-H" th:text="${aSurface.text}" th:selected="${aSurface.code == surface}">Hard</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesRound" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by round">
				<option value="">All rounds</option>
				<option th:each="aRound : ${rounds}" th:value="${aRound.code}" th:class="|bg-result-${aRound.baseCode}|" value="F" class="bg-result-F" th:text="${aRound.text}" th:selected="${aRound.code == round}">Final</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesOpponent" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by opponent">
				<option value="">Vs All</option>
				<option value="NO_1">Vs No. 1</option>
				<option value="TOP_5">Vs Top 5</option>
				<option value="TOP_10">Vs Top 10</option>
				<option value="TOP_20">Vs Top 20</option>
				<option value="TOP_50">Vs Top 50</option>
				<option value="TOP_100">Vs Top 100</option>
				<option value="RIGHT_HANDED">Vs Right-handed</option>
				<option value="LEFT_HANDED">Vs Left-handed</option>
				<option value="BACKHAND_2">Vs Two-handed bh.</option>
				<option value="BACKHAND_1">Vs One-handed bh.</option>
				<option value="SEEDED">Vs Seeded</option>
				<option value="UNSEEDED">Vs Unseeded</option>
				<option value="QUALIFIER">Vs Qualifier</option>
				<option value="WILD_CARD">Vs Wild-Card</option>
				<option value="LUCKY_LOSER">Vs Lucky-Loser</option>
				<option value="PROTECTED_RANKING">Vs Protected Ranking</option>
				<option value="SPECIAL_EXEMPT">Vs Special Exempt</option>
				<option th:if="${opponentId != null}" th:value="${'OPP_' + opponentId}" th:text="${'Vs ' + opponentName}" selected="selected">Vs <NAME></option>
			</select>
		</div>
		<div class="col-md-1">
			<button type="button" class="btn btn-default" onclick="clearMatchesFilter()" data-toggle="tooltip" data-placement="top" title="Clear all filters">
				<span class="glyphicon glyphicon-remove"></span> Clear
			</button>
		</div>
		<div class="col-md-1">
			<div data-toggle="tooltip" data-placement="right" title="Advanced filters">
				<button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#matchesAdvancedFilter">
					<span class="glyphicon glyphicon-cog"></span> Adv.
				</button>
			</div>
		</div>
	</div>
	<div id="matchesAdvancedFilter" class="collapse row" style="margin-top: 15px">
		<div class="col-md-6">
			<div class="input-group">
				<select id="matchesStatsCategory" style="width: 220px" class="form-control" onchange="matchesStatsCategoryChanged()" data-toggle="tooltip" data-placement="top" title="Select statistics category">
					<option value="">Select statistics category</option>
					<optgroup th:each="categoryClass : ${categoryClasses}" th:label="${categoryClass.key}" label="Serve">
						<option th:each="category : ${categoryClass.value}" th:unless="${category.name.startsWith('matches')}" th:value="${category.name}" value="aces" th:data-type="${category.type}" data-type="COUNT" th:text="${category.title}" th:title="#{__${category.descriptionId}__}">Aces</option>
					</optgroup>
				</select>
				<label id="matchesStatsCategoryLabel" for="matchesStatsCategory" class="input-group-addon" style="width: 75px" data-toggle="tooltip" data-placement="top" title="Statistics category value for the selected filter"></label>
				<label for="matchesStatsFrom" class="input-group-addon">From:</label>
				<input id="matchesStatsFrom" type="text" maxlength="6" class="form-control" oninput="matchesStatsFilterChanged()" onchange="matchesStatsFilterChanged()"/>
				<label id="matchesStatsRange" for="matchesStatsTo" class="input-group-addon">To:</label>
				<input id="matchesStatsTo" type="text" maxlength="6" class="form-control" oninput="matchesStatsFilterChanged()" onchange="matchesStatsFilterChanged()"/>
			</div>
		</div>
	</div>
	<div id="matchesTournamentDiv" class="btn-group pull-left margin-right no-margin-left">
		<select id="matchesTournament" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter tournaments">
			<option value="">All tournaments</option>
			<option th:each="tournament : ${tournaments}" th:value="${tournament.id}" value="101" th:text="${tournament.name}" th:class="'bg-level-' + ${tournament.level}">Wimbledon</option>
		</select>
	</div>
	<div id="matchesTournamentEventDiv" class="btn-group pull-left margin-right">
		<select id="matchesTournamentEvent" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter tournament events">
			<option value="">All events</option>
			<option th:each="tournamentEvent : ${tournamentEvents}" th:value="${tournamentEvent.id}" value="1001" th:text="|${tournamentEvent.name} ${tournamentEvent.season}|"
			        th:selected="${tournamentEvent.id == tournamentEventId}">Wimbledon 2008</option>
		</select>
	</div>
	<div id="matchesOutcomeDiv" class="btn-group pull-left margin-right">
		<select id="matchesOutcome" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by outcome">
			<option value="">All matches</option>
			<option value="won" th:selected="${outcome == 'won'}">Won</option>
			<option value="lost" th:selected="${outcome == 'lost'}">Lost</option>
			<option value="wonRET">Won by retirement</option>
			<option value="lostRET">Lost by retirement</option>
			<option value="wonW/O">Won by walkover</option>
			<option value="lostW/O">Lost by walkover</option>
			<option value="wonDEF">Won by defaulting</option>
			<option value="lostDEF">Lost by defaulting</option>
			<option value="ABD">Abandoned</option>
		</select>
	</div>
	<button id="matchesStats" type="button" class="btn btn-info grid-control margin-right" onclick="showMatchesStats(event)" data-toggle="tooltip" data-placement="top" th:title="|${playerName} Statistics (for the selected matches)|">
		<span class="glyphicon glyphicon-stats"></span> Stats
	</button>
	<table id="matchesTable" class="table table-condensed table-hover table-striped">
		<thead>
		<tr>
			<th data-column-id="date" data-formatter="date" data-order="desc" data-width="85">Date</th>
			<th data-column-id="tournament" data-formatter="tournament" data-width="175">Tournament</th>
			<th data-column-id="surface" data-formatter="surface" data-width="80">Surface</th>
			<th data-column-id="round" data-width="75">Round</th><commit_msg>Cosmetics<commit_after><br/>
<th:block xmlns:th="http://www.thymeleaf.org">
	<!--/*@thymesVar id="playerId" type="java.lang.Integer"*/-->
	<!--/*@thymesVar id="playerName" type="java.lang.String"*/-->
	<!--/*@thymesVar id="seasons" type="java.util.List<java.lang.Integer>"*/-->
	<!--/*@thymesVar id="levels" type="java.util.EnumSet<org.strangeforest.tcb.stats.model.TournamentLevel>"*/-->
	<!--/*@thymesVar id="surfaces" type="org.strangeforest.tcb.stats.model.Surface[]"*/-->
	<!--/*@thymesVar id="rounds" type="org.strangeforest.tcb.stats.model.Round[]"*/-->
	<!--/*@thymesVar id="tournaments" type="java.util.List<org.strangeforest.tcb.stats.model.TournamentItem>"*/-->
	<!--/*@thymesVar id="tournamentEvents" type="java.util.List<org.strangeforest.tcb.stats.model.TournamentEventItem>"*/-->
	<!--/*@thymesVar id="season" type="java.lang.Integer"*/-->
	<!--/*@thymesVar id="level" type="java.lang.String"*/-->
	<!--/*@thymesVar id="surface" type="java.lang.String"*/-->
	<!--/*@thymesVar id="round" type="java.lang.String"*/-->
	<!--/*@thymesVar id="opponentId" type="java.lang.Integer>"*/-->
	<!--/*@thymesVar id="opponentName" type="java.lang.String>"*/-->
	<!--/*@thymesVar id="tournamentEventId" type="java.lang.Integer>"*/-->
	<!--/*@thymesVar id="outcome" type="java.lang.String"*/-->
	<!--/*@thymesVar id="categoryClasses" type="java.util.Map<java.lang.String, java.util.List<org.strangeforest.tcb.stats.model.StatsCategory>>"*/-->
	<script type="text/javascript">
		var lastMatchesStatsFilter;
		$(function() {
			var $matchesTable = $("#matchesTable");
			var device = detectDevice();
			setBootgridColumnsVisible($matchesTable, ["stats"], deviceGreaterOrEqual(device, "md"));
			setBootgridColumnsVisible($matchesTable, ["surface"], deviceGreaterOrEqual(device, "sm"));
			if (!deviceGreaterOrEqual(device, "md"))
				setBootgridColumnsWidths($matchesTable, ["tournament", "match", "score"], [150, 250, 125]);
			$matchesTable.bootgrid({
				ajax: true,
				ajaxSettings: {
					method: "GET",
					cache: false
				},
				url: "/matchesTable?playerId=[[${playerId}]]",
				requestHandler: function(request) {
					request.season = $("#matchesSeason").val();
					request.level = $("#matchesLevel").val();
					request.surface = $("#matchesSurface").val();
					request.round = $("#matchesRound").val();
					request.opponent = $("#matchesOpponent").val();
					request.tournamentId = $("#matchesTournament").val();
					request.tournamentEventId = $("#matchesTournamentEvent").val();
					request.outcome = $("#matchesOutcome").val();
					lastMatchesStatsFilter = matchesStatsFilter();
					if (lastMatchesStatsFilter.hasFilter()) {
						request.statsCategory = lastMatchesStatsFilter.category;
						request.statsFrom = lastMatchesStatsFilter.from;
						request.statsTo = lastMatchesStatsFilter.to;
					}
					return request;
				},
				rowCount: [15, 20, 50, -1],
				formatters: {
					"date": dateFormatter,
					"tournament": tournamentEventFormatter,
					"surface": surfaceFormatter,
					"match": matchFormatter,
					"stats": function(column, row) {
						return row.hasStats ? "<a id='matchStats-" + row.id + "' href='#' class='label label-info label-btn glyphicon glyphicon-stats' onclick='showMatchStats(" + row.id + ", event)' title='Match Statistics'> Stats</a>" : "";
					}
				},
				labels: {
					loading: bootgridTemplateLoading,
					noResults: "No matches found"
				},
				templates: {
					paginationItem: bootgridTemplatePaginationItem
				}
			}).on("loaded.rs.jquery.bootgrid", function() {
				$("#matchesStats").popover("destroy").removeClass("loaded");
			});
			var $matchesTableHeader = $("#matchesTable-header");
			var $search = $matchesTableHeader.find("div.search");
			$search.before($("#matchesStats").remove());
			$search.before($("#matchesTournamentDiv").remove());
			$search.before($("#matchesTournamentEventDiv").remove());
			$search.before($("#matchesOutcomeDiv").remove());
			$("[data-toggle='tooltip']").tooltip();
		});
		function reloadMatches() {
			updateMatchesStatsCategoryStat();
			$("#matchesTable").bootgrid("reload");
		}
		function matchesStatsFilter() {
			return new StatsFilter($("#matchesStatsCategory"), $("#matchesStatsFrom"), $("#matchesStatsTo"))
		}
		function validateMatchesStatsFilter() {
			return validateStatsFilter($("#matchesStatsFrom"), $("#matchesStatsTo"), $("#matchesStatsRange"))
		}
		function matchesStatsFilterChanged() {
			if (validateMatchesStatsFilter() && !lastMatchesStatsFilter.equals(matchesStatsFilter()))
				reloadMatches();
		}
		function updateMatchesStatsCategoryStat() {
			var $category = $("#matchesStatsCategory");
			var $label = $("#matchesStatsCategoryLabel");
			var category = $category.val();
			if (category) {
				var url = "/matchesStat" + matchStatsParams();
				url += "&statsCategory=" + category;
				$.get(url, function (data) {
					var type = $category.find(":selected").data("type");
					var stat = parseFloat(data);
					switch (type) {
						case "PERCENTAGE": stat = stat.toFixed(1) + "%"; break;
						case "RATIO": stat = stat.toFixed(2); break;
					}
					$label.html(stat);
				});
			}
			else
				$label.html("");
		}
		function matchesStatsCategoryChanged() {
			updateMatchesStatsCategoryStat();
			matchesStatsFilterChanged();
		}
		function clearMatchesFilter() {
			$("#matchesSeason").val("");
			$("#matchesLevel").val("");
			$("#matchesSurface").val("");
			$("#matchesRound").val("");
			$("#matchesOpponent").val("");
			$("#matchesTournament").val("");
			$("#matchesTournamentEvent").val("");
			$("#matchesOutcome").val("");
			$("#matchesStatsCategory").val("");
			$("#matchesStatsFrom").val("");
			$("#matchesStatsTo").val("");
			$("#matchesTable").bootgrid("search", "");
			reloadMatches();
		}
		function matchStatsParams() {
			var params = "?playerId=[[${playerId}]]";
			params += "&season=" + $("#matchesSeason").val();
			params += "&level=" + $("#matchesLevel").val();
			params += "&surface=" + $("#matchesSurface").val();
			params += "&round=" + encodeURIComponent($("#matchesRound").val());
			params += "&opponent=" + $("#matchesOpponent").val();
			params += "&tournamentId=" + $("#matchesTournament").val();
			params += "&tournamentEventId=" + $("#matchesTournamentEvent").val();
			params += "&outcome=" + $("#matchesOutcome").val();
			params += "&searchPhrase=" + $("#matchesTable-header").find("input.search-field").val();
			return params;
		}
		function showMatchesStats(event) {
			var $matchesStats = $("#matchesStats");
			if (!$matchesStats.hasClass("loaded")) {
				event.preventDefault();
				if (!validateMatchesStatsFilter())
					return;
				var url = "/matchesStats" + matchStatsParams();
				var statsFilter = matchesStatsFilter();
				if (statsFilter.hasFilter()) {
					url += "&statsCategory=" + statsFilter.category;
					url += "&statsFrom=" + statsFilter.from;
					url += "&statsTo=" + statsFilter.to;
				}
				$.get(url, function(data) {
					$matchesStats.addClass("loaded").popover({content: data, html: true, placement: "auto left"});
					$matchesStats.on("show.bs.popover", function() { $(this).data("bs.popover").tip().css("max-width", "1000px"); }).click();
					$matchesStats.data("statsURL", url);
				});
			}
		}
	</script>
	<div class="row">
		<div class="col-md-2">
			<select id="matchesSeason" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter seasons">
				<option value="">All seasons</option>
				<option th:each="aSeason : ${seasons}" th:value="${aSeason}" value="2005" th:text="${aSeason}" th:selected="${aSeason == season}">2005</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesLevel" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by tournament level">
				<option value="">All levels</option>
				<option th:each="aLevel : ${levels}" th:value="${aLevel.code}" th:class="|bg-level-${aLevel.code}|" value="G" class="bg-level-G" th:text="${aLevel.text}" th:selected="${aLevel.code == level}">Grand Slam</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesSurface" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by surface">
				<option value="">All surfaces</option>
				<option th:each="aSurface : ${surfaces}" th:value="${aSurface.code}" th:class="|bg-surface-${aSurface.code}|" value="H" class="bg-surface-H" th:text="${aSurface.text}" th:selected="${aSurface.code == surface}">Hard</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesRound" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by round">
				<option value="">All rounds</option>
				<option th:each="aRound : ${rounds}" th:value="${aRound.code}" th:class="|bg-result-${aRound.baseCode}|" value="F" class="bg-result-F" th:text="${aRound.text}" th:selected="${aRound.code == round}">Final</option>
			</select>
		</div>
		<div class="col-md-2">
			<select id="matchesOpponent" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by opponent">
				<option value="">Vs All</option>
				<option value="NO_1">Vs No. 1</option>
				<option value="TOP_5">Vs Top 5</option>
				<option value="TOP_10">Vs Top 10</option>
				<option value="TOP_20">Vs Top 20</option>
				<option value="TOP_50">Vs Top 50</option>
				<option value="TOP_100">Vs Top 100</option>
				<option value="RIGHT_HANDED">Vs Right-handed</option>
				<option value="LEFT_HANDED">Vs Left-handed</option>
				<option value="BACKHAND_2">Vs Two-handed bh.</option>
				<option value="BACKHAND_1">Vs One-handed bh.</option>
				<option value="SEEDED">Vs Seeded</option>
				<option value="UNSEEDED">Vs Unseeded</option>
				<option value="QUALIFIER">Vs Qualifier</option>
				<option value="WILD_CARD">Vs Wild-Card</option>
				<option value="LUCKY_LOSER">Vs Lucky-Loser</option>
				<option value="PROTECTED_RANKING">Vs Protected Ranking</option>
				<option value="SPECIAL_EXEMPT">Vs Special Exempt</option>
				<option th:if="${opponentId != null}" th:value="${'OPP_' + opponentId}" th:text="${'Vs ' + opponentName}" selected="selected">Vs Roger Federer</option>
			</select>
		</div>
		<div class="col-md-1">
			<button type="button" class="btn btn-default" onclick="clearMatchesFilter()" data-toggle="tooltip" data-placement="top" title="Clear all filters">
				<span class="glyphicon glyphicon-remove"></span> Clear
			</button>
		</div>
		<div class="col-md-1">
			<div data-toggle="tooltip" data-placement="right" title="Advanced filters">
				<button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#matchesAdvancedFilter">
					<span class="glyphicon glyphicon-cog"></span> Adv.
				</button>
			</div>
		</div>
	</div>
	<div id="matchesAdvancedFilter" class="collapse row" style="margin-top: 15px">
		<div class="col-md-6">
			<div class="input-group">
				<select id="matchesStatsCategory" style="width: 220px" class="form-control" onchange="matchesStatsCategoryChanged()" data-toggle="tooltip" data-placement="top" title="Select statistics category">
					<option value="">Select statistics category</option>
					<optgroup th:each="categoryClass : ${categoryClasses}" th:label="${categoryClass.key}" label="Serve">
						<option th:each="category : ${categoryClass.value}" th:unless="${category.name.startsWith('matches')}" th:value="${category.name}" value="aces" th:data-type="${category.type}" data-type="COUNT" th:text="${category.title}" th:title="#{__${category.descriptionId}__}">Aces</option>
					</optgroup>
				</select>
				<label id="matchesStatsCategoryLabel" for="matchesStatsCategory" class="input-group-addon" style="width: 75px" data-toggle="tooltip" data-placement="top" title="Statistics category value for the selected filter"></label>
				<label for="matchesStatsFrom" class="input-group-addon">From:</label>
				<input id="matchesStatsFrom" type="text" maxlength="6" class="form-control" oninput="matchesStatsFilterChanged()" onchange="matchesStatsFilterChanged()"/>
				<label id="matchesStatsRange" for="matchesStatsTo" class="input-group-addon">To:</label>
				<input id="matchesStatsTo" type="text" maxlength="6" class="form-control" oninput="matchesStatsFilterChanged()" onchange="matchesStatsFilterChanged()"/>
			</div>
		</div>
	</div>
	<div id="matchesTournamentDiv" class="btn-group pull-left margin-right no-margin-left" style="width: 210px">
		<select id="matchesTournament" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter tournaments">
			<option value="">All tournaments</option>
			<option th:each="tournament : ${tournaments}" th:value="${tournament.id}" value="101" th:text="${tournament.name}" th:class="'bg-level-' + ${tournament.level}">Wimbledon</option>
		</select>
	</div>
	<div id="matchesTournamentEventDiv" class="btn-group pull-left margin-right" style="width: 240px">
		<select id="matchesTournamentEvent" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter tournament events">
			<option value="">All events</option>
			<option th:each="tournamentEvent : ${tournamentEvents}" th:value="${tournamentEvent.id}" value="1001" th:text="|${tournamentEvent.name} ${tournamentEvent.season}|"
			        th:selected="${tournamentEvent.id == tournamentEventId}">Wimbledon 2008</option>
		</select>
	</div>
	<div id="matchesOutcomeDiv" class="btn-group pull-left margin-right">
		<select id="matchesOutcome" class="form-control" onchange="reloadMatches()" data-toggle="tooltip" data-placement="top" title="Filter by outcome">
			<option value="">All matches</option>
			<option value="won" th:selected="${outcome == 'won'}">Won</option>
			<option value="lost" th:selected="${outcome == 'lost'}">Lost</option>
			<option value="wonRET">Won by retirement</option>
			<option value="lostRET">Lost by retirement</option>
			<option value="wonW/O">Won by walkover</option>
			<option value="lostW/O">Lost by walkover</option>
			<option value="wonDEF">Won by defaulting</option>
			<option value="lostDEF">Lost by defaulting</option>
			<option value="ABD">Abandoned</option>
		</select>
	</div>
	<button id="matchesStats" type="button" class="btn btn-info grid-control margin-right" onclick="showMatchesStats(event)" data-toggle="tooltip" data-placement="top" th:title="|${playerName} Statistics (for the selected matches)|">
		<span class="glyphicon glyphicon-stats"></span> Stats
	</button>
	<table id="matchesTable" class="table table-condensed table-hover table-striped">
		<thead>
		<tr>
			<th data-column-id="date" data-formatter="date" data-order="desc" data-width="85">Date</th>
			<th data-column-id="tournament" data-formatter="tournament" data-width="175">Tournament</th>
			<th data-column-id="surface" data-formatter="surface" data-width="80">Surface</th>
			<th data-column-id="round" data-width="75">Round</th>
{'fraction_non_alphanumeric': 0.20548355931638737, 'fraction_numerical': 0.006263117566712197, 'mean_word_length': 5.308953341740227, 'pattern_counts': {'":': 16, '<': 396, '<?xml version=': 0, '>': 402, 'https://': 0, 'lorem ipsum': 0, 'www.': 2, 'xml': 2}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6438348', 'n_tokens_mistral': 10906, 'n_tokens_neox': 9322, 'n_words': 1630}