Skip to: Main Content Search Main Navigation Audience Navigation

Ohio University is open

Portion of West Union Street remains closed following multiple structure fire. More Information
 

Using Video from our Flash Media Server


Work-in-Progress

The procedures described here are subject to change at any time, but have been relatively stable since the end of June, 2012. Please do let us know if you have any suggestions for enhancing the software or this documentation; in particular, please let us know if you detect any discrepancy between this guide and the way the software actually works, even if you can figure out what to do.


 

Overview

 

The Flash Media Server is configured to process a wide range of video files (including f4v, mp4 with H.264 Video Codec and AAC Audio Codec, ra, wmv, avi, mkv, etc.) for consistent display on web pages. As with any video recording, the file size will be roughly proportional to the product of the width, the height, the frame-rate, and the duration.

  • Before you can upload files, you must be a member of a CommonSpot group that is authorized to do so.

  • Files of about 750 MB or smaller size may be uploaded using the "Through the Browser" method described first, below, or through the "Bulk-Only" method, described second, below.

  • Larger files may be uploaded only by the "Bulk-Only" method, described second, below. Bulk (multiple-file) uploads by either method require that you create a playlist file, in addition to the video file(s), even if you are using the Bulk-Only method to upload a single video file. 

    • Use iTunes or VLC (which is free software for Windows or Macintosh) to generate the playlist file with a filename extension of ".m3u8":

    • The playlist filename is case-sensitive and will be the category (new, unless it matches an existing category within the group you select in step 4). 

    • The way you organize your files on your computer does matter, because the playlist will include the path and filename for the video file as it was on your computer. The video's title will be taken from the video filename; the video's "album" will be taken from the name of the folder containing the video; the video's "artist" or "author" will be taken from the name of the folder containing the album; farther out than that does not matter.

    • If you use iTunes, video file types are limited; for example, wmv, 3gp, f4v, and so on are not accepted. If you use VLC, you will have to change the playlist file extension from m3u to m3u8 before uploading it. 

 

Through the Browser: One-at-a-Time or Bulk Video Upload

  1. Go to http://www.ohio.edu/media/manage/ and login with your Ohio ID and password (if you had already been looking at the /media/manage/ page for a while, force your browser to "reload" or "refresh" the page, so that you will be properly logged in before starting the upload media process).

    Your browser will be redirected to the manage page on author.oit.ohio.edu, instead of on www.ohio.edu, because the authoring server can handle larger video file uploads.

  2. For a single file only, click on the "Upload Media" button near the top-left; for a bulk upload, click on the "Multi-Upload" button, and skip down to step 8.

  3. Observe the "lightbox" with the initial dialog.

  4. If you are eligible to upload for multiple groups, select the group that your new video should be included among from the pop-up tool.

  5. Click on the "proceed" button.

  6. Fill in the file's title, description, etc.

    • Click on the "Browse..." button near the middle for the preview image file if you want to use that feature.

    • Click on the "Browse..." button near the end to select the video file itself.

    • Ensure that "autoscale" is checked, unless you know you want to force a specific scaling. With autoscale, you will avoid having part(s) of your video frame cropped away.

  7. Click on the "upload video" button near the end.

  8. For bulk upload, click on each step in turn:  Provision, Upload, and Process.  In the upload stage, click on "Add Media Files" at the lower-left to select your playlist and video files; when your collection is complete, click on "Begin Upload" in the lower-right.  After processing is complete, click on "Finish."

 

Bulk-Only Video Upload

