go to previous page

- discuss this tutorial -

4. The Library Class and Conclusion

This class is used to fix object scope using the apply function. Its functionality is the same as Macromedia’s Delegate class except it enables you to pass parameters to the callback method. For example, say your trying to access a property called “score” inside an onEnterFrame event in a class, without either delegating or storing a local variable to path with you wouldn’t be able to access the property.

Valid - Delegate:

private function phone():Void
{
         var call = false;
         office.phone.onEnterFrame = Delegate(this, “pickup”);
}
private function pickUp():Void
{
         trace(call); //output false
}

Valid – Local Property:

private function phone():Void
{
         var call = false;
         var local = this;
         office.phone.onEnterFrame = function()
{
         trace(local.call); //output false
}

Invalid

private function phone():Void
{
         var call = false;
         office.phone.onEnterFrame = function()
{
         trace(call); //output undefined
}

For these reasons this class has been made to fix the problem.

class Library
{
         static function delegate(object:Object, methodName:String):Function
         {
                  var method = object[methodName];
                  delete methodName;
                  var parameters = arguments.slice(2);

                  return function ()
                  {
                           //Returns callback and function parameters using the correct scope.
                           return method.apply(object, arguments.concat(parameters));
                  }
         }
}

Save it with the MusicPlayer class as Library.as.

Conclusion

That’s it you should now have a working music player. You’ve done, or maybe just read a lot in this article, either way thank you for taking the time, and I hope it has helped you to better understand OOP and maybe even made a nice music player for your site.

View Demo - Download Completed Sources

All used music in this demo comes from Ultrashock Audio Essentials btw.

Additions

Near the beginning of this article I mentioned how easy it would be to make the player dynamic by populating the tracks object via XML. I wanted to elaborate on this topic as I’m sure many people would like to be able to easily add XML support.

Inside the Flash file I changed the code to the following:

function convertXML():Object
{
            //Defines the object used to store all track information from the XML file
            var tracksData = {};
            tracksData.titles = new Array();
            tracksData.artists = new Array();
            tracksData.urls = new Array();
            //The base node has been set to a variable to shorten code and make
            //things easier when modifying.
            var tracks = xml.firstChild.childNodes;
            //I've set the number of tracks specified in the XML file to a variable to
            //save Flash the trouble of looking this number up everytime the for loop
            //is executed. This technique can save a bit of time with big loops.
            var tracksCount = tracks.length;
           
            for(var i = 0; i < tracksCount; i++)
            {
                        //Appends the node values of each category to the tracksData object
                        //in the relative category/array.
                        tracksData.titles.push(tracks[i].childNodes[0].firstChild.nodeValue);
                        tracksData.artists.push(tracks[i].childNodes[1].firstChild.nodeValue);
                        tracksData.urls.push(tracks[i].childNodes[2].firstChild.nodeValue);
            }
            return tracksData;
}

var xml = new XML();
xml.ignoreWhite = true;
xml.onLoad = function(success:Boolean)
{
            if(success)
            {
                        var player = new MusicPlayer(player, convertXML(), this.firstChild.attributes.initTrackID);
            }
            else
            {
                        trace("Unable to load XML.");
            }
}
//Begins loading XML
xml.load("tracks.xml");

Resave the Flash file (File > Save).

Now open your favorite text editor and paste the following:

<?xml version="1.0" encoding="utf-8"?>
<player initTrackID="0">
            <track>
                        <title>lebleu</title>
                        <artist>shane madden</artist>
                        <url>tracks/LeBleu.mp3</url>
            </track>
            <track>
                        <title>pensive</title>
                        <artist>shane madden</artist>
                        <url>tracks/Pensive.mp3</url>
            </track>
            <track>
                        <title>Brasilia</title>
                        <artist>shane madden</artist>
                        <url>tracks/Brasilia.mp3</url>
            </track>
</player>

Save the file as tracks.xml in the main folder ( musicplayer/tracks.xml ). Don't forget to edit the data inside this file to accommodate your tracks before testing out the player.

I tried to explain everything in the comments, but if you are still having trouble understanding what exactly is going on here, read my XML in Flash article.

go to previous page

- discuss this tutorial -