MP3 preload, but then doesn't play?

[TylerNZ]

Ok, so I've been playin around with loading MP3's externally ... and I finially managed to get a preloader working ... however, now at the end of the preload function it doesn't play the file!?

If the mp3 is in the browser cache ... it will play the file!? How weird.

wanna see? The Site (http://www.michaelwhittaker.net/flash/site2.html)

Click the top right button for the player to slide out.

My code:



mySounda = new Sound();
preloadNow = 1;
mySounda.loadSound("Track2.mp3",false);

this.onLoad = function () {
mySoundLoading = 0;
_root.sounds.loadBar._xscale = mySoundLoading;
}

this.onEnterFrame = function () {
mySoundBytesTotal = _root.sounds.mySounda.getBytesTotal();
mySoundBytesLoaded = _root.sounds.mySounda.getBytesLoaded();
if (preloadNow==1 && mySoundBytesLoaded>0) {
mySoundLoading = Math.round((mySoundBytesLoaded/mySoundBytesTotal)*100);
if (mySoundLoading > 99) {
_root.sounds.mySounda.start(0,1)
_root.sounds.textd = _root.sounds.mySounda.id3.TIT2;
_root.sounds.playing = true;
_root.sounds.preloadNow = 0;
} else {
_root.sounds.textd = mySoundLoading + "%";
_root.sounds.loadBar._xscale = mySoundLoading;
}
}
}


I discovered that my preloader wasn't working before becoz I had two "onEnterFrame" events on the same frame. Obviously a no-no.

Anyway, can anyone help me with this?! Would be MUCH appreciated!!!!

[Voetsjoeba]

It would be easier to delete the onEnterFrame handler instead of using the variable checking:



mySounda = new Sound();
mySounda.loadSound("Track2.mp3",false)
mySoundLoading = 0;
_root.sounds.loadBar._xscale = mySoundLoading;
this.onEnterFrame = function () {
mySoundBytesTotal = mySounda.getBytesTotal();
mySoundBytesLoaded = mySounda.getBytesLoaded();
mySoundLoading = Math.round((mySoundBytesLoaded/mySoundBytesTotal)*100);
if (mySoundBytesTotal == mySoundBytesLoaded && mySoundBytesTotal > 0) {
mySounda.start(0,1)
_root.sounds.textd = mySounda.id3.TIT2;
_root.sounds.playing = true;
delete this.onEnterFrame
} else {
_root.sounds.textd = mySoundLoading + "%";
_root.sounds.loadBar._xscale = mySoundLoading;
}
}


Try that. Also, is this movieclip _root.sounds ? And are you loading this swf into another ?

[TylerNZ]

YAY you did it!!! It loads AND plays now!!! Phew ... now i just have to make it load and play the other tracks as well. :)

Actually, see'n as I need to use this function when I load another mp3 ... sound I actually make it a seperate function and just call it onEnterFrame?

I need to learn about array's as well.

And yes, all my sound stuff is handled inside the 'sounds' mc. [_root.sounds]

And the MP3's are the only thing that I'm loading externally.

Thanks SO much for your help Voetsjoeba! (phew what a name) ... I need you in my back pocket for future reference! hehe

:)

[Voetsjoeba]

Glad I could help, Tyler :) You can call me Voets or V if Voetsjoeba is too long ;)

You could make this a general function that dynmically loads a sound file given, so not MySounda specifically. A dynamic sound loading function. You could then store your filenames in an array, and then easy implement that in ther function to specify a songname to load.

If you need any help, just yell ;)

[TylerNZ]

Can we be friends V? Now that I can pronounce your name and all ... hahaha


YYYEEEELLLLL ... (that's me givin' you a yell) ...

I KINDA understand what you said ... but I'm actually building this MP3 player from scratch so that I can LEARN from the process ... and boy WHAT a process it has been ... (4th day on it) ...

Did you take a look at the site it's goin into?

Ok ... so, if I the onEnterFrame function into a general function called (loadingMP3) [or something] ... then create an Array with the song files to load? or the mc that the songs are loaded into?

What ya reckon?

Your new friend ... ME haha :pleased:

[Voetsjoeba]

Deal, friend ;)

Using arrays would be the easiest. Using arrays, you could also easily implement next and previous buttons in your mp3 plaer. If you'd press one of those buttons, the loading function takes the song on the current index - 1 of the array containing the filenames (array[3] to array [2], where 3 is the index number becoming 2), and preloads it, and plays it. Very handy system to work with :)

[TylerNZ]

Hey Friend ... what's wrong with this code? Just tryin to adapt it for multiple mp3 loads ... then I'll work on the array idea:


