{% extends "three-column-content.html" %}
{% block three_col_media %}
  {% include "blog/media-css.html" %}
  <style>
    .no-clarifications-message {
      font-style: italic;
      text-align: center;
    }

    .org-logo {
      height: 2em;
      width: 2em;
      margin-right: 0.5em;
    }

    .organization-row:last-child {
      border-bottom: none;
    }
  </style>
{% endblock %}

{% block js_media %}
  {% include "actionbar/media-js.html" %}
  {% include "feed/feed_js.html" %}
  <script type="text/javascript">
    $(document).ready(function () {
      $('.time-remaining').each(function () {
        count_down($(this));
      });

      $('.right-sidebar').hide();
      $('#event-tab').click(function (e) {
        e.preventDefault();
        $('.left-sidebar-item').removeClass('active');
        $('#event-tab').addClass('active');
        $('.middle-content').hide();
        $('.right-sidebar').show();
      });
    });
  </script>
{% endblock %}

{% block left_sidebar %}
  <div class="left-sidebar">
    {{ make_tab_item('blog', 'fa fa-rss', url('home'), _('News')) }}
    {{ make_tab_item('comment', 'fa fa-comments', url('comment_feed'), _('Comment')) }}
    {{ make_tab_item('ticket', 'fa fa-question-circle', url('ticket_feed'), _('Ticket')) }}
    {{ make_tab_item('event', 'fa fa-calendar', '#', _('Events')) }}
  </div>
{% endblock %}

{% block middle_content %}
  {% set show_organization_private_icon=True %}
  {% if page_type == 'blog' %}
    {% include "blog/content.html" %}
  {% elif page_type == 'ticket' %}
    {% if tickets %}
      {% include "ticket/feed.html" %}
    {% else %}
      <h3 style="text-align: center">{{_('You have no ticket')}}</h3>
    {% endif %}
  {% elif page_type == 'comment' %}
    {% include "comments/feed.html" %}
  {% endif %}
{% endblock %}

{% block right_sidebar %}
  <div class="right-sidebar">
    {% if request.in_contest_mode and request.participation.contest.use_clarifications %}
      <div class="blog-sidebox sidebox">
        <h3>
          <i class="fa fa-question-circle"></i>
          {{ _('Clarifications') }}
          {% if can_edit_contest %}
            <a href="{{url('new_contest_clarification', request.participation.contest.key)}}"
              class="fa fa-plus-circle"
              id="add-clarification"
              title="{{_('Add')}}"
              style="color: lightcyan; margin-left: auto;">
            </a>
          {% endif %}
        </h3>
        <div class="sidebox-content">
          {% if has_clarifications %}
            <ul>
              {% for clarification in clarifications %}
                <li class="clarification">
                  <a href="{{ url('problem_detail', clarification.problem.problem.code) }}"
                    class="problem">
                    {{ clarification.problem.problem.name }}
                  </a>
                  <span class="time">{{ relative_time(clarification.date) }}</span>
                </li>
              {% endfor %}
            </ul>
          {% else %}
            <p class="no-clarifications-message">
              {{ _('No clarifications have been made at this time.') }}
            </p>
          {% endif %}
        </div>
      </div>
    {% endif %}
    {% include 'profile-table.html' %}
    {% include 'contests-countdown.html' %}
    {% include 'top-users.html' %}
    {% include 'recent-organization.html' %}
  </div>
{% endblock %}