Cómo administrar llamadas en el dispositivo de comunicaciones Bluetooth predeterminado (HTML)

[ Este artículo está destinado a desarrolladores de Windows 8.x y Windows Phone 8.x que escriben aplicaciones de Windows Runtime. Si estás desarrollando para Windows 10, consulta la documentación más reciente ]

En este tutorial se explica cómo configurar el dispositivo de comunicaciones Bluetooth predeterminado para administrar las llamadas.

Lo que debes saber

Tecnologías

  • Windows Runtime

Requisitos previos

  • Debes estar familiarizado con HTML, JavaScript, eventos de Windows y controladores de eventos.
  • Para poder ejecutar esta muestra, necesitas un equipo habilitado para Bluetooth que ejecute el sistema operativo Windows 8 o la versión más reciente.

Instrucciones

Paso 1: Código para el archivo Default.html

En el ejemplo de CallControl, se usa el siguiente script HTML para dar formato a la pantalla con los elementos de interfaz de usuario que permiten experimentar la funcionalidad.

  • Este es el código HTML que se usa en el ejemplo de CallControl:
<!DOCTYPE html>
<html>
<head>
    <title>Call Control</title>
    
    <!-- WinJS references -->
    <link href="winjs/css/ui-light.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="WinJS/js/base.js"></script>
    <script type="text/javascript" src="WinJS/js/ui.js"></script>
    <script type="text/javascript" src="WinJS/js/wwaapp.js"></script>

    <!-- SDK Base references -->
    <link rel="stylesheet" type="text/css" href="css/base-sdk.css" />
    <script type="text/javascript" src="base-sdk.js"></script>

    <!-- Sample references -->
    <link rel="stylesheet" type="text/css" href="css/program.css" />
    <script type="text/javascript" src="program.js"></script>

</head>
<body role="application">
    <div id="rootGrid">
        <div id="header" role="contentinfo">
        </div>
        <div id="content">
            <h1>
                Call Control</h1>
            <h2 id="inputLabel">
                Input</h2>
            <div id="input" role="main" aria-labelledby="inputLabel">
                <div class="options">
                    <h3 id="listLabel">
                        Select scenario:</h3>
                    <select size="4" id="scenarios" aria-labelledby="listLabel">
                        <option selected="selected" value="1">1) Call Controls</option>
                    </select>
                </div>
                <div class="details" role="region" aria-labelledby="descLabel" aria-live="assertive">
                    <h3 id="descLabel">
                        Description:</h3>
                    <!-- Scenario 1 Input -->
                    <div class="item" id="scenario1Input">
                        <p>
                            To use this sample, ensure you have a bluetooth device and press the initialize
                            the call control button. After initialization you will be able to simulate an incoming
                            call by pressing the indicate phone call button. Use your bluetooth device to answer
                            and hang up the call. Redial and dial should work after initialization. Some devices
                            require a stream to be opened so a file will start playing to the default communications
                            device.
                        </p>
                        <button class="action" id="scenario1Initialize">
                            Initialize Call Buttons</button>
                        <button class="action secondary" id="scenario1Ring" disabled="disabled">
                            Indicate Phone Call</button>
                        <br />
                        <br />
                    </div>
                </div>
            </div>
            <div class="clear">
            </div>
            <h2 id="outputLabel">
                Output</h2>
            <div id="output" role="region" aria-labelledby="outputLabel" aria-live="assertive">
                <div id="statusMessage">
                </div>
                <!-- Scenario 1 Output -->
                <div class="item" id="scenario1Output">
                    <audio id="audiotag" src="folk_rock.mp3" msaudiocategory="communications"
                        msaudiodevicetype="communications" loop>
                    </audio>
                </div>
            </div>
        </div>
        <div id="footer" role="contentinfo">
        </div>
    </div>
</body>
</html>

Paso 2: Código para el archivo Default.js

Como parte de la inicialización, el ejemplo de CallControl configura escuchas de eventos y las enlaza con controladores de eventos para responder a los botones, incluidos los botones para responder y colgar.

  • Este es el código JavaScript que se usa en el ejemplo de CallControl:
//// THIS CODE AND INFORMATION IS PROVIDED "AS IS" WITHOUT WARRANTY OF
//// ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT LIMITED TO
//// THE IMPLIED WARRANTIES OF MERCHANTABILITY AND/OR FITNESS FOR A
//// PARTICULAR PURPOSE.
////
//// Copyright (c) Microsoft Corporation. All rights reserved

