CODEWITHSUNDEEP
javascriptsoundjs
C.topo
C.topo

Reputation: 17

Add pause function to soundjs

I have tried using:

  1. createjs.Sound.pause;

  2. mySound.stop();

Nothing works. Right now it have a stop button but if the stop button is pressed then the sound would not be played again.

This is the soundjs that im using. soundjs

My code is exactly the same with the source code of it. Thanks for any help!

I end up doing it like this Based on Stephen Lightcap answer:

Javascript inside the head tag:

    function load() {
        // Update the UI
        document.getElementById("display").innerText = ".";


        // Load the sound
        createjs.Sound.alternateExtensions = ["mp3"];
        createjs.Sound.addEventListener("fileload", handleFileLoad);
        createjs.Sound.registerSound({id:"mySound", src:"../../test.mp3"});
    }

    function handleFileLoad(event) {
        // Update the UI
        document.getElementById("display").innerHTML = ".";
        document.getElementById("stopBtn").disabled = "";

        // Play the loaded sound
        createjs.Sound.play(event.src,{loop:2});

    }
    var instance = createjs.Sound.play(event.src);
</script>

Button inside the body tag:

<input id="pausBtn" type="button" value="Pause" onclick="pause()"/>

Javascript for the button onclick. Placed below the button. :

<script>
function pause(){
instance.pause();
}
</script>

But I got an error saying :

Uncaught TypeError: Cannot read property 'pause' of undefined at pause (phkk.html:560) at HTMLInputElement.onclick (phkk.html:177)

Upvotes: 1

Views: 1971

Answers (1)

Stephen
Stephen

Reputation: 1148

You can store it in an var and then use the function pause()

var instance = createjs.Sound.play(event.src);

Have button that calls a method that will store the pause

<input id="pausBtn" type="button" value="Pause" onclick="pause()"/>

The JS function:

function pause(){
    instance.pause();
}

EDIT

I went over the docs and it appears it doesn't function like that any more, so you're going to have to use the paused property

Here's a rough outline on how it works for me: 

<script>

    var instance; 

    function load() {
        // Update the UI
        document.getElementById("display").innerText = ".";


        // Load the sound
        createjs.Sound.alternateExtensions = ["mp3"];
        createjs.Sound.addEventListener("fileload", handleFileLoad);
        createjs.Sound.registerSound({id:"mySound", src:"../../test.mp3"});
    }

   function handleFileLoad(event) {
       // Update the UI
       document.getElementById("display").innerHTML = ".";
       document.getElementById("stopBtn").disabled = "";

       // Play the loaded sound
       instance = createjs.Sound.play(event.src,{loop:2});

   }

   function pause(){
       instance.paused ? instance.paused = false : instance.paused = true;
   }



</script>

The HTML buttons:

<body>
<input id="loadBtn" type="button" value="Begin Loading" onclick="load()"/>
<input id="stopBtn" type="button" value="Stop Playing" onclick="createjs.Sound.stop();" disabled="disabled" />
    <input id="pauseBtn" type="button" value="Pause" onclick="pause()"/>
<label id="display">Waiting for User Input. Click "Begin Loading".</label>

Upvotes: 0

Related Questions