--- a/src/ldt/ldt/ldt_utils/templates/front/front_all_contents.html	Thu Jan 12 16:25:13 2012 +0100
+++ b/src/ldt/ldt/ldt_utils/templates/front/front_all_contents.html	Thu Jan 12 17:52:54 2012 +0100
@@ -5,11 +5,37 @@
 
 {% block title %}Lignes de temps : groupe "{{group.name}}"{% endblock %}
 
+{% block js_import %}
+{{block.super}}
+<script src="{{LDT_MEDIA_PREFIX}}js/jquery.min.js" type="text/javascript"/></script>
+<script src="{{LDT_MEDIA_PREFIX}}js/jquery.sparkline.min.js" type="text/javascript"/></script>
+{% endblock %}
+
 {% block css_import %}
 {{block.super}}
 <link rel="stylesheet" href="{{LDT_MEDIA_PREFIX}}css/front_home.css" type="text/css"/>
 {% endblock %}
 
+{% block js_declaration %}
+{{block.super}}
+<script type="text/javascript">
+    $(document).ready(function () {
+        // We draw the annotation volume for each content
+        /* Use 'html' instead of an array of values to pass options 
+        to a sparkline with data in the tag */
+        $('.graph_annotation').sparkline('html', {width: '293px',
+                                                  height:'20px',
+                                                  minSpotColor: false,
+                                                  maxSpotColor: false,
+                                                  spotColor: false,
+                                                  lineWidth: '0px',
+                                                  fillColor: '#adadad',
+                                                  lineColor: '#adadad'});
+    });
+</script>
+
+{% endblock %}
+
 {% block body %}
 {{block.super}}
 <!-- Last annotated contents -->
@@ -19,7 +45,8 @@
     </li>
     {% for content in content_list %}
     <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 }}">{% endthumbnail %}</a>
+        <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 }}">{% endthumbnail %}
+        <span class="graph_annotation">{{ content.stat_annotation }}</span></a>
         <div class="bulle_annot">{{ content.nb_annotation }}</div>
         <p><a href="{% url ldt.ldt_utils.views.front.annot_content content.iri_id %}"><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>

--- a/src/ldt/ldt/static/ldt/css/front_home.css	Thu Jan 12 16:25:13 2012 +0100
+++ b/src/ldt/ldt/static/ldt/css/front_home.css	Thu Jan 12 17:52:54 2012 +0100
@@ -21,6 +21,9 @@
 .title_ul {
     list-style: none;
 }
+.graph_annotation {
+    background: url(./imgs/whitealpha.png); margin:148px -297px; position:absolute;
+}
 
 /* Plus annotés */
 

Binary file src/ldt/ldt/static/ldt/css/imgs/whitealpha.png has changed

Binary file src/ldt/ldt/static/ldt/img/little_plus.png has changed