Réglage de la position initiale et des dimensions d'une vidéo

Lorsque vous publiez une vidéo, vous pouvez spécifier l'élément DOM (ou son ID) que l'éditeur remplacera. Vous pouvez également spécifier la largeur et la hauteur initiales de l'éditeur :

// Replace the first parameter with ID of the target DOM element:
var publisher = OT.initPublisher('myPublisherElementId',
                                 {width:400, height:300});
session.publish(publisher);

Vous pouvez également régler la insertMode des options que vous passez dans la fonction OT.initPublisher() à "append" pour que l'éditeur soit ajouté en tant qu'enfant de l'élément DOM (conteneur) que vous spécifiez :

var publisherOptions = {
  insertMode: 'append',
  width: 400,
  height: 300
};
var publisher = OT.initPublisher('publisherContainerElementId', publisherOptions);
session.publish(publisher)

De même, lorsque vous vous abonnez à un flux, vous pouvez spécifier l'élément DOM cible (ou son ID). Vous pouvez également spécifier la largeur et la hauteur initiales de l'abonné :

var options = {width: 400, height: 300, insertMode: 'append'}
var subscriber = session.subscribe(stream, 'containerElementId', options);

Vous pouvez également spécifier la largeur et la hauteur initiales en pourcentage de la taille de l'élément DOM parent :

var publisherOptions = {
  insertMode: 'append',
  width: '100%',
  height: '100%'
};
var publisher = OT.initPublisher(publisherContainerElement, publisherOptions);
session.publish(publisher);

Si vous ne spécifiez pas d'ID d'élément de remplacement (ou si vous lui attribuez la valeur null), l'application ajoute un nouvel élément DOM au corps du code HTML. La largeur par défaut est de 264 pixels et la hauteur par défaut est de 198 pixels.

Si vous souhaitez appliquer plusieurs règles CSS, appliquez-les à l'élément DOM parent (conteneur) :

Pour appliquer une taille différente à une vidéo sur un appareil mobile, utilisez les requêtes média CSS :

Si vous souhaitez redimensionner dynamiquement la vidéo, définissez le paramètre insertMode à 'append' et définir le height et width à '100%'.

Voir la section suivante pour plus d'informations sur le redimensionnement ou le repositionnement d'une vidéo d'éditeur ou d'abonné.