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

<div class="title">Trancher un joueur</div>
<div class="desc">
    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 %}