{% extends 'website/templates/base.html' %}
{% load static %}
{% load count_tags %}

{% block content %}
    <h4><u>Recent Questions</u></h4>
    <table class="table table-bordered table-hover">
        <th> FOSS </th>
        <th> Tutorial</th>
        <th> Min </th>
        <th> Sec </th>
        <th> Question</th>
        <th> Date</th>
        <th> Views</th>
        <th> Answers</th>
        <th> User</th>
        {% for question in questions %}
        <tr>
            <td>
                <span href="#" class="category" data-toggle="tooltip" data-placement="top" title="{{ question.category}}">
                    {{ question.category|truncatechars:12 }} 
                </span>
                <a class="pull-right" href="{% url 'website:filter' question.category %}?qid={{ question.id }}">
                    <span class="glyphicon glyphicon-search"></span>
                </a>
            </td>
            
            <td>
                <span class="tutorial" data-toggle="tooltip" data-placement="top" title="{{ question.tutorial}}">
                    {{ question.tutorial|truncatechars:12 }}
                </span>
                <a class="pull-right" href="{% url 'website:filter' question.category question.tutorial %}?qid={{ question.id }}">
                    <span class="glyphicon glyphicon-search"></span>
                </a>
            </td>
            
            <td>
                <span>
                    <a href="{% url 'website:filter' question.category question.tutorial question.minute_range %}?qid={{ question.id }}">
                        {{ question.minute_range }}
                    </a>
                </span>
            </td>
            
            <td>        
                <span>
                    <a href="{% url 'website:filter' question.category question.tutorial question.minute_range question.second_range%}?qid={{ question.id }}">
                        {{ question.second_range }}
                    </a>
                </span>
            </td>
            
            <td>
                <span class="title" data-toggle="tooltip" data-placement="top" title="{{ question.title }}">
                    <a href="{% url 'website:get_question' question.id %}">{{ question.title|truncatechars:40 }}</a>
                </span>            
            </td>
            
            <td>    
                <span>
                    <i>
                        {{ question.date_created|date:"d-m-y" }}
                    </i>
                </span>
            </td>
            
            <td>
                {{ question.views}}
            </td>
            
            <td>
                {{ question.answer_set.count }}
            </td>
           
            <td>
                <span class="title" data-toggle="tooltip" data-placement="top" title="{{ question.user }}">
                    {{ question.user|truncatechars:10 }}
                </span>
            </td>
        </tr>
        {% endfor %}

    </table>
    {% if total > 10 %}
        <ul class="pagination pull-right">
            {% for i in total|get_range:"0,10" %}
                <li>
                    <a href="{% url 'website:all_questions' %}?marker={{ i }}">
                        {% if i == marker %}
                            <strong>{{ i|div:"10"|inc }}</strong>
                        {% else %}
                            {{ i|div:"10"|inc }}
                        {% endif %}
                    </a>
                </li>
            {% endfor %}
        </ul>
    {% endif %}

{% endblock %}

{% block javascript %}
<script>
    $('span').tooltip();
</script>
{% endblock %}