Using event handler on switch() function to reset audio loop

Question

I'm using switch() to play sounds when certain keys are pressed, but I would like to get the sound loop to stop and reset when letting up on the key. Here is my code:

$(function() {
   $(document).on("keydown", function(key) {
        switch(parseInt(key.which, 10)) {
            case 65:
                $("#sound").get(0).play();
                break;

            case 83:
                $("#sound2").get(0).play();
                break;

            case 68:
                $("#sound3").get(0).play();
                break;

            case 70:
                $("#sound4").get(0).play();
                break;

        };
   }).on("keyup", function() {
      $(this).pause();
      $(this).currentTime=0;
  });
});

I think my problem lies in using $(this) within the keyup handler, but I don't want to specify each sound id as a variable as I will ultimately have many of them. Is there a way to do this simply?

Thanks for the help!

score 1 · Answer 1 · answered Oct 18 '13 at 02:47

1

this inside the keyup handler refers to the document object, you can try to keep a reference to the currently playing sound element

$(function() {
    var playing;
    $(document).on("keydown", function(key) {
        playing = undefined;
        switch(parseInt(key.which, 10)) {
            case 65:
                playing = $("#sound").get(0);
                break;

            case 83:
                playing = $("#sound2").get(0);
                break;

            case 68:
                playing = $("#sound3").get(0);
                break;

            case 70:
                playing = $("#sound4").get(0);
                break;

        };
        if(playing){
            playing.play();
        }
    }).on("keyup", function() {
        if(playing){
            playing.pause();
            playing.currentTime=0;
            playing = undefined;
        }
    });
});

answered Oct 18 '13 at 02:47

Arun P Johny

384,651
66
527
531

Hi Arun, thanks for the help. This didn't seem to work. The sounds won't play at all now. – logicForPresident Oct 18 '13 at 11:53
@Paul can you add a `console.log(playing)` before the if condition in keydown handkler – Arun P Johny Oct 18 '13 at 12:02
I took the if() statement out of the playing.play() line and it works perfectly now, which makes sense considering playing isn't a boolean value. Thanks so much for your help! – logicForPresident Oct 18 '13 at 12:11
Oh yeah, you're right. I put it back in and it works now. I must have had another piece of code wrong. – logicForPresident Nov 01 '13 at 01:10
I have one other question...I'm now trying to use the setTimeout() method so that the notes will play faster (right now there is a delay between notes), but I can't figure out where to put the setTimout(). Would you be able to help me with this? – logicForPresident Nov 01 '13 at 01:13
@Paul Can you explain again? what are you trying to do with `setTimeout()` – Arun P Johny Nov 01 '13 at 01:39
So right now the sounds play on keydown, but there is a delay when I move from key to key and press them down. I read about setTimout() on this post: http://stackoverflow.com/questions/13538168/is-it-possible-to-make-jquery-keydown-respond-faster. and this is basically exactly what I would like to do (except with sounds instead of animation, of course). However, I can't figure out where to place the call for setTimeout(). – logicForPresident Nov 01 '13 at 01:59
@Paul the delay might be because of the latency in loading the audio content/buffering of the content... can you check whether the delay is there only for the first attempt of each key or is it there for second attempt of the keys as well – Arun P Johny Nov 01 '13 at 02:03
@Paul have a look at the `preload="auto"` attribute of [audio](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio) – Arun P Johny Nov 01 '13 at 02:11
let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/40347/discussion-between-paul-and-arun-p-johny) – logicForPresident Nov 01 '13 at 02:26

Using event handler on switch() function to reset audio loop

1 Answers1