How To Code A Full Functional MP3 Player Using ActionScript 3.0
Posted: August 30th, 2009 in ActionScript-tuts, Featured, Flash-tuts by j000Hi there, this is a continuation of our last tutorial where we designed the interface for an mp3 player using flash only. In case you missed the tutorial you can find it here.
Source files can be downloaded through the following link:
Demo can be viewed through the following link:
however, I did not include the mp3s [...]
j000
Hi there, this is a continuation of our last tutorial where we designed the interface for an mp3 player using flash only. In case you missed the tutorial you can find it here.
Source files can be downloaded through the following link:
Demo can be viewed through the following link:
however, I did not include the mp3s in the file and you will need to make changes to the XML files to suite your tracks.
In this tutorial we will take you through the coding phase and show you how our design will be transformed to a full functional mp3 player. Let’s start.
Declaring Necessary Variables
Open the flash file created in our design mp3 tutorial and add a new layer called actions. Lock this layer and while in the first key frame press F9 to bring actionscript panel forward. We will start by declaring the variables that we are going to use in our script.
var index:Number = 0;
var trackPos:Number = 0;
var trackOn:Boolean = false;
var trackXML:XML;
var trackList:XMLList;
var urlRequest:URLRequest;
var urlLoader:URLLoader;
var newTrack:Sound;
var newUrlRequest:URLRequest;
var chan:SoundChannel = new SoundChannel();
/* Rewind or FastForward rate */
const SEARCH_RATE:int = 1500;
/* XML file used to load the tracks */
const XML_FILE:String = "tracks.xml";
First we create a new Sound object called track and then we initiate some variables that we will require to keep trail of the mp3 file that is being played. Then we define more variables that we will use in our code; these variables include the SoundChannel object.
For our mp3 player, we will be using an XML file to load our tracks. So create a simple xml file named tracks.xml and save it in the same place where your swf and fla files are located. This will be used to store the mp3 information such as track title, track performer, album…etc. mine looks like this. It is ok if yours is different as long as you know how to call the information appropriatley then you are fine, but I recommend you use the same structure to make sure everything works as described:
<file>
<track>
<title>title 1</title>
<performer>Performer 1</performer>
<path>your_1.mp3</path>
</track>
<track>
<title>title 2</title>
<performer>Performer 2</performer>
<path>your_2.mp3</path>
</track>
<track>
<title>title 3</title>
<performer>Performer 3</performer>
<path>your_3.mp3</path>
</track>
</file>
now we need to be able to access the xml file but first we will load it and then check whether the loading action is complete so type the following after you variables declarations:
urlRequest = new URLRequest(XML_FILE);
// create a new URLLoader object to load the XML file
urlLoader = new URLLoader(urlRequest);
urlLoader.addEventListener(Event.COMPLETE, onceLoaded);
urlLoader.load(urlRequest);
Don’t test the movie yet if you do you will get an error because we didn’t create onceLoaded function yet, that’s our checking function. The function is added now
trackXML = new XML(e.target.data);
trackList = trackXML.track;
urlRequest = new URLRequest(trackList[index].path);
track.load(urlRequest);
}
This function checks to see if the xml file has completely loaded and then loads the information to our mp3 player.
Adding Functionality to Play Button
Using the instances of buttons created in the previous tutorial we add this to make the buttons respond to our clicking events, the first one is play button:
Then add the playTrack function that will enable you to play the mp3 when the event of clicking play button as follows:
if (!trackOn) {
newUrlRequest = new URLRequest(trackXML.track[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play(trackPos);
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
}
}
Now you if you test the movie you will be able to hear your first track play when you click the play button. I’m excited already, you?
Adding Functionality to Stop Button
But what if we wanted to the sound to stop? This is where the stop button becomes handy and we do that by adding the following line of code after:
ffunction stopTrack(e:MouseEvent):void {
if (trackOn) {
chan.stop();
trackPos = 0;
play_mc.addEventListener(MouseEvent.CLICK, playTrack);
trackOn = false;
play_mc.visible = true;
}
}
If you test the movie you should be able to play and then stop the sound as you wish. That wasn’t so bad wasn’t it!
Adding Functionality to Next Button
Now we want to enable our mp3 player to jump to another track, because the track we are listening to might be too boring or we are sick of it, after repeatedly listening to it while testing the movie. We do that by adding this code that targets the next button:
function nextTrack(e:MouseEvent):void {
if (index < trackList.length() - 1) {
index++;
}else{
index = 0;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play();
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
}
Adding Functionality to Previous Button
Maybe we changed our minds and we want to go back to the same track so what do we do? we add the next lines of code to enable the previous button:
function prevTrack(e:MouseEvent):void {
if (index > 0) {
index--;
}else{
index = trackList.length() - 1;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play();
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
}
Adding Functionality to Pause Button
We also want to be able to pause tracks whenever we want. That’s achieved by adding the following code to our action panel;
function pauseTrack(e:MouseEvent):void {
if (trackOn) {
trackPos = chan.position;
chan.stop();
play_mc.visible = true;
play_mc.addEventListener(MouseEvent.CLICK, playTrack);
trackOn = false;
}
}
Adding Functionality to Fast-forward and Rewind Buttons
As it is, your player is already fully functional but we also want to add a fast-forward and rewind functionality to our player. We can add these features by adding the following lines of code in the actionscript panel. First the fast-forward functionality:
function ffwrdTrack(e:MouseEvent):void {
if (trackOn){
trackPos = chan.position;
chan.stop();
chan = track.play(trackPos + SEARCH_RATE);
chan.addEventListener(Event.SOUND_COMPLETE, playNext);
}
}
and the code for enabling rewind functionality is as follows:
function rwndTrack(e:MouseEvent):void {
if (trackOn) {
trackPos = chan.position;
chan.stop();
chan = track.play(trackPos - SEARCH_RATE);
}
}
It is important to add play next function to our fastforward button so that when the track reach the end next track starts, so make changes to ffwrdTrack function as shown by adding chan.addEventListener(Event.SOUND_COMPLETE, playNext); and add the following playNext function as well:
if (trackOn){
trackPos = chan.position;
chan.stop();
chan = track.play(trackPos + SEARCH_RATE);
chan.addEventListener(Event.SOUND_COMPLETE, playNext);
}
}
function playNext(e:Event):void {
if (index < trackList.length() - 1) {
index++;
}else{
index = 0;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play(0);
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
chan.addEventListener(Event.SOUND_COMPLETE, playNext);
}
Displaying Track Information
In order to display track info we need to create some text areas so create two new layers named performer info and title info, respectively and grab the text tool and create two dynamic text areas with Arial type and 11 px. Call the first one performer_txt and second title_txt. This is crucial in order for the code to work properly. Keep each text area in its own layer.
We also need to add some coding to our function in order to display the text when the mp3 player starts playing or next and previous track is selected. Add the following code
performer_txt.text = trackList[index].performer;
where necessary in playTrack, nextTrack, prevTrack, and playNext functions. The complete code after re-arranging and adding is shown below:
var index:Number = 0;
var trackPos:Number = 0;
var trackOn:Boolean = false;
var trackXML:XML;
var trackList:XMLList;
var urlRequest:URLRequest;
var urlLoader:URLLoader;
var newTrack:Sound;
var newUrlRequest:URLRequest;
var chan:SoundChannel = new SoundChannel();
//--- Rewind or FastForward rate ---\\
const SEARCH_RATE:int = 1500;
//--- XML file used to load the tracks ---\\
const XML_FILE:String = "tracks.xml";
urlRequest = new URLRequest(XML_FILE);
urlLoader = new URLLoader(urlRequest);
urlLoader.addEventListener(Event.COMPLETE, onceLoaded);
urlLoader.load(urlRequest);
function onceLoaded(e:Event):void {
trackXML = new XML(e.target.data);
trackList = trackXML.track;
urlRequest = new URLRequest(trackList[index].path);
track.load(urlRequest);
}
play_mc.addEventListener(MouseEvent.CLICK, playTrack);
stop_mc.addEventListener(MouseEvent.CLICK, stopTrack);
next_mc.addEventListener(MouseEvent.CLICK, nextTrack);
prev_mc.addEventListener(MouseEvent.CLICK, prevTrack);
pause_mc.addEventListener(MouseEvent.CLICK, pauseTrack);
ffwrd_mc.addEventListener(MouseEvent.CLICK, ffwrdTrack);
rewind_mc.addEventListener(MouseEvent.CLICK, rwndTrack);
function playTrack(e:MouseEvent):void {
if (!trackOn) {
newUrlRequest = new URLRequest(trackXML.track[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play(trackPos);
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
}
function stopTrack(e:MouseEvent):void {
if (trackOn) {
chan.stop();
trackPos = 0;
play_mc.addEventListener(MouseEvent.CLICK, playTrack);
trackOn = false;
play_mc.visible = true;
}
}
function nextTrack(e:MouseEvent):void {
if (index < trackList.length() - 1) {
index++;
}else{
index = 0;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play();
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
function prevTrack(e:MouseEvent):void {
if (index > 0) {
index--;
}else{
index = trackList.length() - 1;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play();
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
function pauseTrack(e:MouseEvent):void {
if (trackOn) {
trackPos = chan.position;
chan.stop();
play_mc.visible = true;
play_mc.addEventListener(MouseEvent.CLICK, playTrack);
trackOn = false;
}
}
function ffwrdTrack(e:MouseEvent):void {
if (trackOn){
trackPos = chan.position;
chan.stop();
chan = track.play(trackPos + SEARCH_RATE);
chan.addEventListener(Event.SOUND_COMPLETE, playNext);
}
}
function rwndTrack(e:MouseEvent):void {
if (trackOn) {
trackPos = chan.position;
chan.stop();
chan = track.play(trackPos - SEARCH_RATE);
}
}
function playNext(e:Event):void {
if (index < trackList.length() - 1) {
index++;
}else{
index = 0;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play(0);
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
chan.addEventListener(Event.SOUND_COMPLETE, playNext);
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
Adding Spectrum
Our last task is to create a spectrum ……
Create a new layer and call it spectrum then press F8 to create a new empty movie clip call it spectrum. In the editing mode of this newly created movie clip name the first layer rectangle and the second actions. Draw a rectangle 40px wide and 18px high that we’ll use as a guide, so right click the rectangle layer and select Guide. Now add the following code. This is taken from the help file modified a little bit to suite our mp3 player:
function onEnterFrame(event:Event):void {
var bytes:ByteArray = new ByteArray();
const PLOT_HEIGHT:int = 9;
const CHANNEL_LENGTH:int = 20; //256;
SoundMixer.computeSpectrum(bytes, false, 0);
var g:Graphics = this.graphics;
g.clear();
g.lineStyle(0, 0xFF9933);
g.beginFill(0xFF9933);
g.moveTo(0, PLOT_HEIGHT);
var n:Number = 0;
for (var i:int = 0; i < CHANNEL_LENGTH; i++) {
n = (bytes.readFloat() * PLOT_HEIGHT);
g.lineTo(i * 2, PLOT_HEIGHT - n);
}
g.lineTo(CHANNEL_LENGTH * 2, PLOT_HEIGHT);
g.endFill();
g.lineStyle(0, 0xFF9933);
g.beginFill(0xFF9933, 0.5);
g.moveTo(CHANNEL_LENGTH * 2, PLOT_HEIGHT);
for (i = CHANNEL_LENGTH; i > 0; i--) {
n = (bytes.readFloat() * PLOT_HEIGHT);
g.lineTo(i * 2, PLOT_HEIGHT - n);
}
g.lineTo(0, PLOT_HEIGHT);
g.endFill();
}
Back in the main time line just position the empty movie clip where it should and your player should work perfectly. Let me know if you have problems. Later I will upload the files for downloads.
That concludes our tutorial I hope it was clear and helpful to all who want to create fully functional mp3 players. Of course there are more features that can be added to make this player even better, such as track list, elapsed time, mute button, skin color button…etc. but for now this should be sufficient enough. I hope you enjoyed and please leave your comments.
Thank you for reading. More flash and actionscript tutorial via twitter, follow me here 
Tags: action script, flash, mp3-player
I should try both tutorials when I am free. But looks great.
Thanks Later I want to experiment with colors and also add more functionality to the mp3 player what do you think?
Please do! Maybe include a settings file to specify colours…
Maybe in future tutorials this one is a simple mp3 player that is not built using classes.
Thanks! nice little player there. I’m looking forward to the source.
-B
Yeah I will upload it once I figure out how :\ the files are too large maybe without the mp3s!!
Source code and files are available now
Hi,
I’ve followed nearly every step of this tutorial, as well as the previous one, and my player looks great, but it doesn’t work.
I created an “actions” layer, and cut and pasted all of your code into this layer. I’m not sure if this is what was intended. Any help would be appreciated!
Actually you right, if you cut and pasted the code into an action layer frame one, then the player should work fine. As long as, you named the instances on the stage with the same names in the actionscript code. Why don’t you download the source files and check if this will help here http://flashjourney.com/wp-content/uploads/2009/08/Creating-Simple-MP3-Player.rar
Let me know if it works and I would love to see how everyone created their mp3 player if a bit different from this.
Maybe I will try this with green or blue color for buttons and screen. Cool nonetheless.
How would you add an autostart feature to this? It’s a great player!
Hi! already did the mp3 player it worked fine, but i tried to put it on my web page with everything on it and it doesn’t play.
help please!
Hi Ladas, it would help if you can provide more information on your issue. But it might be that the player can not find either the xml file or the mp3 files.
that’s what i thought, because i had uploaded all the files to the same folder. can you tell me why?
Ladas,
you may need to change the following statement to include the full URL where your xml file resides
//— XML file used to load the tracks —\\
const XML_FILE:String = “tracks.xml”;
so instead of only “tracks.xml” you may write “http://yoursite.com/folder/folder/tracks.xml”
You also need to update your XML file to include the full path where the mp3 files are located. This should work, see the demo at the beginning of the article.
Hi! I just want to know if it´s possible to start automatically the first mp3 when I execute the swf.
thanks!!
Lukaz
Hi Lukaz,
You can update your onceLoaded function as follows; this should do the trick.
function onceLoaded(e:Event):void {
trackXML = new XML(e.target.data);
trackList = trackXML.track;
urlRequest = new URLRequest(trackList[index].path);
track.load(urlRequest);
if (!trackOn) {
newUrlRequest = new URLRequest(trackXML.track[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play(trackPos);
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
}
Regards,
Now mp3 demo is active and there are new buttons for downloading and view the demo
A question from Owen Evans:
“Hi there, first just want to say thanks for posting your excellent tutorial on how to create a flash mp3 player. I have one problem thought that I hope you can help me with. After following your tutorial and making a MP3 to my site, I found my site takes longer to load. Is this because it is loading all the mp3 files? Or are they supposed to stream?”
Evans, my guess would be because it is loading all the large mp3 files. You can use The SoundMixer.bufferTime property to stream the file; see an example below:
import flash.media.SoundLoaderContext;
import flash.net.URLRequest;
var s:Sound = new Sound();
var req:URLRequest = new URLRequest("bigSound.mp3");
var context:SoundLoaderContext = new SoundLoaderContext(8000, true);
s.load(req, context);
s.play();
What’s the platform number?
—————————————
signature: zelnorm 6mg
Hi,
I think the player looks fantastic and I’m looking forward to fitting it in with my site (changed colour to red).
I’m falling at the first trial with the code though. I keep getting this error twice: 1120: Access of undefined property play_mc.
Hi The Comedian,
play_mc is the name of instance given to btnPlay. On your working stage; click the play button and then check its properties. Under the “Button” drop down list, in the text field next to the “Swap…” button, you should see ‘play_mc’ defined. If this is not as mentioned, just change it to ‘play_mc’. This is the name of instance that is being referenced in your actionscript code.
Thanks Mad,
I managed to get it working fine in flash and then it doesn’t on the site
http://therivieracomedyclub.com/audio.php
I’ve changed the string to my exact location. I have 6 tracks on the playlist & they’re all under 1 min.
The page says transferring data constantly, any ideas what this could be?
Thanks in advance.
[...] ournext tutorialwe take you through the coding phase and we will show how using actionscrip 3.0 the player will come [...]
Hi Great Tutorial,
I´m trying to load the mp3 player to another flash movie using the “loadmovie” action and the mp3 player doos not work anymore, can you help me ?
Hi,
Really enjoyed your tutorial, thanks! However, Ive noticed this was created using flash CS3, and I’ve created mine using flash CS4 (actionscript 3.0) – after completion I’ve received the following error reports, firstly from the main timeline ‘actions’, and secondly in the spectrum ‘actions’. Would this be caused by differences between CS3 and CS4 – as most of the errors relate to the use of parentheses, semicolons ? any help would be greatly appreciated.
MAIN TIMELINE
1084: Syntax error: expecting rightparen before semicolon.
MAIN TIMELINE
1084: Syntax error: expecting rightparen before semicolon. if (index < trackList.length() – 1) {
Hi there Spagewell we will need to check the code using CS4 I’m installing it now we’ll let you know once we test it on the new version of Flash and thanks for informing us.
thanks very much for the fast reply. I’ve compiled a list of the errors for your reference. Hopefully this helps.
1084: Syntax error: expecting rightparen before semicolon. if (index < trackList.length() – 1) {
1084: Syntax error: expecting semicolon before rightparen. if (index < trackList.length() – 1) {
1083: Syntax error: else is unexpected. }else{
1084: Syntax error: expecting rightparen before semicolon. if (index > 0) {
1084: Syntax error: expecting semicolon before rightparen. if (index > 0) {
1084: Syntax error: expecting rightparen before semicolon. for (var i:int = 0; < CHANNEL_LENGTH; i++) {
1084: Syntax error: expecting semicolon before rightparen. for (var i:int = 0; < CHANNEL_LENGTH; i++) {
1084: Syntax error: expecting rightparen before semicolon. for (i = CHANNEL_LENGTH; i > 0; i–) {
1084: Syntax error: expecting semicolon before rightparen. for (i = CHANNEL_LENGTH; i > 0; i–) {
1084: Syntax error: expecting rightbrace before end of program
see last comments
Hey,
The tutorial is great I’m very new to flash and it was easy to follow. I’m also having some of the same errors when adding functionality to my button.s I am working in CS4 and was wondering if you have tested it on a new version yet?
Ok guys, its perfect so far. But i have a doubt:
what does this line of code do?
if (index < trackList.length() -1
thank you in advance!
i got it! sorry about that. Its just that in the source code posted in this website, it doesnt display “<" as is, but with the ASCCI code.
I’ll fix this problem and just for everyone’s information I tested the file on Flash CS4 and it seems to work fine wihtout any problems. Spagwell the problem is not in the code but with the WP color code as mentioned by Mauricio González. Use the code in attached file and save it as CS4 file and you should have no problem. Thanks guys
Ok I managed to fix all the bugs that were created by Color Code and WP visual/html mode. It’s best to use the code in the attached file.
Guys I noticed that a lot of you have no Gravatars click this create your gravatar so your comments can look nice with your pic or avatar
Hi,
Thanks for a very detailed tutorial!
I seem to have some trouble getting the player to work, though. I get as far as adding the playTrack function (just copying and pasting code), and the script starts throwing “A term is undefined and has no properties” errors.
If it makes any difference, this is what it says:
TypeError: Error #1010: A term is undefined and has no properties.
at Player_fla::MainTimeline/onceLoaded()
at flash.events::EventDispatcher/dispatchEventFunction()
at flash.events::EventDispatcher/dispatchEvent()
at flash.net::URLLoader/onComplete()
And when pressing the play button,
TypeError: Error #1010: A term is undefined and has no properties.
at Player_fla::MainTimeline/playTrack()
Any ideas for what might be causing this? I’m running CS4 and my knowledge of ActionScript is rather limited, to say the least.
Gah, please ignore the comment above. I had made a silly typo in the xml file – just like me to go blame someone else when it’s really my sleepiness that’s the culprit.
Again, thanks for a great tutorial!!
ignored
hi
thanks for a great tutorial, and by the looks of it some very helpful comments/answers too. Thats really great. best flash mp3 tutorial I have found (despite no volume control), I guess I’ll try and squeeze one into my player bymyself.
Sami
Hey there,
There is a Type0 in the stop button part.
frame 1 line 76
ffunction stopTrack(e:MouseEvent):void
should be
function stopTrack(e:MouseEvent):void
thanks for the correction
Hi again,
I get an error when i add the title, performer function.
if i leave the function open like this:
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
i get this error:
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at vtp_fla::MainTimeline/frame1()
if i close it like this:
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
i get this error
Frame 1 Line 244 1087: Syntax error: extra characters found after end of program.
you then write:
where necessary in playTrack, nextTrack, prevTrack, and playNext functions. The complete code after re-arranging and adding is shown below:
I am not sure what you mean here, but if i add the complete code i will end up with a 9-10 line error log. It refers to alot of funktion duplicates and extra characters. Any ideas?
if you are interested, i can forward the project files for you to evaluate?
Send me a email if this is the case.
Have a great Sunday
johan
Give me some time and I’ll come back to your problem but for now please use the code included in the attachment because I tested it and it works on both CS3 and CS4. You can send me the project at this email aljufaily@gmail.com
By the way, inserting the code from your finished project into my own work swell.
Very good tutorial and you have been stumbled with two thumbs up
I’m glad it’s working fine for you and thanks for the comments and thumbs up. Spread the word more tutorials and inspiration coming your way
Hi,
I was just wondering if it is possible do make the player change to the next song automatically. Just like a play list.
I’ve try something like this :
chan.addEventListener(Event.SOUND_COMPLETE, onPlaybackComplete);
// This onPlaybackComplete fires off when tracks finish playing
function onPlaybackComplete(e:MouseEvent):void {
if (index < trackList.length() – 1) {
index++;
}else{
index = 0;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play();
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
and it didn't work
Solutions?
Thanks a lot. And this is the XML player tutorial on the net.
Kopp
Hi,
I was just wondering if it is possible do make the player change to the next song automatically. Just like a play list.
I’ve tried something like this :
chan.addEventListener(Event.SOUND_COMPLETE, onPlaybackComplete);
// This onPlaybackComplete fires off when tracks finish playing
function onPlaybackComplete(e:MouseEvent):void {
if (index < trackList.length() – 1) {
index++;
}else{
index = 0;
}
chan.stop();
newUrlRequest = new URLRequest(trackList[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play();
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
track = newTrack;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
and it didn't work
Solutions?
Thanks a lot. And this is the XML player tutorial on the net.
Kopp
The sound wave is a nice touch-
thanks for the great work!
So cool to hear that you liked that little addition to the mp3 player
How would I got about making the tracks buffer instead of having to load them all?
-Mike
How about loading the player using javascript? Any pointers with doing this?
Maybe that can be done but I’m fairly new to the world of design and development and never touched javascript yet
hi j000 im currently in building my new website in flash. and i love your tutorial on the player its hard to find a good one on the web and ive been looking for a month. the problem im having is that i cant get the track to auto play once the first track is done.. what actionscript function should i use
Hi TREVORI The player does allow for next track to start once the previous is finished. You can check the demo or download the complete code here http://flashjourney.com/wp-content/uploads/2009/08/Creating-Simple-MP3-Player.rar the function you need to add to play.mc button is playNext function. See code available in downloaded file.
Hi. I was just wondering if there was a way to make the player go to the next track when one track is finished playing (just like a playlist). This is an amazing tutorial, but I am only using the play, pause, previous and next buttons, if that makes a difference. I am using this in a school project and could REALLY use some help. Any help is appreciated. I have it set up already so that it autoplays the first track when loaded.
Hi william I think I need to update the code that’s posted in the tutorial because the player does allow for next track to start once the previous is finished. You can check the demo or download the complete code here http://flashjourney.com/wp-content/uploads/2009/08/Creating-Simple-MP3-Player.rar the function you need to add to play.mc button is playNext function. See code available in downloaded file.
I guess what I was getting at is how do I reference that?
Here is my code now:
play_mc.addEventListener(MouseEvent.CLICK, playTrack);
function playTrack(e:MouseEvent):void {
if (!trackOn) {
newUrlRequest = new URLRequest(trackXML.track[index].path);
newTrack = new Sound(newUrlRequest);
chan = newTrack.play(trackPos);
play_mc.removeEventListener(MouseEvent.CLICK, playTrack);
trackOn = true;
title_txt.text = trackList[index].title;
performer_txt.text = trackList[index].performer;
}
}
I have the playNext function at the bottom of the code (copied and pasted from the sample document), I just don’t exactly know how to reference it since I am still new at actionscript. Thanks for all of your help!
Is there any way to have the fast forward and rewind continue to move while the mouse button is being held down. It seems you have to keep clicking it to keep the track moving forwards or backwards. When I remove the fastforward and rewind buttons to slim down the player the playNext function stops working. Is there any way to correct this? You are so awesome for helping out with such knowledge and tutorial. It seems I am having the same issues as William.
Hi…..Really great player…Just one question though….Does the title scroll, or did i make a mistake in the script somewhere? …Thanks!
To get the player to jump to the next track once the previous has finished, I added this to the last line of the playTrack function:
chan.addEventListener(Event.SOUND_COMPLETE, playNext);
Worked for me.
Thank you very much for the tip and I hope everyone here will benifit from it.
Hi
I followed this tutorial, changed colours and ofcourse aletered the songs. But i get errormessage whe its been inserted in y cs4 created website (html). Every part is in the same folder and I even took your original file, with the same result:
Error#2044:ej hanterad ioError:. text=Error#2032: Flödfesfel. URL: tracks.xml at mp3_player_fla::MainTimeline/frame1()
And
TypeError: Error #1009: Det går inte att få åtkomst till en egenskap eller metod för objektreferensen null. at mp3_player_fla::MainTimeline/playTrack()
Yes, i know stuff is written in swedish but I’m pretty sure you get it anyway
Maybe I should add that it works solo in a browser but not as its inserted in a Dreamweaverpage.
hey I like your tutorial very much
but I want to know were i put my music for it to work, because I didn’t get that part…
please reply as fast as you can, because I want to finish it before the end of the week
thx
like what i’m seeing so far.
here’s an issue for you. i’m trying to modify this for my own website. I tried to remove the spectrum, but this has been crashing Flash. Any help would be appreciated.