Contrôle du volume(lecteur, optionsopter)

Le composant permettant de contrôler le niveau de volume

Nouveau Contrôle du volume(lecteur, optionsopter)

Crée une instance de cette classe.

Paramètres :
Prénom Type Attributs Défaut Description
joueur Joueur

Le joueur auquel cette classe doit être attachée.

options Objet <facultatif>
{}

Le magasin de clé/valeur des options de joueur.

S'étend

Méthodes

$(selector, contextopt) → {Element|null}

Trouvez un seul élément DOM correspondant à un sélecteur. Cela peut être dans le Composants contenuEl() ou un autre contexte personnalisé.

Paramètres :
Prénom Type Attributs Défaut Description
sélecteur chaîne

Un sélecteur CSS valide, qui sera transmis à QuerySelector.

contexte Element | chaîne <facultatif>
Ce .contenTel ()

Un élément DOM dans lequel effectuer une requête. Il peut également s'agir d'une chaîne de sélection, auquel cas le premier élément correspondant sera utilisé comme contexte. S'il manque This.contentel () est utilisé. Si this.contenTel () ne renvoie rien, il revient au document.

Retours :
Element | null -

l'élément dom qui a été trouvé, ou null

Remplace :
Voir :

$$(selector, contextopt) → {NodeList}

Recherche tous les éléments DOM correspondant à un sélecteur. Cela peut être dans le Composants contenuEl() ou un autre contexte personnalisé.

Paramètres :
Prénom Type Attributs Défaut Description
sélecteur chaîne

Un sélecteur CSS valide, qui sera transmis à QuerySelectorAll.

contexte Element | chaîne <facultatif>
Ce .contenTel ()

Un élément DOM dans lequel effectuer une requête. Il peut également s'agir d'une chaîne de sélection, auquel cas le premier élément correspondant sera utilisé comme contexte. S'il manque This.contentel () est utilisé. Si this.contenTel () ne renvoie rien, il revient au document.

Retours :
NodeList -

une liste des éléments Dom qui ont été trouvés

Remplace :
Voir :

addChild(child, optionsopt, indexopt){Component}

Ajoutez un composant enfant dans le composant actuel.

Paramètres :
Prénom Type Attributs Défaut Description
enfant chaîne | Composant

Le nom ou l'instance d'un enfant à ajouter.

options Objet <facultatif>
{}

Le magasin de clé/valeur des options qui seront transmises aux enfants de l'enfant.

index numéro <facultatif>
cette longueur .children_.length

L'index dans laquelle tenter d'ajouter un enfant.

Retours :
Composante-

Composant qui est ajouté en tant qu'enfant. Lors de l'utilisation d'une chaîne, le Composant sera créé par ce processus.

Remplace :

Ajouter une classe(classe à ajouter)

Ajoutez un nom de classe CSS à l' élément Component.

Paramètres :
Prénom Type Description
Classe à ajouter chaîne

Nom de classe CSS à ajouter

Remplace :

flou()

Supprimer le focus de ce composant

Remplace :

abstrait buildCSSClass() → {string}

Construit le nom de classe DOM par défaut. Doive être remplacée par des sous-composants.

Retours :
corde -

Nom de classe DOM de cet objet.

Remplace :

cancelAnimationFrame(id) → {nombre}

Annule un rappel en file d'attente transmis au composant #requestAnimationFrame (RaF).

Si vous placez en file d'attente un rappel RaF via Component #requestAnimationFrame, utilisez cette fonction au lieu de Window.CancelAnimationFrame. Si ce n'est pas le cas, votre écouteur Dispose ne sera pas nettoyé avant le composant #dispose!

Paramètres :
Prénom Type Description
ID numéro

L'ID RaF à effacer. La valeur de retour du composant #requestAnimationFrame.

Retours :
numéro -

Renvoie l'ID RaF qui a été effacé.

Remplace :
Voir :

Cadre d'animation CancelNamedAnimation(nom)

Annule une image d'animation nommée actuelle si elle existe.

Paramètres :
Prénom Type Description
nom chaîne

Nom du RequestAnimationFrame à annuler.

Remplace :

children() → {Array}

Obtenez un tableau de tous les composants enfants

Retours :
Array -

