{% extends "front/front_base.html" %}
{% load i18n %}
{% load thumbnail %}
{% load front_tags %}
{% load static %}

{% block title %}
{% if tag_label %}
{% blocktrans %}Lignes de temps : {{tag_label}}{% endblocktrans %}
{% else %}
{% trans "Lignes de temps : all medias" %}
{% endif %}
{% endblock %}

{% block js_import %}
{{block.super}}
<script src='{% static "ldt/js/raphael.js" %}' type="text/javascript"></script>
<script src='{% static "ldt/js/Ldt_front_sparkline.js" %}' type="text/javascript"></script>
{% endblock %}

{% block css_import %}
{{block.super}}
<link rel="stylesheet" href='{% static "ldt/css/front_home.css" %}' type="text/css"/>
{% endblock %}

{% block js_declaration %}
{{block.super}}
<script type="text/javascript">
    $(document).ready(function () {
        $("#home_tag_cloud").toggle(false);
        $("#hide_tag_cloud").toggle(false);
        $("#show_tag_cloud").toggle(true);
        $("#tag_cloud_link").click(function(){
            $("#home_tag_cloud").slideToggle("fast");
            $("#hide_tag_cloud").toggle();
            $("#show_tag_cloud").toggle();         
        });
    });
</script> 
{% endblock %}

{% block body %}
{{block.super}}
<!-- Last annotated contents -->
{% if front_tags|length > 0 %}<p class="tag_link">{% trans 'Filter the medias by category' %} : {% for t in front_tags %}<a href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?tag={{t}}">{{t}}</a>{% if not forloop.last %}, {% endif %}{% endfor %}</p>{% endif %}
<ul class="floatlist full_width" id="derniers_medias">
    <li class="li_h2">
      <ul class="title_ul">
        <li><h2>
        {% if tag_label %}<a href="{% url 'ldt.ldt_utils.views.front.all_contents' %}">{% trans 'All medias' %}</a>{% if tag_label %}<span class="pink"> &gt; {{tag_label}}</span>{% endif %}
        {% elif media_title %}<a href="{% url 'ldt.ldt_utils.views.front.all_contents' %}">{% trans 'All medias' %}</a>{% if media_title %}<span class="pink"> &gt; "{{media_title}}"</span>{% endif %}
        {% else %}{% trans 'All medias' %}{% endif %}</h2>
        </li>
        <li class="li_right">
          <span class="tag_link"><a href="#" id="tag_cloud_link" title="{% trans 'Filter the medias' %}"><img id="hide_tag_cloud" src='{% static "ldt/img/little_minus_pink.png" %}' alt="{% trans 'Filter the medias' %}" /><img id="show_tag_cloud" src='{% static "ldt/img/little_plus_pink.png" %}' alt="{% trans 'Filter the medias' %}" />&nbsp;{% trans 'Filter the medias' %}</a></span>
        </li>
      </ul>
    </li>
    <li class="li_h2" id="home_tag_cloud">
      <form id="media_search" method="GET" action="">
        {% trans 'Search in the medias title' %} : 
        <input id="input_media_title" type="text" name="title"> <input id="search_media_title" type="submit" value=""/>
      </form>
    {% if tag_cloud|length > 0 %}<p class="left tag_link">{% trans 'All categories of medias' %} : {% for t in tag_cloud %}<a href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?tag={{t.name}}">
      <span style="font-size:{{t.font_size|add:"12"}}px;">{{t.name}}</span></a>{% if not forloop.last %}, {% endif %}{% endfor %}</p>
    {% endif %}
    </li>
      <!-- Pagination -->
        <li id="result_pagination" class="li_h2">
            <p>
            {% if results.has_previous %}
                <a class="blue under" href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?page={{ results.previous_page_number }}{% if tag_label %}&tag={{tag_label}}{% endif %}{% if media_title %}&title={{media_title}}{% endif %}" title="{% trans 'previous' %}">{% trans "previous" %}</a>
            {% endif %}
            {% if results.paginator.num_pages > 1 %}
            <span class="current">
                {% for i in results.paginator.num_pages|get_range %}
                <span class="current">
                    {% if i|add:'1' == results.number %}
                    <span class="pink">{{i|add:'1'}}</span>
                    {% else %}
                    <a class="blue under" href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?page={{i|add:'1'}}{% if tag_label %}&tag={{tag_label}}{% endif %}{% if media_title %}&title={{media_title}}{% endif %}">{{i|add:'1'}}</a>
                    {% endif %}
                    {% if i|add:'1' < results.paginator.num_pages and 1 < results.paginator.num_pages %}
                    {% endif %}
                </span>
                {% endfor %}
            </span>
            {% endif %}
            {% if results.has_next %}
                <a class="blue under" href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?page={{ results.next_page_number }}{% if tag_label %}&tag={{tag_label}}{% endif %}{% if media_title %}&title={{media_title}}{% endif %}" title="{% trans 'next' %}">{% trans "next" %}</a>
            {% endif %}
            {% if results.paginator.num_pages > 1 %}
                . <a class="blue under" href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?page=x{% if tag_label %}&tag={{tag_label}}{% endif %}{% if media_title %}&title={{media_title}}{% endif %}"">({% trans 'All' %})</a>
            {% endif %}
            </p>
        </li>
      <!-- Fin Pagination -->
    {% for content in results.object_list %}
    <li class="li_media">
        <div class="img_and_overlay">
            <a href="{% url 'ldt.ldt_utils.views.front.annot_content' content_iri_id=content.iri_id %}">
                {% thumbnail content.image "294x165" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}" alt="{% trans 'open this media' %}" title="{% trans 'open this media' %}">{% endthumbnail %}
            </a>
            <div class="overlay">
                <ul class="polemics">
                    <li class="pol-negative" style="width:{{content.pol_negative_rate}}%"><span>{{content.pol_negative_rate}}%</span></li>
                    <li class="pol-positive" style="width:{{content.pol_positive_rate}}%"><span>{{content.pol_positive_rate}}%</span></li>
                    <!-- <li class="pol-reference" style="width:{{content.pol_reference_rate}}%"><span>{{content.pol_reference_rate}}%</span></li>
                    <li class="pol-question" style="width:{{content.pol_question_rate}}%"><span>{{content.pol_question_rate}}%</span></li> -->
                </ul>
                <span class="graph_annotation" id="sp_{{ content.iri_id }}">{{ content.annotation_volume|list2str }}</span>
            </div>
        </div>
        <div class="bulle_annot" title="{% blocktrans count nb=content.nb_annotations %}{{nb}} annotation on this media{% plural %}{{nb}} annotations on this media{% endblocktrans %}">{{ content.nb_annotations }}</div>
        <p><a href="{% url 'ldt.ldt_utils.views.front.annot_content' content_iri_id=content.iri_id %}" title="{% trans 'open this media' %}" ><b>{% if content.title|length > 69 %}{{content.title|slice:":69"}}...{% else %}{{content.title}}{% endif %}</b></a></p>
        <p>{% trans 'by' %} IRI | {{content.duration|str_duration:"h"}}</p>
    </li>
    {% endfor %}
</ul>
{% if tag_cloud|length > 0 %}<p class="left tag_link">{% trans 'All categories of medias' %} : {% for t in tag_cloud %}<a href="{% url 'ldt.ldt_utils.views.front.all_contents' %}?tag={{t.name}}">
  <span style="font-size:{{t.font_size|add:"12"}}px;">{{t.name}}</span>
  </a>{% if not forloop.last %}, {% endif %}{% endfor %}</p>
{% endif %}
{% endblock %}