javascripttwiliodtmf

Twilio .sendDigits() not working with WebRTC client out-bound call


I am creating a Twilio WebRTC soft phone which is almost complete. I need the agent to be able to enter any of 10-digit DTMF touch-tones manually in the course of an out-bound call. I am using the .sendDigits() function but it does not produce a touch-tone in a call. All of my other functions work, but I am a bit stuck...

<script type="text/javascript">

  Twilio.Device.setup("<?php echo $token; ?>");

  Twilio.Device.ready(function (device) {
    $("#log").text("Client '<?php echo $clientName ?>' is ready");
  });

  Twilio.Device.error(function (error) {
    $("#log").text("Error: " + error.message);
  });

  Twilio.Device.connect(function (conn) {
    $("#log").text("Successfully established call");
  });

  Twilio.Device.disconnect(function (conn) {
    $("#log").text("Call ended");
  });

  var connection;

  Twilio.Device.incoming(function(conn) {
      connection = conn;

      $("#number").val(conn.parameters.From);
      var ss= "Incomging Call:\n"+conn.parameters.From;
      $("#log").text("Incoming connection from " + conn.parameters.From);

      //enable the accept button
      $(".accept").prop('disabled', false);
  });

  function accept() {
      connection.accept();
  }

  function call() {
    // get the phone number to connect the call to
    params = {"PhoneNumber": $("#number").val()};
    Twilio.Device.connect(params);
  }

  function hangup() {
    Twilio.Device.disconnectAll();
  }

  function senddigits() {

      if (connection!=null)
          connection.sendDigits("1");
  }
</script>

I call the function with a simple button...

<button onclick="senddigits();">1</button>

My code is based on this solution, and the Twilio.connection documentation.


Solution

  • I was able to find the problem. I just needed to add connection = conn; in the connect function...

    Twilio.Device.connect(function (conn) {
            $("#log").text("Successfully established call");
            connection = conn;
          });