--- a/src/spel/static/spel/css/spel.css	Fri Mar 21 15:21:15 2014 +0100
+++ b/src/spel/static/spel/css/spel.css	Mon Mar 24 12:31:25 2014 +0100
@@ -68,6 +68,12 @@
 .multiline{
 	white-space: normal;
 }
+th.popinfo{
+	min-width: 45px;
+}
+span.popinfo{
+    cursor: pointer;
+}
 .info{
     padding-left: 5px;
     padding-right: 5px;

--- a/src/spel/static/spel/js/spectacle.js	Fri Mar 21 15:21:15 2014 +0100
+++ b/src/spel/static/spel/js/spectacle.js	Mon Mar 24 12:31:25 2014 +0100
@@ -276,7 +276,7 @@
 		}
 		$("#btn-filter-annotations").click();
 		// manage when nothing is selected
-		if($(".annot-tag-list").children().length==0){
+		if($(".annot-tag-list").children().length==0 && $(".annotation-results .info").length==0){
 			$(".annotation-results").html('');
 		}
 	});
@@ -340,6 +340,7 @@
 				csrfmiddlewaretoken: csrf_token
 			}, 
 			function( html ) {
+				$("#search-input").val("   "); // trick to simply enable filter annotations
 				$(".annotation-results").removeClass("loader");
 				$(".annotation-results").html(html);
 			}
@@ -349,5 +350,50 @@
 			$(".annotation-results").html('<p class="bg-danger">Erreur de chargement</p>');
 		});
 	});
-
+	
+	// Filter chapter to annotations
+	$(".chapter-results").on("click", ".filter-chapter-annot", function(){
+		var $tr = $(this).parent().parent();
+		// green line or not
+		($(this).prop('checked')==true) ? $tr.addClass("success") : $tr.removeClass("success");
+		filterAnnotationsWithChapters();
+	});
+	
+	function filterAnnotationsWithChapters(){
+		// Remove all childs but the searched-term one
+		if($(".annot-tag-list").children().first().children().first().hasClass("glyphicon-search")){
+			$(".annot-tag-list").find("li:gt(0)").remove();
+		}
+		else{
+			$(".annot-tag-list").children().remove();
+		}
+		// We build the the array of content ids and timecodes
+		var id_tc = {};
+		$(".chapter-results input[type=checkbox]:checked").each(function(index){
+			var $tr = $(this).parent().parent();
+			var iri_id = $tr.attr("data-content");
+			if(!(iri_id in id_tc)){
+				id_tc[iri_id] = [];
+			}
+			id_tc[iri_id].push({ start: parseInt($tr.attr("data-start")), end: parseInt($tr.attr("data-end")) }); 
+		});
+		$('.annotation-results > div.searched-annot').each(function(index){
+			// annot in timecode and content ?
+			var show = true;
+			var iri_id = $(this).attr("data-content");
+			if(iri_id in id_tc){
+				show = true;
+			}
+			else{
+				show = false;
+			}
+			show ? $(this).show() : $(this).hide();
+		});
+		
+		if($(".chapter-results input[type=checkbox]:checked").length==0){
+			$('.annotation-results > div.searched-annot').show();
+		}
+		// Update number displayed
+		$(".nb-annotations-found").html($('.annotation-results > div.searched-annot:visible').length);
+	}
 });

--- a/src/spel/templates/partial/spel_chapters.html	Fri Mar 21 15:21:15 2014 +0100
+++ b/src/spel/templates/partial/spel_chapters.html	Mon Mar 24 12:31:25 2014 +0100
@@ -21,15 +21,16 @@
 </div>
 <table class="table table-striped table-condensed tablesorter">
     <thead>
-        <tr><th>Type</th><th>Ref texte</th><th>Titre de la vidéo</th><th>&nbsp;</th></tr>
+        <tr><th>Type</th><th>Ref texte</th><th>Titre de la vidéo</th><th class="popinfo">&nbsp;</th></tr>
     </thead>
     <tbody>
   {% for s in segments %}
     <tr class="chapter-data" data-content="{{ s.iri_id }}" data-start="{{ s.start_ts }}" data-end="{{ s.start_ts|add:s.duration }}">
-        <td>{{ s.cutting_id }}</td><td>{{ s.tags|get_tags:"ref_text"|join:', ' }}</td><td>{% if annot_chapters %}{{ s.ct }}{% else %}{{ s.content.title }}{% endif %}</td>
+        <td title="{{ s.cutting_id }}">{{ s.cutting_id|slice:":1"|upper }}</td><td>{{ s.tags|get_tags:"ref_text"|join:', ' }}</td><td>{% if annot_chapters %}{{ s.ct }}{% else %}{{ s.content.title }}{% endif %}</td>
         <td>
-          <button type="button" class="popinfo btn btn-xs btn-default" data-trigger="hover" data-container="body" data-toggle="popover" data-placement="auto" 
-                  data-content="<strong>Timecodes:</strong> {{ s.start_ts|str_duration }} - {{ s.start_ts|add:s.duration|str_duration }}<br/>{{ s.tags|get_tags:'group'|safe }}"><span class="glyphicon glyphicon-plus-sign"></span></button>
+          <span class="glyphicon glyphicon-plus-sign popinfo" data-trigger="hover" data-container="body" data-toggle="popover" data-placement="auto" 
+                  data-content="<strong>Timecodes:</strong> {{ s.start_ts|str_duration }} - {{ s.start_ts|add:s.duration|str_duration }}<br/>{{ s.tags|get_tags:'group'|safe }}"></span>
+          <input type="checkbox" class="filter-chapter-annot" />
         </td>
     </tr>
   {% endfor %}