Canvass: How to listen for the end of a sound event

[codeBeastAdobe]

Hi. I finally got the first part of this working. 

I am trying to check for end of a sound.

However, all the examples I see don't seem to work. 

The console says I can't use .on

this.btn_play.addEventListener("click", buttonClicked.bind(this));
function buttonClicked () {

var instance = createjs.Sound.play("itemName"); 
//instance.on("complete", this.handleComplete, this);

if (itemName=="monkey") {
monkeyClickSound.play("monkeySound");
completeMonkeySound = monkeyClickSound.play("monkeySound");
completeMonkeySound.on("complete", this.handleComplete, this);
}

if (itemName=="froggy") {
froggyClickSound.play("froggySound");
}


this.genie.visible=true;
this.genie_static.visible=false;

//monkeyClickSound.on("complete", handleComplete, null, true);
}

function handleComplete() {
console.log("sound complete works");
this.genie.visible=false;
this.genie_static.visible=true;
}

[JoãoCésar · Accepted solution]

Hi.

This approach should work:

function soundButtonHandler()
{
	var sound = createjs.Sound.play("LibSoundLinkage", { volume: 0.2 });
	sound.on("complete", soundCompleteHandler, this);
}

function soundCompleteHandler()
{
	alert("Sound complete.");
}

this.soundButton.on("click", soundButtonHandler, this);

Please notice that the code of your first commented line should be:

instance.on("complete", handleComplete, this);

And not:

// handleComplete is a function and not a method so the 'this' keyword is not used
instance.on("complete", this.handleComplete, this);

I hope this helps.

Regards,

JC

[codeBeastAdobe]

Hi thank you for answering so quickly and on a Sunday.

I have added your code but I don't know how to connect my first parts of code to yours. This is how I have things at the moment. I don't understand libSoundLinkage very well.

//Play sounds
var preload = new createjs.LoadQueue();
preload.addEventListener("fileload", handleFileComplete);
preload.loadFile ("sounds/monkey.mp3", "itemSound");

//Register sounds
function handleFileComplete (event) {
	createjs.Sound.registerSound("sounds/monkey.mp3", "monkeySound");
	createjs.Sound.registerSound("sounds/froggy.mp3", "froggySound");
	
//Prepare sounds
	monkeyClickSound = createjs.Sound.play("monkeySound");
	froggyClickSound = createjs.Sound.play("froggySound");
}

this.soundButton.on("click", soundButtonHandler, this);

function soundButtonHandler()
{
	var sound = createjs.Sound.play("LibSoundLinkage", { volume: 0.2 });
	sound.on("complete", soundCompleteHandler, this);
}

function soundCompleteHandler()
{
	alert("Sound complete.");
	this.genie.visible=false;
	this.genie_static.visible=true;
}

[codeBeastAdobe]

Your answer was great. I changed one line of code and it all worked so well.

//var sound = createjs.Sound.play("LibSoundLinkage", { volume: 0.2 });
var sound = createjs.Sound.play(itemName);

itemName being froggy, monkey etc... which I get from the drag target

itemName = evt.currentTarget.name;

BUT I'm very interested to know what 

"LibSoundLinkage"

the following means, just to see if I am doing things properly. I mean it works but it may be a bad way of doing things. 

[JoãoCésar]

Great!

It's a wise approach to use the current target name as the linkage.

"LibSoundLinkage" is just a generic suggestion for linkage names in the Library. It's not something special. Don't worry.

[codeBeastAdobe]

Thank you so much.