JQuery stop/pause sound playing in for loop

Question

I'm trying to get a for loop playing repeatedly a sound until a variable changes:

var ding;
for(ding = 1; ding < 20; ding++) {
    function chamada() {
        jQuery.playSound('components/com_chat/sys/chamada');
    }
    var delay = ding * 2500;
    setTimeout(chamada, delay);
    if (ding == 0){
        break;
    }
}

The external .js file with playSound function:

 (function($){$.extend({
  playSound: function(){
    return $(
      '<audio autoplay="autoplay" style="display:none;">'
        + '<source src="' + arguments[0] + '.mp3" />'
        + '<source src="' + arguments[0] + '.ogg" />'
        + '<embed src="' + arguments[0] + '.mp3" hidden="true" autostart="true" loop="false" class="playSound" />'
      + '</audio>'
    ).appendTo('body');
  }
  });
  })(jQuery);

EDITED

Code is working and will stop on the end of the loop, but won't stop when I define ding = 0 clicking on the dialog:

  ConfirmDialog('answer');
        function ConfirmDialog(message){
            jQuery('<div></div>').appendTo('body')
                .html('<div class="widget">answering</div>')
                .dialog({
                    modal: true, title: 'answer', zIndex: 10000, autoOpen: true,
                    width: 'auto', resizable: false,
                    buttons: {
                        "Answer": function () {
                            ding = 0;
                        },
                        Cancelar: function () {
                        //...
                        }
                    },
                    close: function (event, ui) {
                        jQuery(this).remove();
                    }
                });
            };
        }

How can I make it stop when ding = 0?

for(ding =19; ding>=0 ; ding -- ) :D or call the function with ding=0 — MNJ, Apr 25 '17 at 13:42
@Milos Nikolik can you give me an example of what you mean? :) — Adry, Apr 25 '17 at 14:01

score 2 · Answer 1 · answered Apr 25 '17 at 13:40

2

var ding;
for(ding = 1; ding < 20; ding++) {
    function chamada() {
        jQuery.playSound('components/com_chat/sys/chamada');
    }
    var delay = ding * 2500;
    setTimeout(chamada, delay);
    if (ding == 0){
        break;
    }
}

In this code you have your ding variable increasing not decreasing, so it wont ever actually reach 0.

answered Apr 25 '17 at 13:40

Chaim Friedman

6,124
4
33
61

Yes, it's not suppose to reach 0, I want to externally define it to 0 and stop the sound to play. – Adry Apr 25 '17 at 13:41
can you post some code of where you want to set it to 0? – Chaim Friedman Apr 25 '17 at 13:44
@promisfied I edited my question to better explain that, sorry guys I wasn't clear before. – Adry Apr 25 '17 at 13:58

score 0 · Answer 2 · edited May 23 '17 at 12:02

I solve the problem with this code:

      var stop_ding = 0;
      var i = 1;   
        function myLoopChamada () { 
           setTimeout(function chamada() {
            jQuery.playSound('components/com_chat/sys/chamada');
              i++;
              console.log('ding '+i);
              if (i < 20) {
                  if(stop_ding != 1){
                    myLoopChamada();
                  }
              }                   
           }, 3000)
        }
        myLoopChamada();

That permits the for loop to delay every 3 seconds, before it was iterate at once, that's why it couldn't be stopped. Than I added on my dialog button answer function:

 stop_ding = 1;

As per this other questions:

How do I add a delay in a JavaScript loop?

Hope it can help someone else!

JQuery stop/pause sound playing in for loop

2 Answers2