From 4cd6b830a99d00dc9fc4cc8b9bb7e8c108e36ede Mon Sep 17 00:00:00 2001
From: Klafyvel <klafyvel@gmail.com>
Date: Wed, 28 Mar 2018 17:54:07 +0200
Subject: [PATCH] =?UTF-8?q?Fix=20de=20la=20s=C3=A9lection=20au=20click?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 player/templates/player/playlist.html |  4 ++--
 static_files/js/playlist.js           | 11 ++++++-----
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/player/templates/player/playlist.html b/player/templates/player/playlist.html
index c80e4f3..740e180 100644
--- a/player/templates/player/playlist.html
+++ b/player/templates/player/playlist.html
@@ -57,7 +57,7 @@
 			<h2>Pistes à venir</h2>
 			<div id="links">
 			{% for link in playlist.link_set.all %}
-			<div class="card bg-secondary text-white" onclick="setCurrentFromToken('{{link.token}}');" id="{{link.token}}">
+			<div class="card bg-secondary text-white" onclick="setCurrent(parseInt(this.id));" id="{{ forloop.counter0 }}">
 				<div class="card-body">
 					<div class="row container">
                         <div class="col-md-6" >
@@ -79,7 +79,7 @@
 			</div>
 		</div>
 	</div>
-	<div style="display:none;" class="card bg-secondary text-white" id="link_template">
+	<div style="display:none;" onclick="setCurrent(parseInt(this.id));" class="card bg-secondary text-white" id="link_template">
 				<div class="card-body">
 					<div class="row container">
 					<div class="col-md-6">
diff --git a/static_files/js/playlist.js b/static_files/js/playlist.js
index b321f63..8c9bb8d 100644
--- a/static_files/js/playlist.js
+++ b/static_files/js/playlist.js
@@ -30,8 +30,8 @@ function onPlayerReady(event) {
 function play() {
       player.loadVideoById(tracks[current_link]);
       player.playVideo();
-      document.getElementById(tracks[current_link]).classList.add('bg-success');
-      document.getElementById(tracks[current_link]).classList.remove('bg-secondary');
+      document.getElementById(current_link).classList.add('bg-success');
+      document.getElementById(current_link).classList.remove('bg-secondary');
 }
 function next() {
 	if (current_link < (tracks.length -1)) {
@@ -49,13 +49,15 @@ function prev() {
 
 function setCurrent(c) {
     if(c > 0 && c < tracks.length) {
+		document.getElementById(current_link).classList.remove('bg-success');
+		document.getElementById(current_link).classList.add('bg-secondary');
         current_link = c;
         play();
     }
 }
 
 function setCurrentFromToken(token) {
-    setCurrent(tracks.indexOf(token));
+    setCurrent(tracks.lastIndexOf(token));
 }
 
 function onPlayerStateChange(event) {
@@ -96,8 +98,7 @@ function updateLinks(data) {
 		tracks.push(token);
 		var card = model.cloneNode(true);
 		card.style.display = 'block';
-		card.id = token;
-        card.onclick = function(){setCurrent(this.id);};
+		card.id = i.toString();
 		card.getElementsByClassName('link_name')[0].innerHTML = token;
         if (i==current_link) {
             card.classList.add('bg-success');