--- a/cms/app-client/app/components/playlist-component.js	Fri Aug 05 14:55:45 2016 +0200
+++ b/cms/app-client/app/components/playlist-component.js	Fri Aug 05 15:06:06 2016 +0200
@@ -54,6 +54,10 @@
 
     actions: {
 
+        select: function(id) {
+            this.get('player').select(id);
+        },
+
         play: function(id) {
             this.get('player').play(id);
         },

--- a/cms/app-client/app/services/player.js	Fri Aug 05 14:55:45 2016 +0200
+++ b/cms/app-client/app/services/player.js	Fri Aug 05 15:06:06 2016 +0200
@@ -27,8 +27,12 @@
         this.set('progress', time);
     },
 
+    select: function (id) {
+        this.set('item', id);
+    },
+
     play: function(id) {
-        this.set('item', id);
+        this.select(id);
         this.set('playing', true);
     },
 

--- a/cms/app-client/app/styles/components/playlist-component.scss	Fri Aug 05 14:55:45 2016 +0200
+++ b/cms/app-client/app/styles/components/playlist-component.scss	Fri Aug 05 15:06:06 2016 +0200
@@ -28,10 +28,16 @@
     color: $dark-grey;
 }
 
+.playlist-component ul li:not(.playing) {
+    cursor: pointer;
+
+}
+
 .playlist-component ul li.playing {
     background-color: $light-blue;
     border-bottom-color: $medium-blue;
     color: $medium-blue;
+    pointer-events: none;
 }
 
 .playlist-component ul li.notice {

--- a/cms/app-client/app/templates/components/playlist-component.hbs	Fri Aug 05 14:55:45 2016 +0200
+++ b/cms/app-client/app/templates/components/playlist-component.hbs	Fri Aug 05 15:06:06 2016 +0200
@@ -1,7 +1,7 @@
 <h2>Résultat <span class="count">({{ documents.length }})</span></h2>
 <ul>
     {{#each documents as |document| }}
-    <li id="{{document.id}}" class="{{if (eq player.item document.id) 'playing'}}{{if (eq document.id notice) 'notice'}}">
+    <li id="{{document.id}}" class="{{if (eq player.item document.id) 'playing'}}{{if (eq document.id notice) 'notice'}}" {{action 'select' document.id}}>
 
         <div class="tools">
             <span class="time">