{"id":22496,"date":"2016-06-05T03:01:54","date_gmt":"2016-06-04T17:01:54","guid":{"rendered":"http:\/\/www.rjmprogramming.com.au\/ITblog\/?p=22496"},"modified":"2016-06-05T10:13:11","modified_gmt":"2016-06-05T00:13:11","slug":"youtube-api-video-synchronizing-tutorial","status":"publish","type":"post","link":"https:\/\/www.rjmprogramming.com.au\/ITblog\/youtube-api-video-synchronizing-tutorial\/","title":{"rendered":"YouTube API Video Synchronizing Tutorial"},"content":{"rendered":"
\"YouTube<\/a>

YouTube API Video Synchronizing Tutorial<\/p><\/div>\n

YouTube<\/a> is a very well known, and the most popular video watching website on the “net”, owned by Google<\/a>, and yesterday we started on a quest to do some work with the great YouTube API for Iframe embedded videos<\/a> when we presented YouTube API Start and Stop Primer Tutorial<\/a> as shown below.<\/p>\n

We are not alone on this quest, we are sure, and today we use the API to sequence YouTube videos by adding to yesterday’s functionality with …<\/p>\n

    \n
  1. use of an HTML form<\/a> element (method=GET<\/i> action=.\/stop_start_youtube.htm<\/i> target=_self<\/i>) to collect follow up YouTube video ids the user wants to play<\/li>\n
  2. catering for the user pausing the video, a practicality that could help give the user time to enter large numbers of follow up video … binge<\/i><\/a> anyone?!<\/li>\n<\/ol>\n

    The method=GET<\/i> is fine because …<\/p>\n

      \n
    1. YouTube video ids are quite short and so many can be stored in a URL without overshooting the web server length limits here … and that means …<\/li>\n
    2. method=GET<\/i> ensures all information is contained in document.URL<\/i> and entirely processed by Javascript client methodologies without the method=POST<\/i> complications of involving a serverside program like PHP in this web application’s architecture<\/li>\n<\/ol>\n

      The action=.\/stop_start_youtube.htm<\/i> target=_self<\/i> combination means that the change of video becomes pretty seamless, into the same original webpage of interest, using the same original HTML and Javascript codebase of interest.<\/p>\n

      And so the mechanism for making use of this optional video synchronizing, or sequencing, functionality is to answer the video duration question with a negative number reflecting the total number of videos to play, so, again, nothing radical has changed with the look of the web application as it starts as yesterday’s functionality is still pushed as the default functionality ideas of use.<\/p>\n

      Here’s the HTML and Javascript code you could call stop_start_youtube.htm<\/a>, changed from yesterday in this way<\/a> with its live run<\/a> link for you to try this out yourself.<\/p>\n

      \n

      Previous relevant YouTube API Start and Stop Primer Tutorial<\/a> is shown below.<\/p>\n

      \"YouTube<\/a>

      YouTube API Start and Stop Primer Tutorial<\/p><\/div>\n

      YouTube<\/a> is a very well known, and the most popular video watching website on the “net”.<\/p>\n

      It is no surprise that programmers and developers everywhere are interested in interfacing to it. We interface to it today, just purely with client side HTML and Javascript and the wonderful YouTube API for Iframe embedded videos<\/a> reference website, the information for which we got directed to via this useful link<\/a> … so thanks, everybody.<\/p>\n

      Using the YouTube API means you’ve got access to information, such as …<\/p>\n