Recipe 15.6. Getting the Size of a Sound File

Problem

You want to know the total size of the MP3 audio file you are loading, as well as the amount that has downloaded so far (so you can create a visual streaming indicator).

Solution

Access the bytesTotal and bytesLoaded properties of the Sound object.

Discussion

When streaming an audio file, it's often a good idea to let the user know how much data has been loaded. The Flash Player loads the sound as fast as it can, and plays the sound at its encoded rate. Ideally, the sound data will load faster than the sound is playing so there won't be a point at which the audio stops playing to load more data. However, in cases of poor connectivity or low bandwidth, and when sounds have been encoded with a high bitrate, the Flash Player may be struggling to keep enough sound data buffered so the sound doesn't stop.

Therefore, it's a good idea to give the user some sort of visual representation for the amount of buffered sound data, alongside the progress of the sound as it plays. You've probably seen this in many types of streaming media players, such as Windows Media Player or QuickTime Player. Usually there's a progress bar tracking the song as it plays. The background of the bar might be white. On top of that would be a growing black bar representing the progress of the song. Additionally, you might have a gray bar that indicates the buffered amount. As long as the gray bar (buffer) stays ahead of the black one (play position), you know you'll have smooth playback. When it catches up, the media stops playing while the gray bar moves ahead, buffering more data. When it has enough, the media starts again, and the black bar starts moving again, and hopefully the gray has enough of a head start this time.

This recipe covers how to create that gray bar, using two properties of a Sound object: bytesTotal and bytesLoaded. (Recipe 15.9 shows how to create the black bar.) These properties are pretty self-explanatory; bytesTotal contains the total size of the MP3 file you're streaming, and bytesLoaded contains how much of it has actually downloaded. If you divide these two values, you'll have the percentage of the sound that has loaded.

The following example sets up an enterFrame handler. On each frame it draws a white rectangle on the stage, and then calculates the percent of the sound that has loaded. It uses this to draw another bar (gray, of course) that represents that percent.

package {     import flash.display.Sprite;     import flash.media.Sound;     import flash.net.URLRequest;     import flash.events.Event;          public class ProgressBar extends Sprite {         private var _sound:Sound;                  public function ProgressBar(  ) {             addEventListener(Event.ENTER_FRAME, onEnterFrame);             _sound = new Sound(new URLRequest("song.mp3"));             _sound.play(  );         }                  public function onEnterFrame(event:Event):void         {             var barWidth:int = 200;             var barHeight:int = 5;             var loaded:int = _sound.bytesLoaded;             var total:int = _sound.bytesTotal;             if(total > 0) {                 // Draw a background bar                 graphics.clear(  );                 graphics.beginFill(0xFFFFFF);                 graphics.drawRect(10, 10, barWidth, barHeight);                 graphics.endFill(  );                 // The percent of the sound that has loaded                 var percent:Number = loaded / total;                 // Draw a bar that represents the percent of                  // the sound that has loaded                 graphics.beginFill(0xCCCCCC);                 graphics.drawRect(10, 10,                                    barWidth * percent, barHeight);                 graphics.endFill(  );             }         }     }     }

If you are playing a sound from your hard disk or local server, you'll barely be able to see the progress bar move; the sound loads almost instantly and the bar will quickly jump to 100 percent. If possible, try to put the MP3 file on an external web server somewhere and access it over the Internet. This gives you a more accurate view of what your end users will see. Also, the browser tends to cache the sound file as it plays, so try clearing your browser's cache before testing this file to give a more realistic view of the buffering.

Problem

Solution

Discussion

See Also