Recipe 15.15. Creating a Sound Application

Problem

You want to create a full-featured sound application, such as a streaming MP3 player.

Solution

Apply the other recipes in this chapter to play a streaming sound and add as many features as you want.

Discussion

This recipe combines many of the techniques shown throughout this chapter, integrated into a single application. There is much more that could be done with this, but it should give you a start at seeing how to use all these features together.

package {     import flash.display.Sprite;     import flash.display.Stage;     import flash.display.StageAlign;     import flash.display.StageScaleMode;     import flash.text.TextField;     import flash.events.Event;     import flash.events.MouseEvent;     import flash.events.TimerEvent;     import flash.media.Sound;     import flash.media.SoundChannel;     import flash.media.SoundTransform;     import flash.net.URLRequest;     import flash.text.TextFormat;     import flash.utils.Timer;              public class CookBookPlayer extends Sprite {         private var _channel:SoundChannel;         private var _displayText:TextField;         private var _sound:Sound;         private var _panControl:PanControl;         private var _playing:Boolean = false;         private var _playPauseButton:Sprite;         private var _position:int = 0;         private var _spectrumGraph:SpectrumGraph;         private var _volumeControl:VolumeControl;                  public function CookBookPlayer(  ) {             // Stage alignment             stage.scaleMode =                        flash.display.StageScaleMode.NO_SCALE;             stage.align = flash.display.StageAlign.TOP_LEFT;                          // Enter frame listener             var timer:Timer = new Timer(20);             timer.addEventListener(TimerEvent.TIMER, onTimer);             timer.start(  );             _playing = true;                          // Display a text field             _displayText = new TextField(  );             addChild(_displayText);             _displayText.x = 10;             _displayText.y = 17;             _displayText.width = 256;             _displayText.height = 14;             // Create a sound object             _sound = new Sound(new URLRequest(""http://www.rightactionscript.com             samplefiles/sample.mp3""));             _sound.addEventListener(Event.ID3, onID3);             _channel = _sound.play(  );                          // Create a bitmap for spectrum display             _spectrumGraph = new SpectrumGraph(  );             _spectrumGraph.x = 10;             _spectrumGraph.y = 33;             addChild(_spectrumGraph);                          // Create the Play and Pause buttons             _playPauseButton = new PlayButton(  );             _playPauseButton.x = 10;             _playPauseButton.y = 68;             addChild(_playPauseButton);             _playPauseButton.addEventListener(MouseEvent.MOUSE_UP,                                               onPlayPause);                          // Create volume and pan controls             _volumeControl = new VolumeControl(  );             _volumeControl.x = 45;             _volumeControl.y = 68;             addChild(_volumeControl);             _volumeControl.addEventListener(Event.CHANGE,                                             onTransform);             _panControl = new PanControl(  );             _panControl.x = 164;             _panControl.y = 68;             addChild(_panControl);             _panControl.addEventListener(Event.CHANGE,                                         onTransform);         }                  public function onTransform(event:Event):void         {             // Get volume and pan data from controls             // and apply to a new SoundTransform object             _channel.soundTransform = new SoundTransform(                                          _volumeControl.volume,                                           _panControl.pan);         }                  public function onPlayPause(event:MouseEvent):void         {             // If playing, stop and record that position             if(_playing) {                 _position = _channel.position;                 _channel.stop(  );             }             else {                 // Else, restart at the saved position                 _channel = _sound.play(_position);             }             _playing = !_playing;         }                  public function onID3(event:Event):void {             // Display selected id3 tags in the text field             _displayText.text = _sound.id3.artist + " : " +                                 _sound.id3.songName;             _displayText.setTextFormat(                         new TextFormat("_typewriter", 8, 0));         }                  public function onTimer(event:TimerEvent):void {             var barWidth:int = 256;             var barHeight:int = 5;                          var loaded:int = _sound.bytesLoaded;             var total:int = _sound.bytesTotal;                          var length:int = _sound.length;             var position:int = _channel.position;                          // Draw a background bar             graphics.clear(  );             graphics.beginFill(0xFFFFFF);             graphics.drawRect(10, 10, barWidth, barHeight);             graphics.endFill(  );             if(total > 0) {                 // The percent of the sound that has loaded                 var percentBuffered:Number = loaded / total;                 // Draw a bar that represents the percent of                  // the sound that has loaded                 graphics.beginFill(0xCCCCCC);                 graphics.drawRect(10, 10,                                    barWidth * percentBuffered,                                   barHeight);                 graphics.endFill(  );                                  // Correct the sound length calculation                 length /= percentBuffered;                                  // The percent of the sound that has played                 var percentPlayed:Number = position / length;                 // Draw a bar that represents the percent of                  // the sound that has played                 graphics.beginFill(0x666666);                 graphics.drawRect(10, 10,                                    barWidth * percentPlayed,                                   barHeight);                 graphics.endFill(  );                                  _spectrumGraph.update(  );             }                                   }     }     } // "helper classes" // (This is an outside package, but it's available to classes  // in the same file) import flash.display.Bitmap; import flash.display.BitmapData; import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent; import flash.filters.DropShadowFilter; import flash.geom.Rectangle; import flash.media.SoundMixer; import flash.utils.ByteArray; class PlayButton extends Sprite {     public function PlayButton(  ) {         // Draw the Play/Pause graphic         graphics.beginFill(0xcccccc);         graphics.drawRoundRect(0, 0, 20, 16, 4, 4);         graphics.endFill(  );         graphics.beginFill(0x333333);         graphics.moveTo(4, 4);         graphics.lineTo(8, 8);         graphics.lineTo(4, 12);         graphics.lineTo(4, 4);         graphics.drawRect(10, 4, 2, 8);         graphics.drawRect(14, 4, 2, 8);         graphics.endFill(  );              } } class SpectrumGraph extends Sprite {     private var _spectrumBMP:BitmapData;          public function SpectrumGraph(  )     {         // Bitmap to draw spectrum data in         _spectrumBMP = new BitmapData(256, 30,                                       true, 0x00000000);         var bitmap:Bitmap = new Bitmap(_spectrumBMP);         bitmap.filters = [new DropShadowFilter(3, 45, 0, 1,                                                 3, 2, .3, 3)];         addChild(bitmap);     }          public function update(  ):void     {         // Get spectrum data         var spectrum:ByteArray = new ByteArray(  );         SoundMixer.computeSpectrum(spectrum);                  // Draw to bitmap         _spectrumBMP.fillRect(_spectrumBMP.rect, 0xff666666);         _spectrumBMP.fillRect(new Rectangle(1, 1, 254, 28),                              0x00000000);         for(var i:int=0;i<256;i++) {             _spectrumBMP.setPixel32(i,                                     10 + spectrum.readFloat(  ) * 10,                                    0xff000000);         }         for(var i:int=0;i<256;i++) {             _spectrumBMP.setPixel32(i,                                     20 + spectrum.readFloat(  ) * 10,                                    0xff000000);         }     } } class VolumeControl extends Sprite {     public var volume:Number = 1.0;          public function VolumeControl(  )     {         addEventListener(MouseEvent.CLICK, onClick);         draw(  );     }          public function onClick(event:MouseEvent):void     {         // When user clicks the bar, set the volume         volume = event.localX / 100;         draw(  );         dispatchEvent(new Event(Event.CHANGE));     }          private function draw(  ):void {         // Draw a bar and the current volume position         graphics.beginFill(0xcccccc);         graphics.drawRect(0, 0, 102, 16);         graphics.endFill(  );                  graphics.beginFill(0x000000);         graphics.drawRect(volume * 100, 0, 2, 16);     } } class PanControl extends Sprite {     public var pan:Number = 0;          public function PanControl(  )     {         addEventListener(MouseEvent.CLICK, onClick);         draw(  );     }          public function onClick(event:MouseEvent):void     {         // When the user clicks bar, set pan         pan = event.localX / 50 - 1;         draw(  );         dispatchEvent(new Event(Event.CHANGE));     }     private function draw(  ):void {         // Draw the bar and current pan position         graphics.beginFill(0xcccccc);         graphics.drawRect(0, 0, 102, 16);         graphics.endFill(  );                  graphics.beginFill(0x000000);         graphics.drawRect(50 + pan * 50, 0, 2, 16);     } }