mySounda = new Sound();
mySounda.loadSound("Track2.mp3",false)
mySoundLoading = 0;
_root.sounds.loadBar._xscale = mySoundLoading;

this.onEnterFrame = function(){
loadMP3();
delete this.onEnterFrame;
}

function loadMP3() {
mySoundBytesTotal = mySounda.getBytesTotal();
mySoundBytesLoaded = mySounda.getBytesLoaded();
mySoundLoading = Math.round((mySoundBytesLoaded/mySoundBytesTotal)*100);
if (mySoundBytesTotal == mySoundBytesLoaded && mySoundBytesTotal > 0) {
mySounda.start(0,1)
_root.sounds.textd = mySounda.id3.TIT2;
_root.sounds.playing = true;
} else {
_root.sounds.textd = mySoundLoading + "%";
_root.sounds.loadBar._xscale = mySoundLoading;
}
}

mySounda.onSoundComplete = function() {
mySounda.loadSound("Track3.mp3",false);
loadMP3();
}

[Voetsjoeba]

That's still coded for one sound, mySounda, and you're only calling it once because you're immediately deleting the onEnterFrame. Try this instead:


Sound.prototype.preload = function(){
ref = this
mySoundLoading = 0;
_root.sounds.loadBar._xscale = mySoundLoading;
loader = _root.createEmptyMovieClip("temp"+Math.random(),5000)
loader.onEnterFrame = function () {
mySoundBytesTotal = ref.getBytesTotal();
mySoundBytesLoaded = ref.getBytesLoaded();
mySoundLoading = Math.round((mySoundBytesLoaded/mySoundBytesTotal)*100);
if (mySoundBytesTotal == mySoundBytesLoaded && mySoundBytesTotal > 0) {
ref.start(0,1)
_root.sounds.textd = ref.id3.TIT2;
_root.sounds.playing = true;
this.removeMovieClip()
} else {
_root.sounds.textd = mySoundLoading + "%";
_root.sounds.loadBar._xscale = mySoundLoading;
}
}
}
song = ["Track1.mp3","Track2.mp3","Track3.mp3"]
index = 0;
theSound = new Sound();
theSound.loadSound(song[index],false)
theSound.preload();


Something like that might work. This is all done out of my head so I can't guarantee it'll work, but give it a shot ;)

[TylerNZ]

Hey V ... thanks for that script ... could you explain a few things in it for me?

Sound.prototype .... what's this?

ref = this .... makes a variable called 'ref' containing the function results of preload?

then you create an empty movieclip (give it a random number) ... is that done for a reason? As apposed to giving it a logical name?

then when that mc is loaded/created we initalise the function that does all our preloading.

then down the bottom you have created the array 'song'
the variable index = 0 ... and then when they click the next button it would increase index


on(release){
index = index++;
mySounda.preload();
}


then right at the bottom you create the sound mc 'mySounda'
And into it, load the 1st array variable.
Then call the preload function.

PHEW ... what a marathon. Ok, so I put the code into my flash and it didn't work. I'm wondering what the ref variable is for? I see you refer to it furthing in the function, but does mySounda pass onto ref?

Thanks for your help V, you're awesome!!! I can attach the FLA if you want. Let me know

[Voetsjoeba]

Sound.prototype .... what's this?

This is the prototype object of the Sound class. Anything you place in that prototype object will be available to all instances of the Sound class. You make an instance of a class using new classname(), so new Sound() in this example.



Sound.prototype.traceHello = function(){
trace("hello");
}
Sound.prototype.two = 2;
yourSound = new Sound();
yourSound.traceHello();
// hello
trace(yourSound.two)
// 2


I suggest you read Senocular's AS 1.0 OOP tutorial. The greatest tutorial on this subject: that's where I learned it all too.

ref = this .... makes a variable called 'ref' containing the function results of preload?

Ref is a variable which targets the Sound instance on which the function is applied. In the above traceHello example, using this would target the instance of the Sound class that is executing this function. I use it because I need to target the instance inside the onEnterFrame handler. If I'd use 'this' there, I would be targetting the loader movieclip, and not the sound instance.

then you create an empty movieclip (give it a random number) ... is that done for a reason? As apposed to giving it a logical name?

Well, you could use a fixed name too. I just felt like using Math.random :P Since the movieclip is being removed after the sound has completely loaded, it doesn't make any difference. You could use a fixed name if you want to.

then when that mc is loaded/created we initalise the function that does all our preloading.

Yep, that movieclip is being created because we need it's onEnterFrame handler. The Sound object doesn't have this.

