{% extends "layout.html" %}
{% block content %}

<div class="title">Trancher un joueur</div>
<div class="desc">
    Tu peux bannir quelqu'un pour une durée de 30 minutes. Si tu échoues, tu est bannis 10 minutes.
    Ta cible sera notifiée quelle que soit l'issue de ta tentative. Question chance, c'est 50-50.
</div>

<div class="sep"></div>

<form action="" method="post">

    <div class="desc">Écris le nom de ta victime :</div>
    <input type="text" name="search" id="word">
    <br>
    <div class="desc">Choisis-la :</div>
    <select id="auto" name="target_id">
        <option value="none">(sélectionner un joueur)</option>
        {% for p in players %}
        <option value="{{p.id}}">{{p.name}} {{p.firstname}}</option>
        {% endfor %}
    </select>
    <br>
    <input type="submit" value="TCHAK!" id="tchak" class="button" />

</form>

<div class="sep"></div>

<div class="title">
    <a href="{{ url_for('home') }}">&laquo; retour à l'accueil</a>
</div>

<div class="sep"></div>

<script>
$(function(){
    $('#word').keyup(function(e){
        var input = $(this).val();
        $.ajax({
            type: "get",
            url: "complete",
            data: {v: input},
            async: true,
            success: function(data){
                var outWords = $.parseJSON(data);
                $('#auto').html('');

                for(x = 0; x < outWords.length; x++){
                    $('#auto').prepend('<option value="' + outWords[x][0] + '">'+outWords[x][1]+'</option>'); //Fills the #auto div with the options
                }
            }
        })
    })
});
</script>

{% endblock %}