How to pause/stop playing audio and replace with new audio file

Question

So when the user clicks a button an audio file plays from an array of audio files(around 2 sec clip), which works fine. However, if the user repeatedly clicks the button, the audio files start to play over each other. Ideally, I would like to stop/pause the previous audio file and then play the new audio file. This is what I've tried to avail:

$scope.sounder=function(){


$scope.rs=$scope.diff[$scope.workout_index].audiorep;
$scope.ms=$scope.diff[$scope.workout_index].audiomove;

  //var movesound = new Audio ($scope.ms);
  //ar repsound = new Audio ($scope.rs);

  var movesound = new Media($rootScope.getMediaURL($scope.ms));
  var repsound = new Media($rootScope.getMediaURL($scope.rs));

  if($scope.muter==0){



      movesound.pause();//DOES NOT WORK
      movesound.stop();//STOPS ALL AUDIO FROM PLAYING, SO NOTHING PLAYS

      $timeout(function() {
        movesound.play();
      }, 1000);

      $timeout(function() {
        repsound.play();
      }, 3000);

  }

  if($scope.muter==1){
    console.log("Rachel has been muted");
    return;
  }
 }

Did you try movesound.destroy(); ? – MatMat May 29 '17 at 20:19 — MatMat, May 29 '17 at 20:19
Just tried it, doesn't allow any file to play. – MehdiN May 30 '17 at 03:24 — MehdiN, May 30 '17 at 03:24

pro_cheats · Accepted Answer · 2017-05-30T06:59:30.483

You can achieve the functionalities with JavaScript in Cordova unless you specifically need AngularJS in your app.

<audio controls  id="myAudio">
  <source src="horse.ogg" type="audio/ogg">
  <source src="horse.mp3" type="audio/mpeg">
   Your browser does not support the HTML5 audio tag.
</audio>

Now using script to add functionalities -

<script> 
var aud= document.getElementById("myAudio"); 

function playAud() { 
    aud.play(); 
} 

function pauseAud() { 
    aud.pause(); 
} 

function myFunction() { 
  isSupp = aud.canPlayType("audio/mp3");
  if (isSupp == "") {
    aud.src = "audio.ogg";
  } else {
    aud.src = "audio.mp3";
  }
  aud.load();
}
</script>

See other answers of this question on for changing source of audio with JavaScript.

Refer w3schools HTML Audio Video DOM reference Page for further attributes and functions.

I appreciate this answer, but yes it has to be AngularJS as there are other factors in which it is useful for my app. Thanks anyway :) — MehdiN, May 30 '17 at 16:54

How to pause/stop playing audio and replace with new audio file

1 Answers1