boutons next/prev

player/templates/player/playlist.html

@@ -19,7 +19,21 @@
 	</div>
 	<div class="row" style="height:100%">
 		<div class="col-md-6">
+			<div class="row">
+				<div class="col-md-10">
 					<h2>Lecture</h2>
+				</div>
+				<div class="col-md-2">
+					<div class="btn-group">
+						<a class="btn btn-outline-dark" role="button" onclick="prev();">
+							<i class="fas fa-step-backward"></i>
+						</a>
+						<a class="btn btn-outline-dark" role="button" onclick="next();">
+							<i class="fas fa-step-forward"></i>
+						</a>
+					</div>
+				</div>
+			</div>
 			<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
 			<div id="player" style="max-width:100%"></div>
 			<form onSubmit="return addLink();" class="form" id="add_link_form">
@@ -64,6 +78,22 @@ function onPlayerReady(event) {
   setInterval(loadLinks, 5000);
 }
 
+function next() {
+	if (current_link < (tracks.length -1)) {
+      current_link += 1
+      player.loadVideoById(tracks[current_link]);
+      event.target.playVideo();
+	}
+}
+
+function prev() {
+	if (current_link > 0) {
+      current_link -= 1
+      player.loadVideoById(tracks[current_link]);
+      event.target.playVideo();
+	}
+}
+
 function onPlayerStateChange(event) {
   if (event.data == YT.PlayerState.ENDED) {
 	onPlayerReady();