Code Example: Video Playback
This application allows the user to scroll through and select a video to play from an array of remotely accessed videos.
There are two key portions of the code: video playback and video selection. First, all videos are loaded into an array in the config file.
This information is later parsed into a button, which will contain all of that video’s display information. This will eventually be located in the right info panel on the page, and used to load the video from the external source.
In order to play a new movie, the user will need to select the correct button associated with it. The user controls one activeElement button, which when ‘Enter’ is pressed, will load that movie onto the page. This is done using the following function. Note that this will load the video into the “video0” element.
The slider bar is handled mainly through WebKit transformations. A keypress eventListener is used to determine which direction the activeElement will shift to. All of the border glowing and scaling is done in the styles.css.