Software Público Brasileiro

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

{% trans "Anonymous" as anonymous %}

{% block head_js %}

<script>
  function vote_done_callback(msg_id, step) {
    console.debug('(un)vote successfuly (step ' + step + ')');
    var $msg = $('#msg-' + msg_id)

    $('.vote-count', $msg).text(function(self, count) {
        return parseInt(count) + step;
    });

    if (step == -1) {
      var $btn = $('.vote.btn-success', $msg);
      $btn.unbind('click');
      $btn.bind('click', function() {
        vote(msg_id);
      });
    } else {
      var $btn = $('.vote.btn-default', $msg);
      $btn.unbind('click');
      $btn.bind('click', function() {
        unvote(msg_id);
      });
    }
    $btn.toggleClass('btn-success');
    $btn.toggleClass('btn-default');
    $btn.button('reset')
  }

  function vote_fail_callback(jqXHR, textStatus, errorThrown) {
    var msg;

    if (jqXHR.status === 403) {
      msg = " {% trans 'You must login before voting.' %}"
    } else {
        return;
    }

    $('#alert-js #alert-message').html(msg);
    $('#alert-js').show();
    scroll(0, 0);
  }

  function get_vote_ajax_dict(msg_id, method) {
    var csrftoken = $.cookie('csrftoken');
    $('#msg-' + msg_id + ' .vote.btn-success').button('loading');

    return {
      url: "/api/message/" + msg_id + "/vote",
      type: method,
      beforeSend: function(xhr, settings) {
        xhr.setRequestHeader("X-CSRFToken", csrftoken);
      }
    }
  }

  function vote(msg_id) {
    console.debug('trying to vote');
    $.ajax(get_vote_ajax_dict(msg_id, 'PUT'))
      .done(function(){
        vote_done_callback(msg_id, 1);
      })
      .fail(vote_fail_callback);
  }

  function unvote(msg_id) {
    console.debug('trying to remove vote');
    $.ajax(get_vote_ajax_dict(msg_id, 'DELETE'))
      .done(function(){
        vote_done_callback(msg_id, -1);
      })
      .fail(vote_fail_callback);
  }

  // Binding functions
  $(function() {
    console.debug('binding vote function to btns');
    $('.email-message').each(function() {
      var msg_id = this.getAttribute('id').split('-')[1];

      $('.vote.btn-default', this).bind('click', function() {
        vote(msg_id);
      });

      $('.vote.btn-success', this).bind('click', function() {
        unvote(msg_id);
      });

    });
  });

</script>

{% endblock %}

{% block main-content %}
<div class="row">

  <div class="col-lg-12">
    <h2>{{ first_msg.subject_clean }}</h2>
    <hr />
  </div>

  <div class="col-lg-10 col-md-10 col-sm-12">
    <ul class="unstyled-list">
    {% for email in emails %}
      {% with email.from_address.user.get_absolute_url as profile_link %}
      <li>
        {% spaceless %}
        <div class="email-message" id="msg-{{ email.id }}">
          <div class="panel panel-default">
            <div class="panel-heading clearfix">
              <div class="col-lg-6 col-md-6 col-sm-6">
                {% if profile_link %}
                <a href="{{ profile_link }}">
                {% endif %}
                {% gravatar email.from_address 34 %}
                <strong class="user-fullname">{{ email.from_address.get_full_name_or_anonymous }}</strong>
                {% if profile_link %}
                </a>
                {% endif %}
              </div>

              <div class="col-lg-6 col-md-6 col-sm-6">
                <div class="pull-right text-right">
                  <span class="date">
                    {{ email.received_time|date:'DATETIME_FORMAT' }}
                  </span>

                  <div class="btn-group">
                    <button class="btn btn-default vote-count disabled">
                      {{ email.votes_count }}
                    </button>
                    {% if user in email.vote_list %}
                    <button class="btn btn-success vote" data-loading-text="...">
                    {% else %}
                    <button class="btn btn-default vote" data-loading-text="...">
                    {% endif %}
                      <span class="glyphicon glyphicon-thumbs-up"></span>
                    </button>
                  </div>
                </div>
              </div>

            </div>
            <div class="panel-body">
              <pre>{{ email.body }}</pre>
            </div>
          </div>
        </div>
      {% endspaceless %}
      </li>
      {% endwith %}
    {% endfor %}
    </ul>
  </div>

  <div class="col-lg-2 col-md-2 hidden-sm hidden-xs">
    <h4><strong>{% trans "Order by" %}:</strong></h4>
    <ul class="unstyled-list">
      <li>
        <span class="glyphicon glyphicon-chevron-right"></span>
        <a href="{% append_to_get order='voted' %}">{% trans "Votes" %}</a>
      </li>
      <li>
        <span class="glyphicon glyphicon-chevron-right"></span>
        <a href="{% append_to_get order='date' %}">{% trans "Date" %}</a>
      </li>
    </ul>

    <h4><strong>{% trans "Statistics:" %}</strong></h4>

    <ul class="unstyled-list">
      <li>
        <span class="glyphicon glyphicon-chevron-right"></span>
        {% trans "started at" %}
        <h5>{{ first_msg.received_time|timesince }} {% trans "ago" %}</h5>
      </li>

      <li>
        <span class="glyphicon glyphicon-chevron-right"></span>
        {% trans "viewed" %}
        <h5>{{ pagehits }} {% trans "times" %}</h5>
      </li>
      <li>
        <span class="glyphicon glyphicon-chevron-right"></span>
        {% trans "answered" %}
        <h5>{{ emails|length }} {% trans "times" %}</h5>
      </li>
      <li>
        <span class="glyphicon glyphicon-chevron-right"></span>
        {% trans "voted" %}
        <h5>{{ total_votes }} {% trans "times" %}</h5>
      </li>
    </ul>
  </div>

</div>
{% endblock %}