Les enfants

Remplace :

clearInterval(intervalId) → {nombre}

Efface un intervalle créé via Window.setInterval ou Component #setInterval. Si vous définissez un intervalle via Component #setInterval, utilisez cette fonction au lieu de Window.ClearInterval. Si vous ne le faites pas, votre écouteur Disposez ne sera pas nettoyé avant le composant #dispose!

Paramètres :
Prénom Type Description
Intervalides numéro

ID de l'intervalle à effacer. La valeur de retour de Component #setInterval ou Window.setInterval.

Retours :
numéro -

Renvoie l'identifiant d'intervalle qui a été effacé.

Remplace :
Voir :

clearTimeout(timeoutId) → {nombre}

Efface un délai d'attente créé via Window.setTimeout ou Component #setTimeout. Si vous définissez un délai d'attente via le composant #setTimeout, utilisez cette fonction au lieu de Window.ClearIMout. Si vous ne le faites pas, votre écouteur Disposez ne sera pas nettoyé avant le composant #dispose!

Paramètres :
Prénom Type Description
ID de l'heure numéro

L'identifiant du délai d'expiration à effacer. La valeur de retour de Component #setTimeout ou Window.setTimeout.

Retours :
numéro -

Renvoie l'identifiant du délai d'attente effacé.

Remplace :
Voir :

contentEl() → {Element}

Renvoie l' élémentDOM du composant. C'est ici que les enfants sont insérés. Il s'agit généralement de la même chose que l'élément renvoyé dans Component #el.

Retours :
Élément -

L'élément de contenu de ce composant.

Remplace :

createEl() → {Element}

Création de l' élément DOMdu composant

Retours :
Élément -

L'élément qui a été créé.

Remplace :

currentDimension(widthOrHeight) → {number}

Obtenez la largeur calculée ou la hauteur de l'élément du composant.

Utilise Window.GetComputedStyle.

Paramètres :
Prénom Type Description
Largeur et Hauteur chaîne

Une chaîne contenant "width" ou "height". Celui que vous voulez obtenir.

Retours :
numéro -

La dimension demandée ou 0 si rien n'a été défini pour cette dimension.

Remplace :

currentDimensions(){Component~DimensionObject}

Obtenir un objet qui contient des valeurs de largeur et de hauteur calculées de l'élément du composant.

Utilise Window.GetComputedStyle.

Retours :
Component~DimensionObject-

Les dimensions calculées de l'élément du composant.

Remplace :

currentHeight() → {nombre}

Obtenez la hauteur calculée de l'élément du composant.

Utilise Window.GetComputedStyle.

Retours :
numéro -

Hauteur calculée de l'élément du composant.

Remplace :

currentWidth() → {number}

Obtenez la largeur calculée de l'élément du composant.

Utilise Window.GetComputedStyle.

Retours :
numéro -

Largeur calculée de l'élément du composant.

Remplace :

dimension(widthOrHeight, numopt, skipListenersopt) → {number}

Obtenir ou définir la largeur ou la hauteur de l' élément Component. Il s'agit du code partagé pour le composant #width et le composant #height.

Ce qu'il faut savoir :

  • Si la largeur ou la hauteur d'un nombre, cela renvoie le numéro postfixé par « px ».
  • Si la largeur/la hauteur est un pourcentage, cela renvoie le pourcentage postfixé avec « % ».
  • Les éléments masqués ont une largeur de 0 avec Window.GetComputedStyle. Cette fonction prend par défaut le Composants style.largeur et retombe sur window.getComputedStyle. Consultez cette page pour plus d'informations.
  • Si vous souhaitez obtenir le style calculé du composant, utilisez Component #currentWidth et {Component #currentHeight
Paramètres :
Prénom Type Attributs Description
Largeur et Hauteur chaîne

8 "largeur" ou "hauteur

num numéro | chaîne <facultatif>

8 Nouvelle dimension

Pinces à skis booléen <facultatif>

Ignorer le déclencheur d'événement Componentresize

Incendies :
Retours :
numéro -

La dimension lors de l'obtention ou 0 si elle n'est pas définie

Remplace :

dimensions(largeur, hauteur)

Définissez simultanément la largeur et la hauteur de l' élément Component.