then down the bottom you have created the array 'song'
the variable index = 0 ... and then when they click the next button it would increase index.


on(release){
index = index++;
mySounda.preload();
}



You use one sound object for every track, because it's not very likely that you would have two songs playing at the same time. You increase index by 1, load song[index] (the increased index) into the sound object (theSound), and then you preload it using theSound.preload();



yourButton.onRelease = function(){
index+=1
theSound.stop();
theSound.loadSound(song[index],false);
theSound.preload();
}


This piece of code can be added right underneath the rest.

then right at the bottom you create the sound mc 'mySounda'
And into it, load the 1st array variable.
Then call the preload function.

Indeed, except that it's theSound, not mySounda.

PHEW ... what a marathon. Ok, so I put the code into my flash and it didn't work. I'm wondering what the ref variable is for? I see you refer to it furthing in the function, but does mySounda pass onto ref?

It can indeed be possible that it doesn't work: you need to change some values in it yourself, such as the path to the loadbar for example. If you give me your fla, I'll have a look at it.

[TylerNZ]

Right, I understand that.

Inbetween your answering I do a lot of playing around ... and I did manage to get it to work ....... to a point.

The problem now is that when it get's to the last track in my array ... I want it to go back to the first track and play that. SO, I put in this code:


mySounda.onSoundComplete = function() {
if (index < ilength) {
index = index+1;
mySounda.loadSound(song[index],false)
mySounda.preload();
}
else {
index = 0;
mySounda.loadSound(song[index],false)
mySounda.preload();
}
}
[/code]
Actually, I'll just put in the whole code:
[AS]
Sound.prototype.preload = function(){
ref = this
mySoundLoading = 0;
_root.sounds.loadBar._xscale = mySoundLoading;
loader = _root.createEmptyMovieClip("temp"+Math.random(),5000)
loader.onEnterFrame = function () {
mySoundBytesTotal = ref.getBytesTotal();
mySoundBytesLoaded = ref.getBytesLoaded();
mySoundLoading = Math.round((mySoundBytesLoaded/mySoundBytesTotal)*100);
if (mySoundBytesTotal == mySoundBytesLoaded && mySoundBytesTotal > 0) {
ref.start(0,1)
_root.sounds.textd = ref.id3.TIT2;
_root.sounds.loadBar._xscale = 100;
_root.sounds.playing = true;
this.removeMovieClip()
} else {
_root.sounds.playing = false;
_root.sounds.textd = mySoundLoading + "%";
_root.sounds.loadBar._xscale = mySoundLoading;
}
}
}
song = ["Track1.mp3","Track2.mp3","Track3.mp3"]
ilength = song.length;
index = 0;
mySounda = new Sound();
mySounda.loadSound(song[index],false)
mySounda.preload();

mySounda.onSoundComplete = function() {
if (index < ilength) {
index = index+1;
mySounda.loadSound(song[index],false)
mySounda.preload();
}
else {
index = 0;
mySounda.loadSound(song[index],false)
mySounda.preload();
}
}


I would love to send you the FLA ... I would rather no post it on the forum tho. Let me know if I can email it to you. ;)

You've been such an awesome helper V ... thanks SO much!!!
:D

[Voetsjoeba]

Sure, you can email them to me, but I think it would be better if you'd upload them somewhere and then email or pm me that link.

By the way, your script can be shortened:



mySounda.onSoundComplete = function() {
index < song.length ? index++ : index = 0
mySounda.loadSound(song[index],false)
mySounda.preload();
}


Did that work ? You didn't say.

[TylerNZ]

Yo V-ster ...

Yeh, I figured out why my code wasn't working ... it was becoz, my song.length variable was returning 3 ... and when the other code pulls a song from the array it starts from 0 ... so only goes to 2! AH HA!

So I made my ilength variable -1.

and I've replaced my lengthy code with your nice little one ... however, I don't understand it!!! Could you explain to me?

AND, can I call that onSoundComplete function from a button? Or do I need to make a seperate function and just call it from both onSoundComplete and my "next" button?

I'm doin really well, I've learnt SO much! I was tryin to make a cool transition thing like they have done with the background image on: http://www.imagomilano.com/ (click the Italian version / English doesn't work)

spent all day on it yesterday and gave up. A little over my head without a starter.

Anyway thanks once again! :D

[mlkedave]

Sorry for asking this little tid bit but is that navigations something you made from scratch or got it from some where? I could have sworn i had seen that before. Thanks

Mike

[TylerNZ]

which site are you referring to mlkedave? The site I gave a link to there, was just a site that was on an awards website. Great inspiration. You'll have to ask their designer where he got the code. :)