Well, it might be allright to put sounds into the timeline, but me too, I never did or do that. Probably this goes back a long time, it all started with a certain method called puppetSound
. I just got used to deal with sounds and soundFXs through code. Having sounds or soundFXs in the timeline means lousy control of those.
And as SSSSSSBenay writes "I use very short sound effects which are played when certain frames are reached within my animations, or when a button is clicked, etc.", or when a button is clicked! I mean, seriously, nobody should suggest here to go to a certain frame in the timeline, only to play a soundFX on a click on a button. I don't believe it.
So i think Benay's wish to learn SoundJS in order to be more versatile with sound effects in his work, is a good plan. And sometimes one has to go an extra mile to learn the craft well. Even if there were simpler ways for the lazy.
I admit I'm too still learning to manage SoundJS to such an extend that I feel perfectly at home. But I paste here my latest experiment and hope it might help to get into SoundJS. The packaged file including sounds is here https://adobe.ly/2Y7tdw3.
var here = this;
here.stop();
/* make a listing of all sounds used with sub-folder (assetPath) and file names and id to reference later */
var assetPath = "sounds/";
var sounds = [{
src: "airport.mp3",
id: "id_air"
}, {
src: "samisen.mp3",
id: "id_sam"
}, {
src: "whoosh.mp3",
id: "id_who"
}];
/* I use the next two variables to detect later if all sounds are loaded */
var soundsCount = 0;
var soundsLength = sounds.length;
var btns = ["t_air", "t_sam", "t_who", "t_next"];
/* The fileload event is fired for each loaded sound */
createjs.Sound.on("fileload", handleLoad);
/* Register an array of audio files for loading and future playback in Sound */
createjs.Sound.registerSounds(sounds, assetPath);
function handleLoad(e) {
soundsCount++;
if (soundsCount == soundsLength) {
/* all sounds are loaded */
here.airport = createjs.Sound.createInstance("id_air");
here.samisen = createjs.Sound.createInstance("id_sam");
here.whoosh = createjs.Sound.createInstance("id_who");
/* set all sound buttons to visible */
here.toggleBtnsVisi();
}
}
this.on("click", clickHandler, here, false);
function clickHandler(e) {
var etn = e.target.name;
if (etn == "t_air") {
here.airport.play({
volume: 0.33
});
e.target.visible = false;
/* Listen to when sound play has finished */
here.airport.on("complete", handleSoundCompletes, null, true)
}
if (etn == "t_sam") {
here.samisen.play();
e.target.visible = false;
here.samisen.on("complete", handleSoundCompletes, null, true);
}
if (etn == "t_who") {
here.whoosh.play({
loop: 1
});
e.target.visible = false;
here.whoosh.on("complete", handleSoundCompletes, null, true);
}
if (etn == "t_next") {
here.gotoAndStop(9);
}
if (etn == "t_prev") {
here.gotoAndStop(0);
}
}
function handleSoundCompletes(e) {
if (e.target.src.indexOf("airport") != -1) {
here.t_air.visible = true;
}
if (e.target.src.indexOf("samisen") != -1) {
here.t_sam.visible = true;
}
if (e.target.src.indexOf("whoosh") != -1) {
here.t_who.visible = true;
}
}
here.toggleBtnsVisi = function () {
for (var i = 0; i < btns.length; i++) {
if (!here.start) {
here[btns].visible = false;
here.start = true;
} else {
here[btns].visible = true;
}
}
};
stage.on("drawstart", here.toggleBtnsVisi, here, true);
This code is valid in all frames of this timeline. One can jump between frame 0 or frame 9 and the sound references and completeHandler work throughout.
Klaus