{% extends "front/front_base.html" %}

{% load i18n %}

{% load thumbnail %}

{% load front_tags %}

{% block title %}{% trans "front.home" %}{% endblock %}

{% block css_import %}

{{block.super}}

<link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/front_home.css" type="text/css"/>

{% endblock %}

{% block body %}

{{block.super}}

<!-- Last annotated contents -->

{% if tag_cloud|length > 0 %}<p class="tag_link">{% trans 'Filter the medias' %} : {% for t in tag_cloud %}<a href="{% url ldt.ldt_utils.views.front.all_contents %}?tag={{t.name}}">{{t.name}}</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>{% trans 'Last annotated medias' %}</h2></li>

	    <li class="li_right">

	        <a class="blue" href="{% url ldt.ldt_utils.views.front.all_contents %}" title="{% trans 'view all medias' %}"><img src="{{LDT_MEDIA_PREFIX}}img/little_plus.png" alt="{% trans 'view all medias' %}" />&nbsp;{% trans 'All medias' %}</a>

	    </li>

      </ul>

    </li>

    {% for content in last_contents %}

    <li class="li_media">

        <a href="{% url ldt.ldt_utils.views.front.annot_content 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>

        <p><a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}" title="{% trans 'open this media' %}"><b>{{content.title}}</b></a></p>

        <p>{% trans 'by' %} IRI | {{content.duration|str_duration:"h"}}</p>

    </li>

    {% endfor %}

</ul>

<!-- Most annotated contents -->

<ul class="floatlist" id="plus_annotes">

    <li class="li_h2">

      <ul class="title_ul">

        <li><h2>{% trans 'Most annotated medias' %}</h2></li>

        <li class="li_right">

            <a class="blue" href="{% url ldt.ldt_utils.views.front.all_contents %}" title="{% trans 'view all medias' %}"><img src="{{LDT_MEDIA_PREFIX}}img/little_plus.png" alt="{% trans 'view all medias' %}"  />&nbsp;{% trans 'All medias' %}</a>

        </li>

      </ul>

    </li>

    {% for content in most_contents %}

    <li class="li_media">

        <a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}">{% thumbnail content.image "134x75" 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>

        <p><a href="{% url ldt.ldt_utils.views.front.annot_content 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 class="font_11">{% trans 'by' %} IRI | {{content.duration|str_duration:"h"}}</p>

    </li>

    {% endfor %}

</ul>

<!-- Active groups -->

<ul class="floatlist" id="groupes_actifs">

    <li class="li_h2">

        <h2>{% trans 'Active groups' %}</h2>

    </li>

    {% for group in active_groups %}

    <li class="li_media">

        <div class="img_groupes_actifs">

            <a href="{% url ldt.ldt_utils.views.front.group_info group.id %}">{% thumbnail group.get_profile.image "54x40" format="PNG" crop="center" as im %}<img src="{{ im.url }}" class="img_media" width="{{ im.width }}" height="{{ im.height }}" alt="{% trans 'group picture' %}" title="{% trans 'view more infos on this group'%}">{% endthumbnail %}</a>

        </div>

        <div class="txt_groupes_actifs">

            <p><a href="{% url ldt.ldt_utils.views.front.group_info group.id %}" class="under" title="{% trans 'view more infos on this group'%}"><b>{{group.name}}</b></a></p>

            <p>{% if group.get_profile.description|length > 69 %}{{group.get_profile.description|safe|slice:":69"}}...{% else %}{{group.get_profile.description|safe}}{% endif %}</p>

        </div>

    </li>

    {% endfor %}

</ul>

{% endblock %}