Paramètres :
Prénom Type Description
largeur numéro | chaîne

Largeur à laquelle définir l' élément du composantsur.

hauteur numéro | chaîne

Hauteur pour définir l' élément du composantsur.

Remplace :

dispose(options)

Éliminez le composant et tous les composants enfants.

Paramètres :
Prénom Type Description
options Objet
Propriétés
Prénom Type Description
originalEl Element

par lequel remplacer l'élément player

Incendies :
Remplace :

el() → {Element}

Obtenir l' élémentDOM du composant

Retours :
Élément -

L'élément DOM de ce composant.

Remplace :

Activer l'activité tactile()

Cette fonction signale l'activité de l'utilisateur lorsque des événements tactiles se produisent. Cela peut être désactivé par tous les sous-composants qui souhaitent que les événements tactiles agissent autrement.

Signaler l'activité tactile de l'utilisateur lorsque des événements tactiles se produisent. L'activité des utilisateurs permet de déterminer quand les contrôles doivent s'afficher/masquer. C'est simple lorsqu'il s'agit d'événements de souris, car tout événement de souris doit afficher les commandes. Nous capturons donc les événements de souris qui se déplacent vers le joueur et signalons l'activité lorsque cela se produit. Avec les événements tactiles, il n'est pas aussi facile que les commandes Touchstart et Touchend Toggle Player. Les événements tactiles ne peuvent donc pas non plus nous aider au niveau du joueur.

L'activité des utilisateurs est vérifiée de façon asynchrone. Ce qui pourrait arriver, c'est qu'un événement de tapotage sur la vidéo désactive les commandes. Puis le toucher événement bouillonne jusqu'au joueur. Ce qui, s'il signalait une activité utilisateur, réactiverait les contrôles. Nous ne voulons pas non plus empêcher complètement les événements tactiles de bouillonner. De plus un toucher déplacer événement et quoi que ce soit d'autre qu'un tapotement, ne doit pas réactiver les commandes.

Écoute les événements :
  • Composant #événement:Touchstart
  • Composant #événement:Touchmove
  • Composante #événement:Touchend
  • Composant #événement:Touchannuler
Remplace :

focus()

Définissez le focus sur ce composant

Remplace :

getAttribute(attribute) → {string|null}

Obtenez la valeur d'un attribut sur l' élément Components.

Paramètres :
Prénom Type Description
attribut chaîne

Nom de l'attribut à partir de laquelle récupérer la valeur.

Retours :
chaîne | null -
  • La valeur de l'attribut qui a été demandé. - Peut être une chaîne vide sur certains navigateurs si l'attribut n'existe pas ou n'a pas de valeur - La plupart des navigateurs renverront null si l'attribut n'existe pas ou n'a pas de valeur.
Remplace :
Voir :

getChild(name){Component|undefined}

Renvoie le composant enfant portant le prénom.

Paramètres :
Prénom Type Description
nom chaîne

Nom du composant enfant à obtenir.

Retours :
Composant | non défini -

Composant enfant portant le prénom ou non défini.

Remplace :

getChildById(id){Component|undefined}

Renvoie le composant enfant avec l' identifiant donné.

Paramètres :
Prénom Type Description
ID chaîne

ID du composant enfant à obtenir.

Retours :
Composant | non défini -

Composant enfant avec l' identifiant donné ou non défini.

Remplace :

getDescendant(...names){Component|undefined}

Renvoie le composant descendant suivant les noms de descendants donnés. Par exemple, ['foo', 'bar', 'baz'] essaierait d'obtenir 'foo' dans le composant actuel, 'bar' dans le composant 'foo' et 'baz' dans le composant 'bar' et renverrait une valeur indéfinie si l'un de ces éléments n'existait pas.

Paramètres :
Prénom Type Attributs Description
noms ... tableau.<string> | corde <répétable>

Nom du composant enfant à obtenir.

Retours :
Composant | non défini -

Composant descendant suivant les noms de descendants donnés ou non défini.

Remplace :

HandleKeyDown(événement)

Lorsque ce Composant reçoit un touche Bas événement qu'il ne traite pas, il transmet l'événement au lecteur pour traitement.

