Skip over navigation

Media Player Module

Encoding the video

The purpose of this module is to allow inline embedding of videos into the content area of your web page. In order to utilize this component, you will need to encode your video to either:

  • MPEG-4 format (using the H.264 codec) or
  • Flash Video format (FLV, using the On2 VP6 codec or Sorensen Spark).

MPEG-4 is the preferred format and scales well to larger player sizes, including full-screen. If you need assistance with encoding, please contact the Broadcast Center.

The Broadcast Center staff recommend the following settings for encoding your own videos:

  • Video format:
    MPEG-4
    302 kbps
    H.264 codec
    30 frames per second
  • Dimensions:
    320x240 pixels (4:3)
    360x204 pixels (16x9)
  • Audio:
    48 kbps
    AAC codec
    44 kHz
    Mono

A combined audio and video bitrate of around 350 kilobits per second (kbps) is recommended for better compatibility with slower connections.

We recommend using MPEG Streamclip for your video conversion. When you Export to MPEG-4... please verify your settings match the following screenshot example:

MPEG Streamclip settings screenshot

-

Uploading the video

Once the video is encoded, you would need to place the encoded file under the public_html directory (or a subdirectory) of an Individual Central File Server (CFS) account. OIT provides 5GB of personal server storage space on the Central File Server for each University computing account.

Do not confuse Individual CFS accounts (sometimes called “H: Drive” or “Unix” accounts) with Departmental CFS accounts (called “M: Drive” or “departmental files and folders”). There should already be a “public_html” folder in the Individual CFS account folder.

You should not use a personal Individual CFS account for your organization’s content. The best choice here is a “Departmental/Organizational Non-Person Service account.” Your department can request a new Individual CFS account with an initial 5 GB quota on the Online Forms: New user accounts page.

If you receive a link to an encoded video file via the WebSpace service, you should not try to directly use the Webspace link in the Media Player. You must download the video file locally and then transfer it up to a Central File Server directory.

The OIT KnowlegeBase has more information about Central File Server accounts: Central File Server: Answers to Frequently Asked Questions (FAQ).

Configuring the Media Player component

Inside the Media Player component, there are only three required fieids:

  • Flash Movie URL
  • Width
  • Height

Enter the dimensions of the encoded video into the Width and Height fields. The component will automatically add the height of the playback controls. If you are enlarging the display of the video, be sure to maintain the proportions of the original, so that you do not distort the original aspect ratio. You may need to experiment with different values to avoid adding black bars (letterboxing or pillarboxing) around the original video.

If the video file has the following file path on your Individual Central File Server account:
/netid/public_html/directory/file.mp4
then the Flash Movie URL field in the Media Player component would be:
rtmp://flash.princeton.edu/puvod/mp4:FILES/netid/public_html/directory/file.mp4

Note: The Browse and Upload button has been removed as of 10/11/2011. The following are the outdated instructions for your reference.
All videos You could use the "Browse & Upload" button to store the video file in your Roxen site directory; however, you then lose the advantages of the streaming server, such as better performance on slow connections and the ability to jump ahead in the video before the video has downloaded. You would also have to manually edit the file path of the uploaded video to include the absolute directory path (/dept‑root/directory/file.mp4).

By default, the published player initially loads a black rectangle with a play button in the center; the AlternativeImage URL field allows you to upload and specify a JPEG image for use as a thumbnail to replace that black square. Many users save a still frame from the video for use as a thumbnail.

The CC file URL allows you to upload and specify a Timed Text caption file for synchronized closed captioning.

The Alternative Content field allows you to specify alternative content that loads instead of the Flash-based player. With the popularity of non-Flash mobile devices, you might want to provide this option. For example, you could place a direct link to the video file in this field, using the FCKeditor Link button:
http://www.princeton.edu/~netid/directory/file.mp4

If you require more storage space for a collection of video files, please contact CSG (csg‑incoming@princeton.edu) to inquire about creating a dedicated video repository on the streaming server. A charge account must accompany a dedicated repository request to cover monthly storage costs.