added play/pause function

public/index.html

@@ -16,7 +16,7 @@
 
         </div>
 		<button onclick="slideBack()"><</button>
-		<span id="indexSlide"></span>
+		<button id="playSlide" data-intervalid="-1"onclick="slidePlay()">PLAY/PAUSE</button>
 		<button onclick="slideForward()">></button>
 	</div>
     <div id="leaderBoard" class="">

public/scripts/functions.js

@@ -142,12 +142,29 @@ function slideForward(){
 	var actualId = actual.id.split("_")[1];
 	if(actualId < document.getElementsByClassName("canvasRendered").length - 1){
 		actualId++;
-		actual.className = " canvasRendered";
-		document.getElementById("canvas_"+actualId).className += " visible";
+		
+	}else{
+		actualId = 0;
 	}
+	actual.className = " canvasRendered";
+	document.getElementById("canvas_"+actualId).className += " visible";
 	updateLabels(document.getElementById("canvas_"+actualId));
 }
+function slidePlay(){
+	var play = document.getElementById("playSlide");
+
+	if( play.getAttribute("data-intervalId") == "-1"){
+		var intervalID = setInterval( function(){
+			slideForward();
+		}, 500);
+		play.setAttribute('data-intervalId', intervalID);	
+	}else{
+		var intervalID = play.getAttribute("data-intervalId");
+		clearInterval( intervalID );
+		play.setAttribute('data-intervalId', "-1");	
 
+	}
+}
 function hasClass(el, cls) {
   return el.className && new RegExp("(\\s|^)" + cls + "(\\s|$)").test(el.className);
 }
@@ -212,7 +229,7 @@ function updateLeaderBoard(){
 	var intervalID = setInterval( function(){
 		loadRankingJs('https://davar.icfpcontest.org/rankings.js?cachebuster='+ new Date().getTime());
 	}, 30000);
-
+	console.dir(intervalID);
 }
 function loadRankingJs(scriptName) {
 	var rankingScript = document.getElementById("rankingScript");