{% extends "base.html" %}
{% load django_tables2 %}
{% load static %}
{% load i18n %}
{% block extrahead %}
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
    <link href="{% static 'django_tables2/bootstrap.css' %}" rel="stylesheet" />
{% endblock %}

{% block body %}
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#">django-tables2</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <form method="post" action="{% url 'set_language' %}" class="navbar-form navbar-left">
                {% csrf_token %}
                <div class="form-group">
                    <select name="language" class="form-control">
                        {% get_current_language as LANGUAGE_CODE %}
                        {% get_available_languages as LANGUAGES %}
                        {% get_language_info_list for LANGUAGES as languages %}
                        {% for language in languages %}
                            <option value="{{ language.code }}"{% if language.code == LANGUAGE_CODE %} selected{% endif %}>
                                {{ language.name_local }} ({{ language.code }})
                            </option>
                        {% endfor %}
                    </select>
                </div>
                <input type="submit" value="set language" class="btn btn-default" />
             </form>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>

<div class="container">
        <h1>Some examples of using django-tables2</h1>

        <p>
            Welcome to the django-tables2 example project.
            Below is a list of different examples using django-tables2.
        </p>

        <ul>
            {% for url, text in urls %}
                <li><a href="{{ url }}">{{ text }}</a></li>
            {% endfor %}
        </ul>

        <h2>Basic example of a table</h2>
        {% render_table table "django_tables2/bootstrap.html" %}

        <div class="row">
            <h2>Same table, but responsive (<code>.table-responsive</code>)</h2>
            <div class="col-sm-12">
                {% render_table table "django_tables2/bootstrap-responsive.html" %}
            </div>
        </div>
    </div>
{% endblock %}
