Flash streaming media in dmBridge

dmBridge supports Flash media, like any other file format, in a clean way. Although not a complicated process, there are several steps you'll need to go through to get a Flash player working from within your dmBridge templates.

Prepare your Flash files

Flash can be delivered to the client in one of two ways: streaming or progressive. Streaming Flash requires a Flash streaming server and often uses the RTMP protocol. Progressively-downloaded Flash files can reside on any HTTP (or FTP etc.) server, but cannot be streamed. Your choice of streaming vs. progressive delivery is irrelevant for the purpose of getting it working in dmBridge.

Likewise, there are a million and a half different encoding formats, optimizations, bit rates, and so on relevant to Flash delivery. None of this is specific to dmBridge, and we will assume you already know what you're doing on this end of things and have some Flash content ready for delivery.

You'll want the Flash player to appear in Object view within the dmBridge template engine. Think about how this is going to work; when you enter object view, you want your viewer to appear and load a specific Flash clip. Your Flash player needs to know what clip to load, and there are a few different places it could find this info:

  1. From a field in the object's metadata containing the full URL of the clip;
  2. From some other field containing enough unique information to be able to reconstruct the full URL;
  3. From some other unique identifier outside of the metadata; for example, the combination of the object's alias ("CISOROOT") and pointer ("CISOPTR").

The first two options require editing the metadata of each object for which a clip is available. Option 3 may be relatively convenient, but also potentially more "fragile." No recommendation is made here, and you are advised to consult with any metadata experts on staff.

There is actually another option, Option 4, in which the Flash clip is the object. In other words, you are storing the Flash clip directly inside of CONTENTdm®, and the object (item) record itself is pointing to that Flash file. I wouldn't recommend this for several reasons, but it should be possible. I'll write a "part 2" to this article if there is interest.

Get the viewer working in a static HTML page

Create a new file called test.html somewhere, anywhere, and add the necessary HTML code to get your viewer working. The exact form of the HTML will differ depending on your choice of player, but one likely primary feature will be an <object> and/or <embed> tag, which embeds the viewer into the page. These element(s) will have a src attribute which points to the URL of the Flash clip. Anyway, just plug in a URL to any one of your Flash clips as a test, and do whatever you have to do to get the player working. Don't worry about styling or layout yet.

Your Flash player may come with a Flash file that serves as the player's skin and/or controls, as well as (possibly) one or more JavaScript files. Try to keep these separate within their own folders.

If you're wondering about players, I have used JW Player successfully in the past. There are others. We are once again entering non-dmBridge-related territory, though, so this is your call.

Write a dmBridge extension for the player

Now that your Flash test player works properly, we need to extract the code that displays it into a dmBridge extension. Open up your dm/objects/extensions folder and notice a file called SampleDraw.ext.php. Make a copy of it; call it CustomObjectDraw.ext.php (or whatever). Open this file in a text editor and delete any of the methods ("public static functions") present in it. We're going to write a new one. Also, change the line that says class SampleDraw to class CustomObjectDraw.

All this method will do is return (not echo/print) the exact same HTML tag you wrote in your test.html file in the previous step, with the actual Flash file URL embedded in the src attribute(s) instead of that test clip you plugged in yourself. The following examples will show you how it's done.

Note that both examples use a deliberately simplified <object> tag. Yours will be different. Instead of using string concatenation, we use the PHP sprintf() function to inject values into the tag in place of each %s, because it's a little cleaner-looking.

Flash file URLs stored in metadata

With this option, assume we've added the full URL of the clip in a dedicated metadata field. This field has a field nick of "url." (Yours won't be called this; the field nick is usually, but not always, the first 6 letters of the Dublin Core field name. To find it, embed the following code inside your object view template: <?php print_r(dmObject::getCurrent()->getFields()); ?> and search for it within the resulting array of dmField objects. [You'll want to view the page source.])

<?php

public static function flashPlayer() {
  
// Replace "url" with the field nick of your metadata field.
  
return sprintf('<object src="%s"></object>',
     
htmlspecialchars(dmObject::getCurrent()->getMetadata('url'))
   );
}

?>

Flash file URLs constructed based on object alias/pointer

With this option, it is assumed that all of your Flash files live on the "my_streaming_server" server, and are named in the format of file_[alias]-[pointer].flv, where [alias] is the collection alias (no preceding slash) and [pointer] is the object pointer.

<?php

public static function flashPlayer() {
  
/* Very important that we trim off the preceding slash of the
       collection alias, for obvious reasons. Replace the "src"
       attribute with the URL. */
  
return sprintf('<object
      src="http://my_streaming_server/file_%s-%d.flv"></object>'
,
     
ltrim(dmObject::getCurrent()->getAlias(), '/'),
     
dmObject::getCurrent()->getPtr()
   );
}

?>

Save the file.

Call the extension from object view

Navigate to your template set folder. Open up templates/object/view_simple.html.php. Call your flashPlayer() method like so:

<?php echo CustomObjectDraw::flashPlayer(); ?>

Make sure that any necessary JavaScript/CSS are also hooked up in the object view template just as they were in the test HTML file you made. Try to keep them separate; put JavaScript in the scripts folder within your template set folder, and CSS in the styles folder. You may even want to create subfolders for the player files.

Save, cross fingers, and see if it worked.

Troubleshooting

View the page source and make sure that the generated HTML is the same as the HTML you used to build your test player. Also make sure all the .swf and JavaScript files that the player uses are available where the player's <object> or <embed> tags are expecting to find them.

Still stuck? Post a comment!