{% extends 'gestion/base.html' %}
{% load static %}

{% block contents %}
<div id="all-contents">
  <div id="gestion-prets">
    <form>
      {% csrf_token %}
      <label for="nomprenom">Élève :</label>
      <input type="text" placeholder="NOM, Prénom" id="nomprenom"
	     name="nomprenom" {% if nomprenom %} value="{{ nomprenom }}" {% endif %}/>
      <button type="button" onclick="efface_nomprenom()" style="margin-right: 5px;">
	<img src="{% static '/img/edit-delete.svg' %}" alt="RAZ nomprenom" title="Effacer le nom" style="width: 16px;"/>
      </button>
      <label for="codelivre">Nouveau livre (entrer le code) : </label>
      <input type="text" placeholder="00000" id="codelivre"
	     name="codelivre" />
      <input type="hidden" id="multiples" value="1">
    </form>

    <div id="nouveaux_livres" class="fond-blanc" style="display: inline-block;">
      <table class="nouveaux_livres">
	<caption>
	  <div class="flexcaption">
            <button class="actionbuttons" onclick="prets_go()">
	      <img src="{% static '/img/document-save.svg' %}"
		   alt="Enregistrer les nouveaux livres"
		   title="Enregistrer les nouveaux livres"/>
	    </button>
	    <div style="margin-left: 5px; text-align: right;">
	      <span id="caption0">Nouveaux livres à prêter.</span> <br>
	      Cliquer sur le bouton ci-contre <br>
	      pour les enregistrer.
	    </div>
	  </div>
	</caption>
	<tr>
	  <th>Code-barre</th>
	  <th>Manuel à prêter</th>
	  <th>État à considérer</th>
	  <th>Ou pas ?</th>
	</tr>
      </table>
    </div>
    <div id="tableau_prets">
    </div>
  </div>
  <div id="meme-classe" style="display: none">
  </div>
</div>
<audio id="soundicon1" src="{% static '/img/xylofon.wav' %}" style="display: none;">
</audio>
<audio id="soundicon2" src="{% static '/img/percussion-50.wav' %}" style="display: none;">
</audio>
<audio id="soundicon3" src="{% static '/img/beau-danube.mp3' %}" style="display: none;">
</audio>
<div id="invisible" style="display: none;">
  <!-- ce formulaire invisible permet de rendre un livre tiers -->
  <form id="livre_tiers" action="/retours" target="_blank"
	method="post">
    {% csrf_token %}
    <input type= "text" name="nomprenom" id="nomprenom_cache"/>
    <input type= "text" name="livre" id="codelivre_cache"/>
  </form>
</div>
<div id="messages" style="display: none;"></div>
<div id="shortmessage" style="display: none;" class="notif">
  Le prêt de livres s'est bien déroulé ; <br>
  pensez à imprimer la fiche de prêt.
</div>

<script> prets_init("{{ nomprenom }}"); </script>

{% endblock %}
