Building the YouTube player page
This page will incorporate a YouTube player with a loaded playlist. We'll be using the controls.html
web page to emit actions on the animations, and this page will answer to some of these actions. As with the controls page, we'll need to use the Socket.IO client.
Note
For the YouTube player, we will be using their IFrame API (https://developers.google.com/youtube/iframe_api_reference).
Create a new file under the chapter7
folder using the vi youtubePlayer.html
command and paste the following code:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Music Video</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.5/socket.io.min.js"></script> </head> <body> <div id="player"></div> <script> ...