How to I add button-like behavior to a video player button component?

Background

I'm trying to create a simple "universal" media player which presents the same user interface (or as similar as possible) for video and audio playback. Unfortunately, FLVPlayback seems not to be able to handle audio files as far as I can tell, so I'm using a Sound and SoundChannel.

My video playback is handled using an FLVPlayback component which is "wired" to standard controls on-t开发者_如何学Che-fly when needed. What I want to do is wire them to the Sound / SoundChannel when I'm playing a sound so that the same UI widgets work in both cases. I'd like to avoid building all my components from scratch because the FLVPlayback component does a lot of nice stuff "for free" but it's starting to look tricky.

Gorey Stuff

The standard PlayPauseButton is a MovieClip with two layers, one containing the Play button (and with the instance name play_mc) and the containing the Pause button (pause_mc). Inside one of these is a movie with some code like this:

stop();
this.upLinkageID = "PauseButtonNormal";
this.overLinkageID = "PauseButtonOver";
this.downLinkageID = "PauseButtonDown";
this.disabledLinkageID = "PauseButtonDisabled";

The movie has two frames.

On the first frame is a single movieclip with the instance name placeholder_mc.

On the second frame are instances of the button states, but they have no instance name (which would make things easier). They are, however, instances of a library object with the name listed above.

What I'd like to do is write a function that when passed one of these buttons (pause_mc, say) it adds button-like behavior to it automagically. The bit I cannot figure out from Adobe's "documentation" is, how do I use the information embedded in the movie clip code to swap the contents of placeholder_mc with the thing I want.

tl;dr

In essence I just need to implement the function set_instance so that the code below changes the button's visible state as expected:

var my_button:MovieClip = pause_mc;
my_button.addEventListener( MouseEvent.MOUSE_OVER, function( e:Event ){
  set_instance( my_button.placeholder_mc, my_button.overLinkageID );
} );

---

I tried to get this working using the PlayPauseButton component today. It seems that Adobe doesn't openly make the hooks we are looking for available to us :P.

The solution I came up with was to use the Button UI Component and re-skin it to look like the PlayPauseButton.

You can dig the individual button states out of the two movie clips (play and pause) contained within the PlayPauseButton component, give them instance names, and then use those to set the appropriate skin properties of the button using the setStyle() method. Make sure you also resize the button to 23x23 to avoid stretching.

---

I usually just make a button and then assign movie clips or some display object as a skin using:

var myButton:Button = new Button();
myButton.setStyle('upSkin', new PlaySkin());
myButton.setStyle('selectedUpSkin', new PauseSkin());

Then, all your button states will be automatically taken care of by Flash. For a PlayPause button, you can set the "toggle" property of the button to "true" and then every time you click it, the button will switch from the selected skin to the up skin and back again.