Working version YoutubePlayer

3 files changed, 32 insertions, 5 deletions

diff --git a/app/index.html b/app/index.html
index 8bb6176..905840a 100644
--- a/app/index.html
+++ b/app/index.html
@@ -45,6 +45,12 @@
                     <li data-ng-repeat="song in playseq | filter:{selected:true}">{{song.label}}</li> 
                 </ul>
               </fieldset>
+              
+               <iframe id="ytplayer" type="text/html" width="640" height="360"
+src="https://www.youtube.com/embed/M7lc1UVf-VE?autoplay=1&modestbranding=1"
+frameborder="0" allowfullscreen></iframe>
+
+
         </div>
         <div id="column-middle">
         <div class="world">
diff --git a/app/js/yt_musicsearch.js b/app/js/yt_musicsearch.js
index fcc52db..82ad741 100644
--- a/app/js/yt_musicsearch.js
+++ b/app/js/yt_musicsearch.js
@@ -18,12 +18,22 @@ function searchClicked()
             document.documentElement.firstChild.appendChild(script);
         }
 
-
-		function newMusic(id)
+		
+		var musicTimer;
+		
+		function startSongWithDuration(id, duration)
 		{
 			$('#ytplayer').attr('src', 'https://www.youtube.com/embed/'+id+'?autoplay=1&modestbranding=1');
+			console.log("Starting music "+id+", timer="+duration);
+			musicTimer = setInterval(changeSong, duration * 1000);
 		}
-
+		
+		function changeSong()
+		{
+			alert("Done");
+			clearInterval(musicTimer);
+		}
+		
         function getAllMatchingIds(data)
         {
             var feed = data.feed;
@@ -44,7 +54,7 @@ function searchClicked()
             for (var i = 0; i < results.length; i++)
             {
                 //html.push('<li>', '<img src="http://img.youtube.com/vi/', results[i].id, '/2.jpg" /><a href="#" onclick="newMusic(\'', results[i].id ,'\')">', results[i].title, '</a>(', results[i].duration, ')', '</li>');
-                html.push('<li>', '<a href="#" onclick="newMusic(\'', results[i].id ,'\')">', results[i].title, '</a>', '</li>');
+                html.push('<li>', '<a href="#" onclick="startSongWithDuration(\'', results[i].id ,'\', '+results[i].duration +')">', results[i].title, '</a>', '</li>');
             }
             html.push('</ul>');
             document.getElementById('videoResultsDiv').innerHTML = html.join('');
diff --git a/videosearch_n_play.html b/videosearch_n_play.html
index 8a8f854..fb58843 100644
--- a/videosearch_n_play.html
+++ b/videosearch_n_play.html
@@ -31,9 +31,18 @@
         }
 
 
-		function newMusic(id)
+		var songFinished;
+		function newMusic(id, duration)
 		{
 			$('#ytplayer').attr('src', 'https://www.youtube.com/embed/'+id+'?autoplay=1&modestbranding=1');
+		 	songFinished = setTimer(nextSong, duration * 1000);
+			console.log("Setting timer for "+duration+" seconds");
+		}
+		
+		function nextSong()
+		{
+			clearTimer(songFinished);
+			console.log("Bingo !");
 		}
 
         function getAllMatchingIds(data)
@@ -60,6 +69,8 @@
             html.push('</ul>');
             document.getElementById('videoResultsDiv').innerHTML = html.join('');
         }
+		
+		
 
     </script>