Composant de configuration du matériel

Le composant Hardware Setup fournit une interface utilisateur pour les clients utilisant l'interface [OpenTok.js] 1 pour sélectionner la caméra et le microphone. Le client peut utiliser la caméra et le microphone pour publier un flux vers une session OpenTok.js OpenTok.js.

Vous pouvez ajouter une version préconstruite du composant de configuration matérielle à votre page web à l'aide de la balise de script suivante :

<script src="https://static.opentok.com/hardware-setup/v1/js/opentok-hardware-setup.min.js"></script>

Vous pouvez également créer (et modifier) le composant à partir du fichier code source sur GitHub.

Utilisation du composant

Utilisez le composant avec [OpenTok.js]. 1 SDK.

createOpentokHardwareSetupComponent()

Pour initialiser le composant Configuration du matériel, appelez la commande createOpentokHardwareSetupComponent() Cette méthode prend en compte les éléments suivants Cette méthode prend les paramètres suivants :

• targetElement -- L'élément DOM dans lequel insérer le composant de configuration du matériel du matériel. (Voir la propriété insertMode du paramètre suivant, options).

• options -- Un argument optionnel qui spécifie comment le composant sera inséré dans le DOM HTML, en relation avec le paramètre targetElement. Vous pouvez ce paramètre à l'une des valeurs suivantes :

  • "replace" -- Le composant remplace le contenu de l'élément cible. Il s'agit de la la valeur par défaut.
  • "after" -- Le composant est un nouvel élément inséré après l'élément cible dans le DOM HTML. dans le DOM HTML. (Le composant et l'élément cible ont le même élément parent). parent).
  • "before" -- Le composant est un nouvel élément inséré avant le targetElement dans le DOM HTML. (Le composant et l'élément cible ont le même élément parent). parent).
  • "append" -- Le composant est un nouvel élément ajouté en tant qu'enfant de l'élément targetElement. S'il existe d'autres éléments enfants, le composant est ajouté en tant que dernier élément enfant de l'élément cible.

• completionHandler -- Une fonction qui est appelée lorsque le composant est rendu sur la page ou en cas d'erreur lors de l'appel de la méthode. est rendu sur la page ou en cas d'erreur lors de l'appel de la méthode. En cas d'erreur, cette fonction se voit passer un objet ayant une valeur message qui peut prendre l'une des valeurs suivantes peut avoir l'une des valeurs suivantes :

  • "Aucun élément n'a été fourni pour placer le composant"
  • "Ce navigateur ne prend pas en charge les API getMediaDevices"
  • "Il n'y a pas d'appareils audio ou vidéo disponibles.

  Lorsque le composant est rendu avec succès sur la page, le gestionnaire d'achèvement est appelé sans objet d'erreur. est appelé sans objet d'erreur.

La méthode renvoie un objet HardwareSetup, qui possède les méthodes suivantes : audioSource(), videoSource()et destroy().

Exemple :

// Replace this with the ID of the target DOM element for the component
var element = document.querySelector('#hardware-setup');

var options = {
  insertMode: 'append' // Or use another insertMode setting.
};

var component = createOpentokHardwareSetupComponent(element, options, function(error) {
  if (error) {
    console.error('Error: ', error);
    element.innerHTML = '<strong>Error getting devices</strong>: '
      error.message;
    return;
  }
  // Add a button to call component.destroy() to close the component.
});

HardwareSetup.audioSource()

Renvoie un objet représentant la source audio sélectionnée. Cet objet possède un deviceId qui est l'identifiant unique de l'appareil audio (une chaîne). Vous pouvez stocker cette chaîne dans un cookie pour l'utiliser lors d'une prochaine session. Vous pouvez transmettre l'objet l'objet source audio ou son deviceId comme valeur pour la propriété audioSource de l'objet properties passé dans la fonction OT.initPublisher() méthode.

Exemple :

// component is the object returned by createOpentokHardwareSetupComponent()
var publisherOptions = {
  audioSource: component.audioSource(),
  videoSource: component.videoSource()
};
OT.initPublisher(targetElement, publisherOptions);

HardwareSetup.videoSource()

Renvoie un objet représentant la source vidéo sélectionnée. Cet objet possède un élément deviceId qui est l'identifiant unique du périphérique vidéo (une chaîne). Vous pouvez stocker cette chaîne dans un cookie pour l'utiliser lors d'une prochaine session. Vous pouvez transmettre l'objet l'objet source vidéo ou son deviceId comme valeur pour la propriété videoSource de l'objet properties passé dans la fonction OT.initPublisher() méthode.

Exemple :

// component is the object returned by createOpentokHardwareSetupComponent()
var publisherOptions = {
  audioSource: component.audioSource(),
  videoSource: component.videoSource()
};
OT.initPublisher(targetElement, publisherOptions);

HardwareSetup.destroy()

Ferme le composant de configuration du matériel (s'il est visible) et le supprime du DOM HTML.

Exemple :

// component is the object returned by createOpentokHardwareSetupComponent()
component.destroy();