iRec revision stop button - CGastrell/phonegap GitHub Wiki

En algun momento dudamos en sacar este boton, pero creo que esta bien que el usuario pueda detener la reproduccion y que todo vuelva a 0.

La funcionalidad es muy simple, en el handler de pagecreate de #revision vamos a agregar la inicializacion del boton #stop que, si mal no recuerdo, ya lo tenemos en el HTML:

<button id="stop" class="ui-btn ui-btn-inline ui-mini">Stop</button>

El handler de pagecreate de #revision es donde agregamos la inicializacion del boton volver. Ahora agregamos dentro de pagecreate la inicializacion del boton #stop:

  // este es el codigo de pausa, solo de referencia, no lo copien
  $('#pausa').click(function(e){
    e.preventDefault();
    revisionApi.pausa();
  });

  // este es el codigo de stop
  $('#stop').on('click', function(e){
    e.preventDefault();
    revisionApi.stop();
  });

Es simple, cuando hacemos click queremos detener el comportamiento por defecto del boton y simplemente llamar a revisionApi.stop(), que no existe, asi que vamos a agregarlo.

Agreguen un metodo en el objeto revisionApi que se llame stop():

  stop: function() {
    revisionApi.audio.stop();
  },

Nuevamente sucede que revisionApi tiene, ademas, un handler para cuando la reproduccion se detiene, entonces no necesitamos agregar mas codigo al metodo stop(), el resto se ejecutara en revisionApi.onSuccess() (si, el nombre es malisimo, pero es el que tenia y no lo refactoreamos en su momento). El handler revisionApi.onSuccess() tiene este codigo, que necesita un minimo cambio:

  onSuccess: function(){
    if(revisionApi.interval) {
      clearInterval(revisionApi.interval);
      revisionApi.currentTime.text("00:00");
      revisionApi.interval = null;
      revisionApi.isPlaying = false;
    }

    console.log('media stop/played/rec success');
  },

Los cambios son pocos: sacamos las 3 lineas que resetean los indicadores fuera del if y agregamos una llamada para cambiar todos los botones de tag al estado en el cual todavia no fueron escuchados:

  onSuccess: function(){
    if(revisionApi.interval) {
      clearInterval(revisionApi.interval);
    }
    revisionApi.currentTime.text("00:00");
    revisionApi.interval = null;
    revisionApi.isPlaying = false;

    // volver los botones al color original
    $('button.tag').css('background-color', revisionApi.colorTagPendiente);

    console.log('media stop/played/rec success');
  },

Con la siguiente correccion volveremos a estos archivos ya que vamos a agregar la funcionalidad al boton para retroceder 10 segundos durante la revision