Paramètres :
Prénom Type Description
événement Cible de l'événement ~ événement

Les touche Bas événement qui a provoqué l'appel de cette fonction.

Remplace :

HandleKeyPress(événement)

De nombreux composants avaient un poignéeKeyPress méthode, mal nommée car elle écoutait un touche Bas un événement. Ce nom de méthode est désormais délégué à HandleKeyDown. Cela signifie que quiconque appelle HandleKeyPress ne verra pas ses appels de méthode cesser de fonctionner.

Paramètres :
Prénom Type Description
événement Cible de l'événement ~ événement

Événement qui a provoqué l'appel de cette fonction.

Remplace :

Manche abstrait LanguageChange()

Gère le changement de langue du lecteur dans les composants. Doive être remplacée par des sous-composants.

Remplace :

HandleMouseDown(événement)

Manipuler souris vers le bas ou démarrage tactile événements sur le Contrôle du volume.

Paramètres :
Prénom Type Description
événement Cible de l'événement ~ événement

souris vers le bas ou démarrage tactile événement qui a déclenché cette fonction

Écoute les événements :
  • événement : mousedown
  • événement : Touch Start

HandleMouseMove(événement)

Manipuler souris vers le bas ou démarrage tactile événements sur le Contrôle du volume.

Paramètres :
Prénom Type Description
événement Cible de l'événement ~ événement

souris vers le bas ou démarrage tactile événement qui a déclenché cette fonction

Écoute les événements :
  • événement : mousedown
  • événement : Touch Start

HandleMouseUp(événement)

Manipuler lever la souris ou toucher événements sur le Contrôle du volume.

Paramètres :
Prénom Type Description
événement Cible de l'événement ~ événement

lever la souris ou toucher événement qui a déclenché cette fonction.

Écoute les événements :
  • événement : Touchend
  • événement : mouseup

hasClass(classToCheck) → {boolean}

Vérifiez si l'élément d'un composant possède un nom de classe CSS.

Paramètres :
Prénom Type Description
Cours à vérifier chaîne

Nom de classe CSS à vérifier.

Retours :
booléen -
  • True si le composant possède la classe. - False si le composant n'a pas la classe`
Remplace :

height(numopt, skipListenersopt) → {nombre|chaîne}

Obtenez ou définissez la hauteur du composant en fonction des styles CSS. Voir Composant #dimension pour plus d'informations.

Paramètres :
Prénom Type Attributs Description
num numéro | chaîne <facultatif>

La hauteur que vous souhaitez définir après avoir fixé '%', 'px' ou rien du tout.

Pinces à skis booléen <facultatif>

Ignorer le déclencheur d'événement Componentresize

Retours :
numéro | chaîne -

La largeur lors de l'obtention, zéro s'il n'y a pas de largeur. Il peut s'agir d'une chaîne de caractères précédée de "%" ou de "px".

Remplace :

cacher()

Masquez l' élément Components'il est actuellement affiché en y ajoutant le nom de classe « vjs-hidden ».

Remplace :

id() → {string}

Obtenez ceci ComposantIdentifiant

Retours :
corde -

L'identifiant de ce composant

Remplace :

Enfants en TI()

Ajoutez et initialisez des composantsenfants par défaut en fonction des options.

Remplace :

isDisposed() → {boolean}

Déterminez si ce composant a été éliminé ou non.

Retours :
booléen -

Si le composant a été éliminé, sera vrai. Sinon, faux.

Remplace :

localize(string, tokensopt, defaultValueopt) → {string}

Localisez une chaîne avec la chaîne en anglais.

Si des jetons sont fournis, il essaiera d'exécuter un simple remplacement de jeton sur la chaîne fournie. Les éléments recherchés ressemblent à {1} , l'index étant indexé à 1 dans le tableau des éléments.

Si une valeur par défaut est fournie, elle utilisera cette valeur au-dessus de la chaîne, si aucune valeur n'est trouvée dans les fichiers linguistiques fournis. Ceci est utile si vous souhaitez avoir une clé descriptive pour le remplacement du jeton mais avoir une chaîne localisée succincte et ne pas exiger fr.json pour être inclus.

Actuellement, il est utilisé pour la synchronisation de la barre de progression.

