finger27 - XML Playlist

In our example Model-View-Controller–based player ,we had an array of FLV filenames as a source for our playlist. As you may have noticed, that was a pretty bare-bones implementation without much flexibility. A few changes are needed to adapt the original player framework to use an XML source for the playlist, but not as many as you might think. We were already using an array, so the
simplest way to change over to XML would be to turn XML into an array, right? Well, using a handy little utility open source class called XMLSA, we can do exactly that.

Here’s an overview of the changes to this version of the application:
• Added util.XMLSA
• Added a folder called playlist inside the deploy folder, with a sample XML file:
test_playlist.xml
• Edited MediaPlayerModel to detect when it reached the beginning or end of the
playlist, and changed syntax to deal with an XMLSA array
• Changed the main MediaPlayer class so the first thing it does is load an XMLSA
object
As you know if you’ve been working with this player framework, the model
holds an instance of our playlist. The playlist object itself is constructed in the Playlist
class (ui/component/mediaPlayer/playlist/Playlist.as). To parse the XML source in this
class, we use the XMLSA class (util/XMLSA.as), which converts the XML into an object
with properties we can access, instead of forcing us to climb around in the XML tree.
So, ultimately, all you need to do to implement your own XML playlist in
this version of the application framework is to edit a copy of the test_playlist.xml
file and then specify that file in the MediaPlayer.as class. When you instantiate this
class in your application, the XML will be parsed into an object which will ultimately
populate your view.
test_playlist.xml
Let’s start by taking a look at the structure of the XML file example:
<playlist>
<item>
<path>test_01.flv</path> 
<title>test 01</title>
<description>description here</description>
</item>
<item>
<path>test_02.flv</path>
<title>test 02</title>
<description>description here</description>
</item>
<item>
<path>test_03.flv</path>
<title>test 03</title>
<description>description here</description>
</item>
</playlist>
In this example, we just have a file path, title, and description for each video,
or item. You could, of course, have whatever additional information you like here
for each. We’ll show you how to access that data in a minute, when we walk through
the MediaPlayerModel. Next, though, let’s look at what’s going on in our main class,
MediaPlayer, in ActionScript 2.
AS2: MediaPlayer.as
This is the main class that you’ll instantiate in the first frame of your Flash document,
just as you did back in Chapter 5. You’ll notice that we’ve got a new class here that
we’re importing, XMLSA:
import com.flashconnections.core.Core;
import com.flashconnections.ui.component.mediaPlayer.
— ifc.IMVCMediaPlayer;
import com.flashconnections.ui.component.mediaPlayer.MVCMediaPlayer;
import com.flashconnections.util.Proxy;
import com.flashconnections.util.XMLSA;
class com.flashconnections.ui.component.mediaPlayer.MediaPlayer
extends Core {
private static var TEST_PLAYLIST_PATH:String =
— ”playlist/test_playlist.xml”;
private var player:IMVCMediaPlayer;
Not a lot has changed in this class, so let’s just focus in on the two methods that we
updated, playNext and playPrevious. Here’s the code we had for dealing with a standard
array:
// standard implementation...
public function playNext():Void {
if (getPlaylist().hasNext())
— playMedia(String(getPlaylist().getNext()));
}
public function playPrevious():Void {
if (getPlaylist().hasPrevious())
— playMedia(String(getPlaylist().getPrevious()));
}
Now, here’s the new code that reads the XMLSA object:
// XMLSA implementation...
public function playNext():Void {
if (getPlaylist().hasNext())
— playMedia(String(getPlaylist().getNext().path.getValue()));
}
public function playPrevious():Void {
if (getPlaylist().hasPrevious())
— playMedia(String(getPlaylist().getPrevious().path.getValue()));
}
Note the highlighted code above, where our syntax has changed. The part that
changed is (with casting removed):
getPlaylist().getNext().path.getValue();
In this code, .path.getValue() drills into the XMLSA node retrieved by getPlaylist().
getNext() and grabs the value of the path object. (See the corresponding path nodes in
test_playlist.as.) XMLSA is a timesaver, but in a way, it hard-codes things that shouldn’t
be hard-coded. Now our model requires us to use the nodeName path in our code.
This is not so great, but the alternative would require us to write a lot more code. So,
for that benefit, we can live with it.
From here, if you wanted to update your display with other information from
the current playlist item, you could do so in the MediaPlayerView.onPlayMedia method.
For example, to retrieve a title, inside that method you could say something like:
var title:String =
— getMPModel().getPlaylist().getCurrentItem().title.getValue()
myField.text = title;
and so on.