David Stiller’s blog

Someone recently asked in the Adobe Flash ActionScript forum how to convert milliseconds into the minutes-and-seconds format mm:ss.  This person wanted to format the value returned by Sound.duration in order to populate a dynamic text field to indicate the progression of a song — certainly a reasonable endeavor.  I also think it’s a fun way to demonstrate how to “roll your own” in cases where ActionScript lacks native support for whatever you’re hoping to achieve.  I’ll recount here what I posted in reply. 

An answer, short and sweet

Start a new FLA and place a dynamic text field into its own layer.  Using the Property inspector, give this text field the instance name output.  Create a scripts layer and type the following ActionScript into frame 1 (this code assumes you have an MP3 file named audio.mp3 in the same folder as the published SWF).

var music:Sound = new Sound();
music.loadSound("audio.mp3", true);
var minutes:Number = 0;
var seconds:Number = 0;
this.onEnterFrame = function() {
  minutes = Math.floor(music.position / 1000 / 60);
  seconds = Math.floor(music.position / 1000) % 60;
  output.text = minutes + ":" + seconds;
}

How it works

An arbitrarily named variable, music, is declared and set to an instance of the Sound class.  The Sound.loadSound() method is invoked on this instance, which causes the external file audio.mp3 to load and begin to play as soon as enough audio data become available.  This happens because the second method parameter, responsible for streaming (actually progressive downloading) is set to true.  Another two arbitrarily named variables, minutes and seconds, are declared as numbers and initialized to zero.

Next, a function is assigned to the MovieClip.onEnterFrame event of the main timeline (the global property this refers to the main timeline because that’s where this script is written).  At a default speed of twelve times a second (configurable via the movie’s framerate), the following occurs:

• The minutes variable is set to the value of Sound.position, as referenced against the music instance.  Sound.position returns a value in milliseconds of the current position of the audio (at one second in, Sound.position returns 1000).  Actually, minutes is set to the milliseconds value divided by 1000, which provides seconds, then divided again by 60, which provides minutes.  This value is run through Math.floor() to round it down to the nearest integer.
• The seconds variable is set to the value of Sound.position divided by 1000 — again, to provide seconds — but in addition, it is evaluated against the modulo operator (%) so that it never goes higher than 59 (see Lesser Known Operators:  Modulo (%) for details).  This value is also rounded down to the nearest integer.
• Finally, the TextField.text property of the output instance is set to a concatenation of minutes, a colon (:), and seconds.

Variation

Usually, when time is displayed, numbers less than ten are shown with a leading zero.  In ActionScript, a leading zero refers to an octal number, rather than decimal, so leading zeroes would have be strings in this scenario.  The concatenation above takes care that, so you could, for example, use two conditional operators (?:) to compactly provide leading zeroes (see Lesser Known Operators:  Conditional (?:) for details).

Update the above output.text line to look like this:

output.text = ((minutes < 10) ? "0" + minutes : minutes) + ":" +
((seconds < 10) ? "0" + seconds : seconds);

Thanks to Brad Maylor for bringing an error in the Variation section to my attention. I have corrected the code.

This entry was posted on Tuesday, July 25th, 2006 at 11:19 am and is filed under Flash, ActionScript 2.0. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.