{% extends "biglib_base.html" %}
{% block extra-header %}
	<link type="text/css" rel="stylesheet"
		href="{{ STATIC_URL }}css/redmond/jquery-ui.css"></link>
	<link type="text/css" rel="stylesheet" href="{{ STATIC_URL }}css/clean-left.css"></link>
	<script type="text/javascript" src="{{ STATIC_URL }}js/jquery-ui.js"></script>
	<script type="text/javascript" src="{{ STATIC_URL }}js/book-returning-confirmation.js"></script>
	<script type="text/javascript" src="{{ STATIC_URL }}js/returning-book.js"></script>
	<script>
	
		$(function() {
			$("#tabs").tabs();
		});
	  
	</script>

{% endblock %}
{% block title %} {{ block.super }}- Empréstimos {%endblock %}

{% block breadcrumb %}
    {{ block.super }} > <a href='{% url loans_page %}'>Empréstimos</a>
{% endblock %}

{% block menu %}
{% endblock %}
{% block content %}

<div id="tabs">
	<ul>
		<li><a href="#tabs-1">Meus livros com os amigos</a>
		</li>
		<li><a href="#tabs-2">Livros dos amigos comigo</a>
		</li>
	</ul>
	<div id='dialog-returning-book' style='display: none' title="Confirmação">Seu amigo(a) será notificado(a) para que confirme a devolução.</div>
	<div id='dialog-returning-book-confirmation' style='display: none' title="Confirmação">Seu amigo(a) afirma que devolveu este livro.</div>
	<div id="tabs-1">
	   <table class='tbl-emprestimo center'>
	       <tr class='header'><th>status</th><th>livro</th><th>com</th><th>devolução</th></tr>
	       {% for loan in with_others %}
	           <tr>
	               <td id="{{loan.id}}-status"><a href='{% url loan_detail loan.id %}'>{{ loan.status_text }}</a></td>
	               <td><a href='{% url instance loan.book.id %}' title='{{ loan.book.book.title }}' ><img src='{{ loan.book.book.get_url }}' class='small-cover' /></a></td>
	               <td>{{ loan.requester.user.first_name }}</td>
	               <td>{% if loan.expiration_date %}{{ loan.expiration_date }}{% endif %}</td>
	               <td width="100">
		               {% if loan.is_returning %}
	                      <input id='{{ loan.id }}-btn' type="submit" class="returning-book-confirmation-btn" loan_id="{{ loan.id }}" value="Confirme">
	                      <div id='{{ loan.id }}'></div>
		               {% endif %}
                   </td>
	           </tr>
	       {% empty %}
	           <tr><td>Nenhum livro solicitado.</td></tr>
	       {% endfor %}
	   </table>
	</div>
	<div id="tabs-2">
		<table class='tbl-emprestimo center'>
           <tr class='header'><th>status</th><th>livro</th><th>dono</th><th>devolução</th><th></th></tr>
           {% for loan in with_me %}
               <tr>
                   <td id="{{loan.id}}-status"><a href='{% url loan_detail loan.id %}'>{{ loan.status_text }}</a></td>
                   <td><a href='{% url instance loan.book.id %}' title='{{ loan.book.book.title }}' ><img src='{{ loan.book.book.get_url }}' class='small-cover' /></a></td>
                   <td>{{ loan.book.owner.user.first_name }}</td>
                   <td>{% if loan.expiration_date %}{{ loan.expiration_date }}{% endif %}</td>
                   <td width="100">
                        {% if loan.is_active %}
                            <input id='{{ loan.id }}-btn' type="submit" class="returning-book-btn" loan_id="{{ loan.id }}" value="Devolver">    
                            <div id='{{ loan.id }}'></div>
                        {% endif %}
                   </td>
               </tr>
           {% empty %}
               <tr><td colspan="5">Nenhum livro solicitado.</td></tr>
           {% endfor %}
       </table>
	</div>
</div>




{% endblock %}