This is the most recently modified part of the code; please do let us know if you identify any discrepancies between these instructions and the way it really works.

  1. Prepare in advance:

    • Install and configure FileZilla according to the standard instructions. [This may not always be needed.]

    • Save the video files with appropriate names, each in a folder of the appropriate name, which is itself inside a folder of the appropriate name, as discussed in the Overview section, above

    • Build the playlist file and save it; rename it if necessary, as discussed in the Overview section, above.

  2. Go to http://www.ohio.edu/media/manage/ and login with your Ohio ID and password (if you had already been looking at the /media/manage/ page for a while, your session may have expired, so force your browser to "reload" or "refresh" the page, in order that you will be properly logged in before starting the upload media process).

  3. Identify the group that your new videos should be included among, and take note of the numerical group ID, at the upper-left corner of the listings for that group.

  4. Click on the "Bulk Upload" button.

  5. Observe the lightbox with the initial dialog.

  6. If you have multiple groups, use the pop-up tool to select the group that your new video should be included among.

  7. If in doubt, click the "Provision" button -- if you didn't need to do that, it will just tell you that right away.

  8. Click on the "Close" button in the lower-right of the lightbox.

  9. Wait one minute for the provisioning steps to complete.

  10. Once the destination folder has been provisioned, upload the video data files and the playlist files, using FTPS (FileZilla is free and works on Windows and on Macintosh; we won't do anything intentional to break other FTPS software, but with anything else you are on your own; at this time, Fetch on Macintosh is known to fail):

    Specify the host as "ftps://ftp-media.ohio.edu" (without the quotes); your own Ohio ID as the username; your own Ohio password; and leave the Port blank.

    Navigate on the left side of the FileZilla window to find your playlist and video files (you can set a FileZilla bookmark to be able to get back there more quickly).

    If all the files are less than 1 GB:  select the playlist and all of the video files it references; drag them to the right side and drop them onto the folder whose name matches the numerical group ID you noted in step 3.

    If any of the files are more than 1 GB: select the video files in groups of up to five; drag them to the right side and drop them onto the folder whose name matches the numerical group ID you noted in step 3; repeat until all the video files are transferred; finish by selecting the playlist file and dragging it across to the same destination folder on the right side.

    If you wait "too long" (and it will seem like a very short time!), then the FTPS session will be terminated; you can revive it by clicking on the FileZilla tool icon that has a blue arrow to the right above a green arrow to the left (which will also refresh the file and folder lists).

    If you encounter difficulties, take precise note of any error messages and contact the OIT Web Services team; the most likely issues would be you not having permission for bulk uploading, or your disk quota limit having been exceeded.
     
    The FTPS access is write-only: you will not see your file(s) listed, even though each has been uploaded correctly.

  11. Repeat steps 2 through 6; but then click on the "Process" button. If a video has multiple audio tracks, the first audio track will be used.

  12. Use http://www.ohio.edu/media/manage/ to update each video's information, such as description, duration, owner, etc.

  13. [Maybe some more missing steps here, to be added.]

 

Finding Available Videos

  1. Go to http://www.ohio.edu/media/manage/ and login with your Ohio ID and password.

  2. Each of the listed videos is available for you to use in your choice of the following ways:

    • directly included on your classic CommonSpot pages;

    • directly included on your manage CommonSpot pages (Web Services staff will set that up, but then you will be able to change which video is displayed, and various other parameters;

    • directly included on your web pages on any other server (e.g., the static-page Front Door server);

    • linked to from any of your pages, with the video displayed on the standard display page.

  3. Clicking on the title or any of the other text items in that row will result in a "lightbox" displaying some additional information about that video.

  4. Click on "close" in the lower-right corner when done examining the information in the lightbox.

  5. The "!" button permits you to limit the servers from which the embed code can be played.

  6. You can preview the video from the management page by clicking the icon to the left of the title.

  7. When you upload a single video, it creates a preview image automatically; we hope to provide that function for multi-file (bulk) uploads, too, in a future revision of the software.

  8. The "Management" button is visible to people who are members of a group that manages a collection of multi-media assets; it provides a mechanism to limit the management access for that asses to yourself, only, excluding other members of the group.

 

Building a Link to the Standard Display

  1. While on http://www.ohio.edu/media/manage/, and after having found the row for the video you want, click on the green tool icon near the right end of the row.

  2. Observe the resulting lightbox with the link URL, which will start with "http://www.ohio.edu/media/?videoid=" and conclude with the long, ugly, unique identifier for that video.

  3. Copy the text of the link, including the long, ugly, unique identifier for that video.

  4. Navigate to the page where you want the link to be; build the link; and paste the URL in for the destination.

  5. This will result in a link that leads to a standard page displaying only that one video, and no other specific information. If you want to have the video displayed on a page with other information that you control, see the next two sections.

 

Placing a Video on a Classic CommonSpot Page

  1. While on http://www.ohio.edu/media/manage/, and after having found the row for the video you want, click on the brown tool icon near the right end of the row.

  2. Observe the resulting lightbox, with the HTML code that will cause the display of the video on the page. It will start with an "object" tag and end with a "/object" tag.

  3. Copy the entire HTML code.

  4. Navigate to the page where you want the video to be displayed.

  5. You may use either of two methods to get the HTML into the page:

    • Use a Formatted Text Block, clicking on the tool icon (marked with the red arrow in the figure immediately below) in the upper-left quadrant of the toolbar to get the HTML view in the Rich Text Editor, and then pasting the code you copied in step 3 at the appropriate place. Don't forget to click on the tool icon to return to normal view before you click on "Finish," Submit," or "Save" to save your changes.

      RTE in 5.1 HTML view toolbar button
       
    • Use an HTML Fragment element, pasting the code you copied in step 3.

  6. Both techniques can be used to place the video on a page that has other page-specific content, including other videos. The standard display, on the other hand, shows only one video.

You can also use the HTML you copied in step 3 if you want to place a video on a page that is not in CommonSpot (e.g., one that is on the static-page Front Door server).

 

Adjusting the HTML

You can adjust some of the presentation parameters by editing the HTML that you have copied immediately after you paste it:

  • Width and Height: You can change video size such as width or height (two places in <object> and <embed> tags).

  • autoPlay = false or true: video to start only when the play button is clicked or video to start when people access your web page (two places in <param> and <embed>).

  • autoScale = false or true: your video will be fit into the flash player or the original video's size will be kept on the flash player without adjustment.

  • audioOnly = false or true: this option is only for audio. If it is true, play audio only.

Please don't edit the rest of the values, such as videoID, allowScriptAccess, on so on.

 

Controlling Access to a Video

You can control access to a video by telling the Flash Media Server to permit that video to be seen only from a specific page, and then controlling access to that page. If the page is in CommonSpot, you would use standard CommonSpot techniques to control access. The easily achieved restrictions are:

  • everyone (no restriction)

  • anyone with an Ohio ID (all current and former students and employees, plus all recent applicants)

  • anyone in a group already defined within CommonSpot

  • any individuals you list, who are already known to CommonSpot

If the page is in Blackboard, you can readily restrict access to any student or instructor in a specific course.

If the page in on the static-page server, you can readily restrict access to any individuals you list, to any group that is already defined in Active Directory (e.g., all current Ohio University employees), etc.; details are available online.

The basic sequence is:

  1. Identify the page that the video will be seen on.

  2. Create that page if it is not already in place.

  3. Restrict access to that page as appropriate.

  4. Upload the video.

  5. Mark the video to be visible only from that page (details below).

  6. Embed the video on that page (as described above).

In order to mark the video to be visible only from that page:

  1. Go to http://www.ohio.edu/media/manage/

  2. Find your video and click on the <!> under the "Share & Embed" column.

  3. Enter the URL(s) or domain(s) of the pages, subsites, or sites you want to permit the video to be seen from. For example:

    • site, such as http://www.ohio.edu/ or http://blackboard.ohio.edu/

    • subsite, such as http://www.ohio.edu/oit/webservices/ or http://www.ohio.edu/athens/

    • page, such as http://www.ohio.edu/oit/webservices/index.cfm or http://www.ohio.edu/athens/travel.html

    • you can list multiple allowed locations by clicking on the "+" sign in between.

  4. Click "Submit."