{% extends 'base.html' %}

{% block content %}

{% load i18n %}

<section id="shared-forms">
  <div class="page-header">
    <h1>{% blocktrans %}Form Gallery <small>Shared Forms</small>{% endblocktrans %}</h1>
  </div>
    <div id="mfeedback">&nbsp;</div>

  <table id="forms-table" class="table table-bordered table-striped">
    <thead>
      <tr>
        <th>{% trans "User" %}</th>
        <th>{% trans "Name" %}</th>
        <th>{% trans "Description" %}</th>
        <th>{% trans "XLSForm" %}</th>
      </tr>
    </thead>
    <tbody>
      {% for data_dictionary in shared_forms %}
      <tr>
        <td>
          <img src='{{ data_dictionary.user.profile.gravatar }}' alt='gravatar' width='20' height='20' />&nbsp;<a href="/{{ data_dictionary.user.username }}">{{ data_dictionary.user.username }}</a>
        </td>
        <td><a href="{% url "main.views.show" data_dictionary.user.username data_dictionary.id_string %}">{{ data_dictionary.title }}</a>
            {% if loggedin_user and data_dictionary.is_crowd_form %}
            <br />
            <span class="label label">
            <a href="{% url "main.views.edit" data_dictionary.user.username data_dictionary.id_string %}?crowdform=add">
                {% trans "add crowdform" %}
            </a>
            </span>
            {% endif %}
        </td>
        <td>{{ data_dictionary.description }}</td>
        <td>
          {% if data_dictionary.xls %}
            <a href="{% url "download_xlsform" data_dictionary.user.username data_dictionary.id_string %}" class="btn btn-small btn-success">{% trans "Excel" %}</a>
            {% if not data_dictionary.id_string in cloned %}
                {% if loggedin_user and data_dictionary.xls|length > 0  and loggedin_user.username != data_dictionary.user.username %}
                    <a href="" data-url="{% url "main.views.clone_xlsform" data_dictionary.user.username %}"
                    data-username="{{ data_dictionary.user.username }}" data-id="{{ data_dictionary.id_string }}" class="clonexls btn small" onclick="$(this).hide()">{% trans "Clone" %}</a>
                {% endif %}
            {% endif %}
          {% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>

</section>
{% endblock %}

{% block javascript %}
{{ block.super }}

  <script type="text/javascript" src="/static/js/jquery.dataTables.js"></script>
  <script type="text/javascript" src="/static/js/jquery.dataTables.pagination.js"></script>
  <script type="text/javascript" src="/static/js/form_actions.js"></script>
  <script type="text/javascript">

	$(document).ready(function() {
        $.extend( $.fn.dataTableExt.oStdClasses, {
          "sSortAsc": "header headerSortDown",
          "sSortDesc": "header headerSortUp",
          "sSortable": "header",
          "sWrapper": "dataTables_wrapper form-inline"
        } );

	  $('#forms-table').dataTable({
                  "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
	          "bPaginate" : true,
                  "sPaginationType": "bootstrap",// "iDisplayLength": 4,
                  "bSort": true,
                  "oLanguage": {"sSearch": "Search:"},
                  "oSearch": {"sSearch": ""},
      });
      $('#forms-table_filter').addClass('row');
      $('#mfeedback').hide();
	} );
  </script>
{% endblock %}
