Nouveau MouseTimeDisplay(lecteur, optionsopter)
Crée une instance de cette classe.
Paramètres :
Prénom | Type | Attributs | 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 leComposant
scontenuEl()
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é. Sithis.contenTel () ne
renvoie rien, il revient audocument
.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 leComposant
scontenuEl()
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é. Sithis.contenTel () ne
renvoie rien, il revient audocument
.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 lecomposant 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, leComposant
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 deWindow.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 deWindow.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ément
DOM 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éez l'élément DOM pour cette classe.
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
.- 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 leComposant
sstyle.largeur
et retombe surwindow.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 composant
sur.hauteur
numéro | chaîne Hauteur pour définir l'
élément du composant
sur.- 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ément
DOM du composantRetours :
É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
etTouchend
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 untoucher 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 Component
s.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 leprénom
.Paramètres :
Prénom Type Description nom
chaîne Nom du
composant enfant
à obtenir.- 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.- Remplace :
-
getDescendant(...names) → {Component|undefined}
-
Renvoie le
composant descendant
suivant lesnoms 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 lesnoms 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 untouche Bas
un événement. Ce nom de méthode est désormais délégué àHandleKeyDown
. Cela signifie que quiconque appelleHandleKeyPress 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 :
-
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 lecomposant
n'a pas la classe`
- Remplace :
- True si le
-
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 Component
s'il est actuellement affiché en y ajoutant le nom de classe « vjs-hidden ».- Remplace :
-
id() → {string}
-
Obtenez ceci
Composant
IdentifiantRetours :
corde -L'identifiant de ce
composant
- Remplace :
-
Enfants en TI()
-
Ajoutez et initialisez des
composants
enfants 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 lachaî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 exigerfr.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
Composant
Le nom de. Le nom est utilisé pour référencer lecomposant
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
etoptions
contiennent des propriétés dont les valeurs sont des objets. Les deux propriétés sont fusionnées à l'aide de Module:MergeOptionsParamètres :
Prénom Type Description obj
Objet Objet qui contient de nouvelles options.
Retours :
Objet -Un nouvel objet de
ce .options_
etobj
a fusionné ensemble.- Remplace :
-
player() → {Player}
-
Renvoie le joueur auquel le
composant
s'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.
- Remplace :
-
RemoveAttribute(attribut)
-
Supprimez un attribut de l'
élément Component
s.Paramètres :
Prénom Type Description attribut
chaîne Nom de l'attribut à supprimer.
- Remplace :
- Voir :
-
RemoveChild(composant)
-
Supprimer un enfant
Composant
de ceciComposant
s liste des enfants. Supprime également l'élément Component
s 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 Component
s.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 deParamè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 deWindow.setInterval
. Il y a cependant quelques raisons d'utiliser celle-ci à la place.- Il est effacé via le composant #clearInterval lorsque le composant #dispose est appelé.
- 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 deWindow.setTimeout
. Il y a cependant quelques raisons d'utiliser celle-ci à la place :- Il est effacé via le composant #clearTimeout lorsque le composant #dispose est appelé.
- 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
Components
s'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.
ClassToToggle
est ajouté lorsque le composant #hasClass renvoie false.ClassToToggle
est supprimé lorsque le composant #hasClass renvoie true.
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 :
-
mise à jour(SeekBarrect, SeekBarPoint)
-
Met en file d'attente les mises à jour de son propre DOM ainsi que le DOM de son TimeTooltip enfant.
Paramètres :
Prénom Type Description Voir Barrect
Objet Les
ClientRect
pour le Barre de recherche élément.Cherchez Barpoint
numéro Un nombre compris entre 0 et 1, représentant un point de référence horizontal depuis le bord gauche de la barre de recherche
-
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 :