--- a/src/metadatacomposer/static/metadatacomposer/css/styles_player.css	Thu Jun 27 12:11:33 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/css/styles_player.css	Thu Jun 27 15:11:02 2013 +0200
@@ -148,33 +148,41 @@
 }
 
 .tags {
-    position: absolute; top: 0; left: 0; width: 140px; z-index: 2; font-size: 12px; cursor: pointer;
+    position: absolute; top: 0; left: 0; width: 180px; z-index: 2; font-size: 12px;
+}
+
+.tags-title-wrap {
+    height: 40px;
+}
+
+.searching .tags-title-wrap {
+    width: 300px;
 }
 
 .tags-title {
     line-height: 40px; padding: 0 15px; font-size: 11px; color: #B8155F;
-    font-weight: 700; text-transform: uppercase;
+    font-weight: 700; text-transform: uppercase; height: 40px; cursor: pointer;
 }
 
-.tags:hover .tags-title {
-    background: #404040; color: #ffffff;
+.searching .tags-title {
+    text-transform: none; float: left; min-width: 150px; background: #ffffff;
 }
 
 .tags-list {
     background: #303030;
-    padding: 10px 0; display: none;
+    padding: 10px 0; display: none; cursor: pointer;
 }
 
 .tag {
     color: #cccccc; padding: 5px 15px;
 }
 
-.tag:hover {
-    color: #ffffff; background: #202020;
+.searching .tag {
+    color: #999999;
 }
 
 .tag.found {
-    color: #ffffff;
+    color: #ffffff; background: #202020;
 }
 
 /* Annotation colors */

Binary file src/metadatacomposer/static/metadatacomposer/img/sprites.png has changed

--- a/src/metadatacomposer/static/metadatacomposer/js/player.js	Thu Jun 27 12:11:33 2013 +0200
+++ b/src/metadatacomposer/static/metadatacomposer/js/player.js	Thu Jun 27 15:11:02 2013 +0200
@@ -85,9 +85,8 @@
         $(".tags-list").stop().slideDown();
     }).click(function() {
         if (clickedTag) {
-            $(".found").removeClass("found");
-            $(".timelines").removeClass("searching");
             clickedTag = null;
+            showTag(null);
         }
         return false;
     });
@@ -99,13 +98,15 @@
         $(".found").removeClass("found");
         var tag = myProject.getElement(tagId);
         if (tag) {
-            $(".timelines").addClass("searching");
+            $("body").addClass("searching");
+            $(".tags-title").text(tag.title);
             tag.getRelated("annotation").forEach(function(a) {
                 a.trigger("found-tags");
             });
             $(".tag[data-tag-id="+tagId+"]").addClass("found");
         } else {
-            $(".timelines").removeClass("searching");
+            $("body").removeClass("searching");
+            $(".tags-title").text("Mots-clés");
         }
         lastTag = tagId;
     }
@@ -115,11 +116,13 @@
     }, function() {
         showTag(clickedTag);
     }).click(function() {
-        if (clickedTag == lastTag) {
-            clickedTag = null
+        var tag = $(this).attr("data-tag-id");
+        if (clickedTag === tag) {
+            clickedTag = null;
         } else {
-            clickedTag = lastTag;
+            clickedTag = tag;
         }
+        showTag(clickedTag);
         return false;
     });
     
@@ -132,7 +135,8 @@
         chapterList = $(".chapters-list"),
         hoveredChapter = null,
         currentChapter = null,
-        currentChapterI = 0;
+        currentChapterI = 0,
+        slideInterval;
     
     function highlightChapter() {
         $(".chapter").removeClass("active");
@@ -327,7 +331,6 @@
             case "slideshow":
                 
                 var currentslide = 0,
-                    slideInterval,
                     playing = false,
                     loaded = false,
                     currentSlideLoaded = false,
@@ -394,7 +397,7 @@
                         return (mem && !!slide.image && !!slide.image.height);
                     }, true);
                     if (loaded) {
-                        if (annotationinfo.annotation.autostart && slides.length > 1) {
+                        if (annotationinfo.annotation.content.autostart && slides.length > 1) {
                             togglePlay();
                         }
                     }
@@ -409,8 +412,18 @@
                 checkloaded();
                 
                 if (slides.length > 1) {
-                    annotationDiv.find(".slideshow-next").click(nextImage);
+                    annotationDiv.find(".slideshow-next").click(function() {
+                        if (playing) {
+                            playing = false;
+                            togglePlay();
+                        }
+                        nextImage();
+                    });
                     annotationDiv.find(".slideshow-previous").click(function() {
+                        if (playing) {
+                            playing = false;
+                            togglePlay();
+                        }
                         currentslide = (currentslide ? currentslide : slides.length) - 1;
                         annotationDiv.find(".slideshow-image").fadeTo(400, 0, showCurrentImage);
                     });
@@ -594,7 +607,7 @@
     });
     
     function fullScreen() {
-        var isFull = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen,
+        var isFull = document.fullScreen || document.mozFullScreen || document.webkitIsFullScreen || false,
             el = document.querySelector("body"),
             requestMethods = ["requestFullScreen","mozRequestFullScreen","webkitRequestFullScreen"],
             cancelMethods = ["cancelFullScreen","mozCancelFullScreen","webkitCancelFullScreen"];
@@ -619,18 +632,9 @@
     $(".full-screen").click(fullScreen);
     $(".top-bar").dblclick(fullScreen);
     
-    var fsel = document.querySelector("body"),
-        fsRequestMethods = ["requestFullScreen","mozRequestFullScreen","webkitRequestFullScreen"],
-        fsCapable = false;
-        
-    for (var i = 0; i < fsRequestMethods.length; i++) {
-        if (typeof fsel[fsRequestMethods[i]] === "function") {
-            fsCapable = true;
-            break;
-        }
-    }
-    
-    if (!fsCapable) {
+    if ( typeof document.fullScreen === "undefined"
+        && typeof document.mozFullScreen === "undefined"
+        && typeof document.webkitIsFullScreen === "undefined") {
         $(".full-screen").remove();
     }
             
@@ -642,6 +646,7 @@
     });
    
     function closeAnnotation(e) {
+        clearInterval(slideInterval);
         currentAnnotation = null;
         $(".chip, .pictolist li").removeClass("current");
         $(".timelines").removeClass("annotation-onscreen");

--- a/src/metadatacomposer/templates/partial/metadatacomposer_partial_player.html	Thu Jun 27 12:11:33 2013 +0200
+++ b/src/metadatacomposer/templates/partial/metadatacomposer_partial_player.html	Thu Jun 27 15:11:02 2013 +0200
@@ -2,7 +2,9 @@
 {% load absurl %}
         <div class="top-bar">
             <div class="tags">
-                <h3 class="tags-title">Tags</h3>
+                <div class="tags-title-wrap">
+                    <h3 class="tags-title">Mots-clés</h3>
+                </div>
                 <ul class="tags-list"></ul>
             </div>
             <span class="topright-buttons">