{% extends "gnotty/base.html" %}

{% block extrahead %}
{{ block.super }}
{% if request.GET.id %}
<script>
$(function() {
    $('#message-{{ request.GET.id }}').addClass('message-highlighted');
});
if (!location.hash) {
    location += '#message-{{ request.GET.id }}';
    var scrollInterval = setInterval(function() {
        if (location.hash) {
            scrollBy(0, -100);
            clearInterval(scrollInterval);
        }
    }, 100);
}
</script>
{% endif %}
{% endblock %}

{% block content %}
<table class="table table-striped" id="messages">
{% for message in messages %}
{% with message.message_time.date as day %}
{% ifchanged day %}
<tr>
    <th colspan="{% if request.GET.q %}4{% else %}3{% endif %}">
        <h2><a href="{% url gnotty_day day.year day.month day.day %}">{{ day }}</a></h2>
    </th>
</tr>
{% endifchanged %}
<tr id="message-{{ message.id }}">
    {% if request.GET.q %}
    <td><a class="btn btn-mini btn-primary" href="{{ message.get_absolute_url }}?id={{ message.id }}">View</a></td>
    {% endif %}
    <td class="time">[{{ message.message_time|date:"H:i:s" }}]</td>
    <td class="nickname">{{ message.nickname }}:</td>
    <td class="message">{{ message.message|urlize }}</td>
</tr>
{% endwith %}
{% empty %}
<p>No messages.</p>
{% endfor %}
</table>
{% endblock %}