{
  "Barre de progression : currentTime={1} duration={2}" : "{1} de {2}"
}

Il est ensuite utilisé comme suit :

this.localize('progress bar timing : currentTime={1} duration{2}',
              [this.player_.currentTime(), this.player_.duration()],
              '{1} de {2}') ;

Ce qui produit quelque chose comme : 01:23 de 24 h 56.

Paramètres :
Prénom Type Attributs Description
chaîne chaîne

Chaîne à localiser et clé à rechercher dans les fichiers de langue.

jetons matrice.<corde> <facultatif>

Si l'article actuel a des remplacements de jetons, indiquez les jetons ici.

Valeur par défaut chaîne <facultatif>

La valeur par défaut est chaîne. Il peut s'agir d'une valeur par défaut à utiliser pour le remplacement de jetons si la clé de recherche doit être séparée.

Retours :
corde -

La chaîne localisée ou si aucune localisation n'existe, la chaîne anglaise.

Remplace :

name() → {string}

Obtenir le ComposantLe nom de. Le nom est utilisé pour référencer le composant et est défini lors de l'enregistrement.

Retours :
corde -

Le nom de ce composant.

Remplace :

options(obj) → {Objet}

Fusion approfondie des objets options avec de nouvelles options.

Remarque : Lorsque obj et options contiennent des propriétés dont les valeurs sont des objets. Les deux propriétés sont fusionnées à l'aide de Module:MergeOptions

Paramètres :
Prénom Type Description
obj Objet

Objet qui contient de nouvelles options.

Retours :
Objet -

Un nouvel objet de ce .options_ et obj a fusionné ensemble.

Remplace :

player(){Player}

Renvoie le joueur auquel le composant s'est attaché.

Retours :
Joueur-

Le lecteur auquel ce composant est attaché.

Remplace :

ready(){Component}

Liez un écouteur à l'état prêt du composant. Différent des écouteurs d'événements en ce sens que si l'événement prêt a déjà eu lieu, il déclenchera immédiatement la fonction.

Retours :
Composante-

Renvoie elle-même ; la méthode peut être enchaînée.

Remplace :

RemoveAttribute(attribut)

Supprimez un attribut de l' élément Components.

Paramètres :
Prénom Type Description
attribut chaîne

Nom de l'attribut à supprimer.

Remplace :
Voir :

RemoveChild(composant)

Supprimer un enfant Composant de ceci Composants liste des enfants. Supprime également l' élément Components enfant de cet élément Component.

Paramètres :
Prénom Type Description
composant Composante

Composant enfant à supprimer.

Remplace :

Supprimer la classe(classe à supprimer)

Supprimez un nom de classe CSS de l' élément Components.

Paramètres :
Prénom Type Description
Classe à supprimer chaîne

Nom de classe CSS à supprimer

Remplace :

requestAnimationFrame(fn) → {nombre}

