{% extends "base.html" %}
{% load gravatar %}

{% block additional_stylesheets %}
<link rel="stylesheet" type="text/css" media="all" href="{{ STATIC_URL }}css/thread.css" />
{% endblock %}

{% block content %}

<section id="thread_content">
	{% include 'messages/first_email.html' with first_mail=message %}

    {% if attachments|length %}
    <h2>Attachments</h2>
    <ul>
    {% for attachment in attachments %}
        <li><a href="{% url message_attachment mlist_fqdn=list_address, hashid=hashid, counter=attachment.counter, filename=attachment.name %}">{{attachment.name}}</a>
            ({{attachment.content_type}}, {{attachment.size}} octets)
        </li>
    {% endfor %}
    </ul>
    {% endif %}
</section>

{% endblock %}

{% block additionaljs %}
<script type="text/javascript">
	$(document).ready(function() {
		$(".voteup").click(function() {
			// @TODO: Extract the message id from the HTML DOM element instead of hard coding it in Javascript.
			message_id = this.parentElement.getAttribute('messageid');
			{% if user.is_authenticated %}
			$.ajax({
				type : "POST",
				url : "{% url message_vote mlist_fqdn=list_address %}",
				data : {
					vote : 1,
					messageid : message_id,
					list : "{{list_address}}",
					csrfmiddlewaretoken : '{{ csrf_token }}'
				},
				success : function(response) {
					console.log(response);
					location.reload();
				}
			});
			return false;
			{% else %}
				alert('You need to login in order to vote');
			{% endif %}
		});

		$(".votedown").click(function() {
			message_id = this.parentElement.getAttribute('messageid');
			{% if user.is_authenticated %}
			$.ajax({
				type : "POST",
				url : '{% url message_vote mlist_fqdn=list_address %}',
				data : {
					vote : -1,
					messageid : message_id,
					list : "{{list_address}}",
					csrfmiddlewaretoken : '{{ csrf_token }}'
				},
				success : function(response) {
					console.log(response);
					// @TODO : Remove this reload and update count using AJAX
					location.reload();
				}
			});
			return false;
			{% else %}
				alert('You need to login in order to vote');
			{% endif %}

		});

	});
</script>

{% endblock %}