{% extends "base.html" %}

{% block title %}Player - {{ player.name }}{% endblock %}

{% block head %}
{{ super() }}
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.1/chart.umd.js" integrity="sha512-ZwR1/gSZM3ai6vCdI+LVF1zSq/5HznD3ZSTk7kajkaj4D292NLuduDCO1c/NT8Id+jE58KYLKT7hXnbtryGmMg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdn.jsdelivr.net/npm/moment@2.27.0"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-moment@0.1.1"></script>
<script src="/static/js/player_detail.js"></script>
<link rel="stylesheet" href="/static/css/player/detail.css"/>
{% endblock %}

{% block content %}
<h2>This is the page for player {{ player.name }} who has id {{ player.id }}</h2>

{% if decks %}
<div class="clearfix">
<div style="float:left;">
    <h2>Decks</h2>
    <ul>
    {% for deck in decks %}
    <li><a href="/deck/{{ deck.id }}">{{ deck.name }}</a></li>
    {% endfor %}
    </ul>
</div>
<div style="float:left;width:80%;margin-left:10px;">
    <canvas id="graph_canvas"></canvas>
</div>
</div>

{% endif %}
{% endblock %}