{% extends "abstracts/base.jinja" %}
{% block title %}Maloja - Track Charts{% endblock %}

{% import 'snippets/links.jinja' as links %}

{% block scripts %}
	<script src="/datechange.js" async></script>
{% endblock %}

{% set charts = dbc.get_charts_tracks(filterkeys,limitkeys) %}
{% set pages = math.ceil(charts.__len__() / amountkeys.perpage) %}
{% if charts[0] is defined %}
	{% set toptrack = charts[0].track %}
	{% set img = images.get_track_image(toptrack) %}
{% else %}
	{% set img = "/favicon.png" %}
{% endif %}


{% block content %}

<table class="top_info">
	<tr>
		<td class="image">
			<div style="background-image:url('{{ img }}')"></div>
		</td>
		<td class="text">
			<h1>Track Charts</h1><a href="/top_tracks"><span>View #1 Tracks</span></a><br/>
			{% if filterkeys.get('artist') is not none %}by {{ links.link(filterkeys.get('artist')) }}{% endif %}
			<span>{{ limitkeys.timerange.desc(prefix=True) }}</span>
			<br/><br/>
			{% with delimitkeys = {} %}
			{% include 'snippets/timeselection.jinja' %}
			{% endwith %}

		</td>
	</tr>
</table>

{% if settings['CHARTS_DISPLAY_TILES'] %}
	{% include 'partials/charts_tracks_tiles.jinja' %}
	<br/><br/>
{% endif %}

{% with compare=true %}
{% include 'partials/charts_tracks.jinja' %}
{% endwith %}

{% import 'snippets/pagination.jinja' as pagination %}
{{ pagination.pagination(filterkeys,limitkeys,delimitkeys,amountkeys,pages) }}

{% endblock %}