Met en file d'attente un rappel à transmettre à RequestAnimationFrame (RaF), mais avec quelques bonus supplémentaires :

  • Prend en charge les navigateurs qui ne prennent pas en charge RaF en revenant au composant #setTimeout.

  • Le rappel est transformé en composant Component~GenericCallback (c'est-à-dire lié au composant).

  • L'annulation automatique du rappel RaF est gérée si le composant est éliminé avant son appel.

Paramètres :
Prénom Type Description
fn Composant ~ rappel générique

Fonction qui sera liée à ce composant et exécutée juste avant la prochaine peinture du navigateur.

Écoute les événements :
Retours :
numéro -

Renvoie un ID RaF utilisé pour identifier le délai d'expiration. Il peut également être utilisé dans le composant #cancelAnimationFrame pour annuler le rappel de la trame d'animation.

Remplace :
Voir :

RequestNamedAnimation Frame(nom, fn)

Demandez une image d'animation, mais une seule image d'animation nommée sera mise en file d'attente. Un autre ne sera jamais ajouté avant la fin de la précédente.

Paramètres :
Prénom Type Description
nom chaîne

Le nom à donner à cette RequestAnimationFrame

fn Composant ~ rappel générique

Fonction qui sera liée à ce composant et exécutée juste avant la prochaine peinture du navigateur.

Remplace :

SetAttribute(attribut, valeur)

Définir la valeur d'un attribut sur le Composantélément de

Paramètres :
Prénom Type Description
attribut chaîne

Nom de l'attribut à définir.

valeur chaîne

Valeur sur laquelle définir l'attribut.

Remplace :
Voir :

setInterval(fn, intervalle) → {nombre}

Crée une fonction qui est exécutée toutes les x millisecondes. Cette fonction est une enveloppe autour de Window.setInterval. Il y a cependant quelques raisons d'utiliser celle-ci à la place.

  1. Il est effacé via le composant #clearInterval lorsque le composant #dispose est appelé.
  2. La fonction de rappel sera un composant ~GenericCallback
Paramètres :
Prénom Type Description
fn Composant ~ rappel générique

Fonction à exécuter toutes les x secondes.

intervalle numéro

Exécutez la fonction spécifiée toutes les x millisecondes.

Écoute les événements :
Retours :
numéro -

Renvoie un identifiant qui peut être utilisé pour identifier l'intervalle. Il peut également être utilisé dans le composant #clearInterval pour effacer l'intervalle.

Remplace :
Voir :

setTimeout(fn, timeout) → {nombre}

Crée une fonction qui s'exécute après un délai d'expiration de x millisecondes. Cette fonction est une enveloppe autour de Window.setTimeout. Il y a cependant quelques raisons d'utiliser celle-ci à la place :

  1. Il est effacé via le composant #clearTimeout lorsque le composant #dispose est appelé.
  2. La fonction de rappel sera transformée en composant ~GenericCallback

Remarque : Vous ne pouvez pas utiliser Window.CleartimeOut sur l'identifiant renvoyé par cette fonction. Cela fera en sorte que son auditeur de disposition ne soit pas nettoyé ! Veuillez utiliser Composant#clearTimeout ou Composant#disposer au lieu.

Paramètres :
Prénom Type Description
fn Composant ~ rappel générique

Fonction qui sera exécutée après le délai d'expiration.

temps libre numéro

Délai d'expiration en millisecondes avant l'exécution de la fonction spécifiée.

Écoute les événements :
Retours :
numéro -

Renvoie un ID de délai d'attente utilisé pour identifier le délai d'expiration. Il peut également être utilisé dans le composant #clearTimeout pour effacer le délai d'attente défini.

Remplace :
Voir :

spectacle()

Afficher l'élément Componentss'il est caché en supprimant le nom de classe "vjs-hidden".

Remplace :

Basculer la classe(ClasseToToggle, prédicateopt)

Ajoutez ou supprimez un nom de classe CSS de l'élément du composant.

Paramètres :
Prénom Type Attributs Description
Classe à bascule chaîne

La classe à ajouter ou à supprimer en fonction de (@link Component #hasClass}

prédicat booléen | DOM~Predicate <facultatif>

Une fonction DOM~Predicate ou un booléen

Remplace :

Déclencheur prêt()

Déclenchez tous les écouteurs prêts pour ce composant.

Incendies :
Remplace :

width(numopt, skipListenersopt) → {nombre|chaîne}

Obtenez ou définissez la largeur du composant en fonction des styles CSS. Voir Composant #dimension pour plus d'informations.

Paramètres :
Prénom Type Attributs Description
num numéro | chaîne <facultatif>

La largeur que vous souhaitez définir après avoir fixé '%', 'px' ou rien du tout.

Pinces à skis booléen <facultatif>

Ignorer le déclencheur d'événement Componentresize

Retours :
numéro | chaîne -

La largeur lors de l'obtention, zéro s'il n'y a pas de largeur. Il peut s'agir d'une chaîne de caractères précédée de "%" ou de "px".

Remplace :

Evénements

taille du composant

Déclenché lorsqu'un composant est redimensionné.

Type:
Remplace :

disposer

Déclenché lorsqu'un composant est éliminé.

Type:
Propriétés :
Prénom Type Attributs Défaut Description
bulles booléen <facultatif>
faux

défini sur false pour que l'événement Dispose ne s'éclate pas

Remplace :

prêt

Déclenché lorsqu'un composant est prêt.

Type:
Remplace :

robinet

Déclenché lorsqu'un composant est tapé.

Type:
Remplace :