Comment gérer les appels sur le périphérique de communication Bluetooth par défaut (HTML)

[ Cet article est destiné aux développeurs Windows 8.x et Windows Phone 8.x qui créent des applications Windows Runtime. Si vous développez une application pour Windows 10, voir la Documentation ]

Ce didacticiel vous montre comment configurer le périphérique de communication Bluetooth par défaut pour gérer les appels.

Ce que vous devez savoir

Technologies

  • Windows Runtime

Prérequis

  • Vous devez vous familiariser avec le code HTML, le langage JavaScript, les événements Windows et les gestionnaires d’événements.
  • Pour exécuter cet échantillon, vous devez disposer d’un ordinateur Bluetooth qui exécute Windows 8 ou un système d’exploitation plus récent.

Instructions

Étape 1: Code pour le fichier Default.html

L’exemple CallControl utilise le script HTML suivant pour formater l’écran avec les éléments IU qui vous permettent d’expérimenter sa fonctionnalité.

  • Voici le code HTML que l’exemple CallControl utilise :
<!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>

Étape 2: Code pour le fichier Default.js

Dans le cadre de l’initialisation, l’exemple CallControl configure les détecteurs d’événements et les lie aux gestionnaires d’événements pour répondre aux boutons, y compris le bouton permettant de répondre ou de mettre fin à un appel.

  • Voici le code JavaScript que l’exemple CallControl utilise :
//// 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);
})();

Étape 3: Exécuter et tester l’exemple CallControl

  • Des instructions détaillées sur le développement, l’exécution et le test de cet exemple sont fournies dans la description spécifique de l’exemple. Pour consulter la build et d’autres instructions pour cet exemple, consultez Exemple Call Control.

Remarques

Certains périphériques nécessitent qu’un flux audio soit d’abord ouvert, pour qu’un fichier audio puisse commencer à exécuter le périphérique de communication par défaut.

Pour obtenir des recommandations et les meilleures pratiques en matière de gestion des appels dans une application du Windows Store, voir Recommandations concernant le développement d’applications prenant en charge l’audio

Rubriques associées

Exemple de contrôle d’appel

Recommandations concernant le développement d’applications prenant en charge l’audio