BBB

NFB HTML 5 Video Player

Sample Project -- This is a template only!

Project Description

The National Film Board of Canada is an agency of the Ministry of Canadian Heritage, and has been using Flash web technology to provide free viewings of their films online since January 2009. Inspired by Popcorn.js they are looking to develop a video player using HTML5 and JavaScript. Extending on the basic video capabilities of play/pause/stop/volume, this player will be skinnable for consistent viewing across web browsers, and a large focus will be placed on accessibility in the form of subtitles and screen reader compatibility as well as social networking interaction. Complete information can be seen at the NFB's developer centre.

Project Leader(s)

• Steven Weerdenburg
• Kevin Lasconia

Project Contributor(s)

Name(s) of people casually working on the project, or who have contributed significant help. Include links to personal pages within wiki

NOTE: only Project Leader(s) should add names here. You can’t add your own name to the Contributor list.

Project Details

Below is a listing of project details copied from the NFB Developer Centre.

Core Fuctionality

• Play/Pause/Stop
• Variable Volume/Mute
• Seeking, visible time codes, total duration
• Flash fallback if HTML5 is not fully supported
• Player resizing, ability for fullscreen
• Multiple codec support (mp4/h264, vp6), browser dependant?
• Completely customizable visuals through CSS
• Accessibility (Keyboard-only, screen-reader support)
• Internationalization (driven from config file)

Extensible Required Features

• Ratings (mature content, violence, sexuality)
• Support multiple streaming methods (rtmp, rtmpt, rtsp, http)
• Support multiple streaming speeds (low, medium, high)
• Subtitles support in TTXT
• Audio description playback – detect the MP4 audio track specific to Audio description
• Statistics : IP, onLoad, start, reached 25%, 50%, 75%, 90%, 100%, CC_ON, CC_OFF, AD_ON, AD_OFF (must be sent to NFB server)
• JSON, AMF support to interact with the NFB video management environment.
• Watermark overlay on the video.
• Source hidding : Provide the user with an ObjectID in order to hide the real address of the film in order to prevent downloads.
• Like feature. Within the player, users should have the ability to “like” a film. If the user is log in to the site, this features should populate his profile. If the user is not logged in, then it’s a simple add to build “most liked” film lists.

Optional Features

• Message overlay on load, pause/stop, end
• Message overlay at specific in and out point
• Recommendation at 90% of the film: once the film reaches the 90% mark, related films should be suggested with thumbnails, titles and duration. This needs to appear as a layer over the video
• Follow feature: The follow features means the user will be notified every time there is a comment on the film. This should be linked to the user profile, hence the user must be authenticated.
• Google translation: give users the ability to get the machine translation from Google based on the subtitles of the film.

Project News

This is where your regular updates will go. In these you should discuss the status or your work, your interactions with other members of the community (e.g., Seneca and Mozilla), problems you have encountered, etc.

Put detailed technical information into the Project Details page (i.e., update it as you go), and save this section for news about participation in the project.