/// <reference path="base-sdk.js" />

(function () {

    // Initialize the call control object here using the default bluetooth communications device
    var callControls = null;
    var callToken;
    var audiotag;

    function id(elementId) {
        return document.getElementById(elementId);
    }

    function initDevice() {
        if (!callControls) {
            try {
                callControls = Windows.Media.Devices.CallControl.getDefault();

                if (callControls) {
                    // Add the event listener to listen for the various button presses
                    callControls.addEventListener("answerrequested", answerButton, false);
                    callControls.addEventListener("hanguprequested", hangupButton, false);
                    callControls.addEventListener("audiotransferrequested", audiotransferButton, false);
                    callControls.addEventListener("redialrequested", redialButton, false);
                    callControls.addEventListener("dialrequested", dialButton, false);

                    sdkSample.displayStatus("Call Controls Initialized");
                    id("scenario1Ring").disabled = false;
                } else {
                    sdkSample.displayError("No Bluetooth device detected.");
                }
            }
            catch (e) {                
                sdkSample.displayError("No Bluetooth device detected.");
            }
        }
    }

    function newIncomingCall() {
        // Indicate a new incoming call and ring the headset.
        callToken = callControls.indicateNewIncomingCall(true, "5555555555");
        sdkSample.displayStatus("Call Token: " + callToken);
    }

    function answerButton() {
        // When the answer button is pressed indicate to the device that the call was answered
        // and start a song on the headset (this is done by streaming music to the bluetooth
        // device in this sample)
        sdkSample.displayStatus("Answer requested: " + callToken);
        callControls.indicateActiveCall(callToken);
        audiotag = document.getElementById("audiotag");
        audiotag.play();
    }

    function hangupButton() {
        // Hang up request received.  The application should end the active call and stop
        // streaming to the headset
        sdkSample.displayStatus("Hangup requested");
        callControls.endCall(callToken);
        audiotag = document.getElementById("audiotag");
        audiotag.pause();
    }

    function audiotransferButton() {
        // Handle the audio transfer request here
        sdkSample.displayStatus("Audio Transfer requested");
    }

    function redialButton(redialRequestedEventArgs) {
        // Handle the redial request here.  Indicate to the device that the request was handled.
        sdkSample.displayStatus("Redial requested");
        redialRequestedEventArgs.handled = true;
    }

    function dialButton(dialRequestedEventArgs) {
        // A device may send a dial request by either sending a URI or if it is a speed dial,
        // an integer with the number to dial.
        if (typeof(dialRequestedEventArgs.contact) === "number") {
            sdkSample.displayStatus("Dial requested: " + dialRequestedEventArgs.contact);
            dialRequestedEventArgs.handled = true;
        }
        else {
            sdkSample.displayStatus("Dial requested: " + dialRequestedEventArgs.contact.schemeName + ":" +
            dialRequestedEventArgs.contact.path);
            dialRequestedEventArgs.handled = true;
        }
    }

    function initialize() {
        id("scenario1Initialize").addEventListener("click", initDevice, false);
        id("scenario1Ring").addEventListener("click", newIncomingCall, false);
        id("scenarios").addEventListener("change", onScenarioChanged, false);
    }

    function onScenarioChanged() {
        sdkSample.displayStatus("");
    }

    document.addEventListener("DOMContentLoaded", initialize, false);
})();

Paso 3: Ejecutar y probar el ejemplo de CallControl

  • En la descripción de esta muestra, podrás encontrar instrucciones detalladas para compilar, ejecutar y probar la muestra. Para ver las instrucciones de compilación y otras instrucciones para esta muestra, consulta la muestra de control de llamadas.

Observaciones

Algunos dispositivos necesitan que primero se abra una secuencia de audio, para que se pueda comenzar a reproducir un archivo de audio en el dispositivo de comunicaciones predeterminado.

Para obtener directrices de desarrollo y procedimientos recomendados para administrar llamadas en una aplicación de la Tienda Windows, consulta el tema sobre directrices para el desarrollo de aplicaciones compatibles con audio

Temas relacionados

Ejemplo de control de llamadas

Directrices para el desarrollo de aplicaciones compatibles con audio