diff --git a/src/js/big-play-button.js b/src/js/big-play-button.js index c35b50a6ca..8e5ba9dafc 100644 --- a/src/js/big-play-button.js +++ b/src/js/big-play-button.js @@ -5,6 +5,10 @@ import Button from './button.js'; import Component from './component.js'; import {isPromise, silencePromise} from './utils/promise'; +/** + * @typedef {import('../event-target').Event} Event + */ + /** * The initial play button that shows before the video has played. The hiding of the * `BigPlayButton` get done via CSS and `Player` states. @@ -34,7 +38,7 @@ class BigPlayButton extends Button { * This gets called when a `BigPlayButton` "clicked". See {@link ClickableComponent} * for more detailed information on what a click can be. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown`, `tap`, or `click` event that caused this function to be * called. * diff --git a/src/js/button.js b/src/js/button.js index b5e5f5dc1f..e2175733d8 100644 --- a/src/js/button.js +++ b/src/js/button.js @@ -104,7 +104,7 @@ class Button extends ClickableComponent { * This gets called when a `Button` has focus and `keydown` is triggered via a key * press. * - * @param {EventTarget~Event} event + * @param {Event} event * The event that caused this function to get called. * * @listens keydown diff --git a/src/js/clickable-component.js b/src/js/clickable-component.js index da6229c3a2..031fb89c1a 100644 --- a/src/js/clickable-component.js +++ b/src/js/clickable-component.js @@ -6,6 +6,10 @@ import * as Dom from './utils/dom.js'; import log from './utils/log.js'; import keycode from 'keycode'; +/** + * @typedef { import('./player').default } Player + */ + /** * Component which is clickable or keyboard actionable, but is not a * native HTML button. @@ -212,7 +216,7 @@ class ClickableComponent extends Component { * Event handler that is called when a `ClickableComponent` receives a * `click` or `tap` event. * - * @param {EventTarget~Event} event + * @param {Event} event * The `tap` or `click` event that caused this function to be called. * * @listens tap @@ -231,7 +235,7 @@ class ClickableComponent extends Component { * * By default, if the key is Space or Enter, it will trigger a `click` event. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown` event that caused this function to be called. * * @listens keydown diff --git a/src/js/close-button.js b/src/js/close-button.js index 89af076f9e..22179dc66e 100644 --- a/src/js/close-button.js +++ b/src/js/close-button.js @@ -5,6 +5,10 @@ import Button from './button'; import Component from './component'; import keycode from 'keycode'; +/** + * @typedef { import('./player').default } Player + */ + /** * The `CloseButton` is a `{@link Button}` that fires a `close` event when * it gets clicked. @@ -42,7 +46,7 @@ class CloseButton extends Button { * {@link ClickableComponent#handleClick} for more information on when * this will be triggered * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -56,7 +60,7 @@ class CloseButton extends Button { * Triggered when the a `CloseButton` is clicked. * * @event CloseButton#close - * @type {EventTarget~Event} + * @type {Event} * * @property {boolean} [bubbles=false] * set to false so that the close event does not @@ -70,7 +74,7 @@ class CloseButton extends Button { * * By default, if the key is Esc, it will trigger a `click` event. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown` event that caused this function to be called. * * @listens keydown diff --git a/src/js/component.js b/src/js/component.js index 10bc7cc3be..48a67d06bd 100644 --- a/src/js/component.js +++ b/src/js/component.js @@ -13,6 +13,11 @@ import {toTitleCase, toLowerCase} from './utils/str.js'; import {merge} from './utils/obj.js'; import keycode from 'keycode'; +/** + * @typedef { import('./player').default } Player + * @typedef { import('./event-target').Event} Event +*/ + /** * Base class for all UI Components. * Components are UI objects which represent both a javascript object and an element @@ -27,7 +32,7 @@ class Component { * A callback that is called when a component is ready. Does not have any * parameters and any callback value will be ignored. * - * @callback Component~ReadyCallback + * @callback ReadyCallback * @this Component */ @@ -48,7 +53,7 @@ class Component { * @param {string} [options.className] * A class or space separated list of classes to add the component * - * @param {Component~ReadyCallback} [ready] + * @param {ReadyCallback} [ready] * Function that gets called when the `Component` is ready. */ constructor(player, options, ready) { @@ -95,6 +100,12 @@ class Component { options.className.split(' ').forEach(c => this.addClass(c)); } + // Remove the placeholder event methods. If the component is evented, the + // real methods are added next + ['on', 'off', 'one', 'any', 'trigger'].forEach(fn => { + this[fn] = undefined; + }); + // if evented is anything except false, we want to mixin in evented if (options.evented !== false) { // Make this an evented object and use `el_`, if available, as its event bus @@ -130,6 +141,79 @@ class Component { } + // `on`, `off`, `one`, `any` and `trigger` are here so tsc includes them in definitions. + // They are replaced or removed in the constructor + + /** + * Adds an `event listener` to an instance of an `EventTarget`. An `event listener` is a + * function that will get called when an event with a certain name gets triggered. + * + * @param {string|string[]} type + * An event name or an array of event names. + * + * @param {Function} fn + * The function to call with `EventTarget`s + */ + on(type, fn) {} + + /** + * Removes an `event listener` for a specific event from an instance of `EventTarget`. + * This makes it so that the `event listener` will no longer get called when the + * named event happens. + * + * @param {string|string[]} type + * An event name or an array of event names. + * + * @param {Function} fn + * The function to remove. + */ + off(type, fn) {} + + /** + * This function will add an `event listener` that gets triggered only once. After the + * first trigger it will get removed. This is like adding an `event listener` + * with {@link EventTarget#on} that calls {@link EventTarget#off} on itself. + * + * @param {string|string[]} type + * An event name or an array of event names. + * + * @param {Function} fn + * The function to be called once for each event name. + */ + one(type, fn) {} + + /** + * This function will add an `event listener` that gets triggered only once and is + * removed from all events. This is like adding an array of `event listener`s + * with {@link EventTarget#on} that calls {@link EventTarget#off} on all events the + * first time it is triggered. + * + * @param {string|string[]} type + * An event name or an array of event names. + * + * @param {Function} fn + * The function to be called once for each event name. + */ + any(type, fn) {} + + /** + * This function causes an event to happen. This will then cause any `event listeners` + * that are waiting for that event, to get called. If there are no `event listeners` + * for an event then nothing will happen. + * + * If the name of the `Event` that is being triggered is in `EventTarget.allowedEvents_`. + * Trigger will also call the `on` + `uppercaseEventName` function. + * + * Example: + * 'click' is in `EventTarget.allowedEvents_`, so, trigger will attempt to call + * `onClick` if it exists. + * + * @param {string|Event|Object} event + * The name of the event, an `Event`, or an object with a key of type set to + * an event name. + */ + trigger(event) {} + /** * Dispose of the `Component` and all child components. * @@ -153,7 +237,7 @@ class Component { * Triggered when a `Component` is disposed. * * @event Component#dispose - * @type {EventTarget~Event} + * @type {Event} * * @property {boolean} [bubbles=false] * set to false so that the dispose event does not @@ -700,7 +784,7 @@ class Component { * Different from event listeners in that if the ready event has already happened * it will trigger the function immediately. * - * @param {Component~ReadyCallback} fn + * @param {ReadyCallback} fn * Function that gets called when the `Component` is ready. * * @return {Component} @@ -751,7 +835,7 @@ class Component { * Triggered when a `Component` is ready. * * @event Component#ready - * @type {EventTarget~Event} + * @type {Event} */ this.trigger('ready'); }, 1); @@ -1033,7 +1117,7 @@ class Component { * Triggered when a component is resized. * * @event Component#componentresize - * @type {EventTarget~Event} + * @type {Event} */ this.trigger('componentresize'); } @@ -1169,7 +1253,7 @@ class Component { * When this Component receives a `keydown` event which it does not process, * it passes the event to the Player for handling. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown` event that caused this function to be called. */ handleKeyDown(event) { @@ -1190,7 +1274,7 @@ class Component { * delegates to `handleKeyDown`. This means anyone calling `handleKeyPress` * will not see their method calls stop working. * - * @param {EventTarget~Event} event + * @param {Event} event * The event that caused this function to be called. */ handleKeyPress(event) { @@ -1283,7 +1367,7 @@ class Component { * Triggered when a `Component` is tapped. * * @event Component#tap - * @type {EventTarget~Event} + * @type {Event} */ this.trigger('tap'); // It may be good to copy the touchend event object and change the diff --git a/src/js/control-bar/audio-track-controls/audio-track-menu-item.js b/src/js/control-bar/audio-track-controls/audio-track-menu-item.js index c8dc28aa4b..4180435e62 100644 --- a/src/js/control-bar/audio-track-controls/audio-track-menu-item.js +++ b/src/js/control-bar/audio-track-controls/audio-track-menu-item.js @@ -5,6 +5,10 @@ import MenuItem from '../../menu/menu-item.js'; import Component from '../../component.js'; import * as Dom from '../../utils/dom.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * An {@link AudioTrack} {@link MenuItem} * @@ -68,7 +72,7 @@ class AudioTrackMenuItem extends MenuItem { * This gets called when an `AudioTrackMenuItem is "clicked". See {@link ClickableComponent} * for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -102,7 +106,7 @@ class AudioTrackMenuItem extends MenuItem { /** * Handle any {@link AudioTrack} change. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The {@link AudioTrackList#change} event that caused this to run. * * @listens AudioTrackList#change diff --git a/src/js/control-bar/fullscreen-toggle.js b/src/js/control-bar/fullscreen-toggle.js index 2a060a9ee2..ff4808af75 100644 --- a/src/js/control-bar/fullscreen-toggle.js +++ b/src/js/control-bar/fullscreen-toggle.js @@ -5,6 +5,10 @@ import Button from '../button.js'; import Component from '../component.js'; import document from 'global/document'; +/** + * @typedef { import('./player').default } Player + */ + /** * Toggle fullscreen video * @@ -43,7 +47,7 @@ class FullscreenToggle extends Button { /** * Handles fullscreenchange on the player and change control text accordingly. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The {@link Player#fullscreenchange} event that caused this function to be * called. * @@ -61,7 +65,7 @@ class FullscreenToggle extends Button { * This gets called when an `FullscreenToggle` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * diff --git a/src/js/control-bar/live-display.js b/src/js/control-bar/live-display.js index bf0a9c9408..34d377326b 100644 --- a/src/js/control-bar/live-display.js +++ b/src/js/control-bar/live-display.js @@ -5,6 +5,10 @@ import Component from '../component'; import * as Dom from '../utils/dom.js'; import document from 'global/document'; +/** + * @typedef { import('./player').default } Player + */ + // TODO - Future make it click to snap to live /** @@ -67,7 +71,7 @@ class LiveDisplay extends Component { * Check the duration to see if the LiveDisplay should be showing or not. Then show/hide * it accordingly * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The {@link Player#durationchange} event that caused this function to run. * * @listens Player#durationchange diff --git a/src/js/control-bar/mute-toggle.js b/src/js/control-bar/mute-toggle.js index 8e06e2c12f..562351ea23 100644 --- a/src/js/control-bar/mute-toggle.js +++ b/src/js/control-bar/mute-toggle.js @@ -7,6 +7,10 @@ import * as Dom from '../utils/dom.js'; import checkMuteSupport from './volume-control/check-mute-support'; import * as browser from '../utils/browser.js'; +/** + * @typedef { import('./player').default } Player + */ + /** * A button component for muting the audio. * @@ -46,7 +50,7 @@ class MuteToggle extends Button { * This gets called when an `MuteToggle` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -71,7 +75,7 @@ class MuteToggle extends Button { * Update the `MuteToggle` button based on the state of `volume` and `muted` * on the player. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The {@link Player#loadstart} event if this function was called * through an event. * diff --git a/src/js/control-bar/picture-in-picture-toggle.js b/src/js/control-bar/picture-in-picture-toggle.js index cadafbe041..7fb9745b3d 100644 --- a/src/js/control-bar/picture-in-picture-toggle.js +++ b/src/js/control-bar/picture-in-picture-toggle.js @@ -5,6 +5,10 @@ import Button from '../button.js'; import Component from '../component.js'; import document from 'global/document'; +/** + * @typedef { import('./player').default } Player + */ + /** * Toggle Picture-in-Picture mode * @@ -73,7 +77,7 @@ class PictureInPictureToggle extends Button { /** * Handles enterpictureinpicture and leavepictureinpicture on the player and change control text accordingly. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The {@link Player#enterpictureinpicture} or {@link Player#leavepictureinpicture} event that caused this function to be * called. * @@ -93,7 +97,7 @@ class PictureInPictureToggle extends Button { * This gets called when an `PictureInPictureToggle` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * diff --git a/src/js/control-bar/play-toggle.js b/src/js/control-bar/play-toggle.js index 8c79393068..d60a15d2c4 100644 --- a/src/js/control-bar/play-toggle.js +++ b/src/js/control-bar/play-toggle.js @@ -5,6 +5,10 @@ import Button from '../button.js'; import Component from '../component.js'; import {silencePromise} from '../utils/promise'; +/** + * @typedef { import('./player').default } Player + */ + /** * Button to toggle between play and pause. * @@ -49,7 +53,7 @@ class PlayToggle extends Button { * This gets called when an `PlayToggle` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -68,7 +72,7 @@ class PlayToggle extends Button { * This gets called once after the video has ended and the user seeks so that * we can change the replay button back to a play button. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The event that caused this function to run. * * @listens Player#seeked @@ -86,7 +90,7 @@ class PlayToggle extends Button { /** * Add the vjs-playing class to the element so it can change appearance. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The event that caused this function to run. * * @listens Player#play @@ -101,7 +105,7 @@ class PlayToggle extends Button { /** * Add the vjs-paused class to the element so it can change appearance. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The event that caused this function to run. * * @listens Player#pause @@ -116,7 +120,7 @@ class PlayToggle extends Button { /** * Add the vjs-ended class to the element so it can change appearance * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The event that caused this function to run. * * @listens Player#ended diff --git a/src/js/control-bar/playback-rate-menu/playback-rate-menu-button.js b/src/js/control-bar/playback-rate-menu/playback-rate-menu-button.js index 8a4c4a3d65..5c7a4fe0d9 100644 --- a/src/js/control-bar/playback-rate-menu/playback-rate-menu-button.js +++ b/src/js/control-bar/playback-rate-menu/playback-rate-menu-button.js @@ -6,6 +6,10 @@ import PlaybackRateMenuItem from './playback-rate-menu-item.js'; import Component from '../../component.js'; import * as Dom from '../../utils/dom.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The component for controlling the playback rate. * @@ -131,7 +135,7 @@ class PlaybackRateMenuButton extends MenuButton { /** * Hide playback rate controls when they're no playback rate options to select * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The event that caused this function to run. * * @listens Player#loadstart @@ -147,7 +151,7 @@ class PlaybackRateMenuButton extends MenuButton { /** * Update button label when rate changed * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The event that caused this function to run. * * @listens Player#ratechange diff --git a/src/js/control-bar/playback-rate-menu/playback-rate-menu-item.js b/src/js/control-bar/playback-rate-menu/playback-rate-menu-item.js index 2fb31a9cf4..4fee03a00f 100644 --- a/src/js/control-bar/playback-rate-menu/playback-rate-menu-item.js +++ b/src/js/control-bar/playback-rate-menu/playback-rate-menu-item.js @@ -4,6 +4,10 @@ import MenuItem from '../../menu/menu-item.js'; import Component from '../../component.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The specific menu item type for selecting a playback rate. * @@ -42,7 +46,7 @@ class PlaybackRateMenuItem extends MenuItem { * This gets called when an `PlaybackRateMenuItem` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -57,7 +61,7 @@ class PlaybackRateMenuItem extends MenuItem { /** * Update the PlaybackRateMenuItem when the playbackrate changes. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `ratechange` event that caused this function to run. * * @listens Player#ratechange diff --git a/src/js/control-bar/progress-control/load-progress-bar.js b/src/js/control-bar/progress-control/load-progress-bar.js index 31d108eb30..50ae1fdfdd 100644 --- a/src/js/control-bar/progress-control/load-progress-bar.js +++ b/src/js/control-bar/progress-control/load-progress-bar.js @@ -6,6 +6,10 @@ import * as Dom from '../../utils/dom.js'; import {clamp} from '../../utils/num'; import document from 'global/document'; +/** + * @typedef { import('../../player').default } Player + */ + // get the percent width of a time compared to the total end const percentify = (time, end) => clamp((time / end) * 100, 0, 100).toFixed(2) + '%'; @@ -66,7 +70,7 @@ class LoadProgressBar extends Component { /** * Update progress bar * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `progress` event that caused this function to run. * * @listens Player#progress diff --git a/src/js/control-bar/progress-control/mouse-time-display.js b/src/js/control-bar/progress-control/mouse-time-display.js index 2b9140dc67..93a3526522 100644 --- a/src/js/control-bar/progress-control/mouse-time-display.js +++ b/src/js/control-bar/progress-control/mouse-time-display.js @@ -6,6 +6,10 @@ import * as Fn from '../../utils/fn.js'; import './time-tooltip'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The {@link MouseTimeDisplay} component tracks mouse movement over the * {@link ProgressControl}. It displays an indicator and a {@link TimeTooltip} diff --git a/src/js/control-bar/progress-control/play-progress-bar.js b/src/js/control-bar/progress-control/play-progress-bar.js index 08adb584de..ffa602309c 100644 --- a/src/js/control-bar/progress-control/play-progress-bar.js +++ b/src/js/control-bar/progress-control/play-progress-bar.js @@ -7,6 +7,10 @@ import * as Fn from '../../utils/fn.js'; import './time-tooltip'; +/** + * @typedef { import('../../player').default } Player + */ + /** * Used by {@link SeekBar} to display media playback progress as part of the * {@link ProgressControl}. diff --git a/src/js/control-bar/progress-control/progress-control.js b/src/js/control-bar/progress-control/progress-control.js index 013ef5a0a3..75037af9c7 100644 --- a/src/js/control-bar/progress-control/progress-control.js +++ b/src/js/control-bar/progress-control/progress-control.js @@ -9,6 +9,10 @@ import {silencePromise} from '../../utils/promise'; import './seek-bar.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The Progress Control component contains the seek bar, load progress, * and play progress. @@ -52,7 +56,7 @@ class ProgressControl extends Component { * When the mouse moves over the `ProgressControl`, the pointer position * gets passed down to the `MouseTimeDisplay` component. * - * @param {EventTarget~Event} event + * @param {Event} event * The `mousemove` event that caused this function to run. * * @listen mousemove @@ -94,7 +98,7 @@ class ProgressControl extends Component { * A throttled version of the {@link ProgressControl#handleMouseSeek} listener. * * @method ProgressControl#throttledHandleMouseSeek - * @param {EventTarget~Event} event + * @param {Event} event * The `mousemove` event that caused this function to run. * * @listen mousemove @@ -104,7 +108,7 @@ class ProgressControl extends Component { /** * Handle `mousemove` or `touchmove` events on the `ProgressControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * `mousedown` or `touchstart` event that triggered this function * * @listens mousemove @@ -191,7 +195,7 @@ class ProgressControl extends Component { /** * Handle `mousedown` or `touchstart` events on the `ProgressControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * `mousedown` or `touchstart` event that triggered this function * * @listens mousedown @@ -214,7 +218,7 @@ class ProgressControl extends Component { /** * Handle `mouseup` or `touchend` events on the `ProgressControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * `mouseup` or `touchend` event that triggered this function. * * @listens touchend diff --git a/src/js/control-bar/progress-control/seek-bar.js b/src/js/control-bar/progress-control/seek-bar.js index 7c5e1fbc5f..b38f81fd50 100644 --- a/src/js/control-bar/progress-control/seek-bar.js +++ b/src/js/control-bar/progress-control/seek-bar.js @@ -15,6 +15,11 @@ import './load-progress-bar.js'; import './play-progress-bar.js'; import './mouse-time-display.js'; +/** + * @typedef { import('../../player').default } Player + * @typedef {import('../event-target').Event} Event + */ + // The number of seconds the `step*` functions move the timeline. const STEP_SECONDS = 5; @@ -129,7 +134,7 @@ class SeekBar extends Slider { * This function updates the play progress bar and accessibility * attributes to whatever is passed in. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `timeupdate` or `ended` event that caused this to run. * * @listens Player#timeupdate @@ -244,7 +249,7 @@ class SeekBar extends Slider { /** * Handle mouse down on seek bar * - * @param {EventTarget~Event} event + * @param {Event} event * The `mousedown` event that caused this to run. * * @listens mousedown @@ -266,7 +271,7 @@ class SeekBar extends Slider { /** * Handle mouse move on seek bar * - * @param {EventTarget~Event} event + * @param {Event} event * The `mousemove` event that caused this to run. * @param {boolean} mouseDown this is a flag that should be set to true if `handleMouseMove` is called directly. It allows us to skip things that should not happen if coming from mouse down but should happen on regular mouse move handler. Defaults to false * @@ -351,7 +356,7 @@ class SeekBar extends Slider { /** * Handle mouse up on seek bar * - * @param {EventTarget~Event} event + * @param {Event} event * The `mouseup` event that caused this to run. * * @listens mouseup @@ -370,7 +375,7 @@ class SeekBar extends Slider { * This is particularly useful for if the player is paused to time the time displays. * * @event Tech#timeupdate - * @type {EventTarget~Event} + * @type {Event} */ this.player_.trigger({ type: 'timeupdate', target: this, manuallyTriggered: true }); if (this.videoWasPlaying) { @@ -400,7 +405,7 @@ class SeekBar extends Slider { * Toggles the playback state of the player * This gets called when enter or space is used on the seekbar * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown` event that caused this function to be called * */ @@ -423,7 +428,7 @@ class SeekBar extends Slider { * PageDown key moves back a larger step than ArrowDown * PageUp key moves forward a large step * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown` event that caused this function to be called. * * @listens keydown diff --git a/src/js/control-bar/progress-control/time-tooltip.js b/src/js/control-bar/progress-control/time-tooltip.js index c1cc863403..07bee63e61 100644 --- a/src/js/control-bar/progress-control/time-tooltip.js +++ b/src/js/control-bar/progress-control/time-tooltip.js @@ -6,6 +6,10 @@ import * as Dom from '../../utils/dom.js'; import {formatTime} from '../../utils/time.js'; import * as Fn from '../../utils/fn.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * Time tooltips display a time above the progress bar. * diff --git a/src/js/control-bar/seek-to-live.js b/src/js/control-bar/seek-to-live.js index c6769fdec3..8ff5a4e7b1 100644 --- a/src/js/control-bar/seek-to-live.js +++ b/src/js/control-bar/seek-to-live.js @@ -5,6 +5,10 @@ import Button from '../button'; import Component from '../component'; import * as Dom from '../utils/dom.js'; +/** + * @typedef { import('./player').default } Player + */ + /** * Displays the live indicator when duration is Infinity. * diff --git a/src/js/control-bar/text-track-controls/caption-settings-menu-item.js b/src/js/control-bar/text-track-controls/caption-settings-menu-item.js index 095d8895a7..a41494f6f4 100644 --- a/src/js/control-bar/text-track-controls/caption-settings-menu-item.js +++ b/src/js/control-bar/text-track-controls/caption-settings-menu-item.js @@ -4,6 +4,10 @@ import TextTrackMenuItem from './text-track-menu-item.js'; import Component from '../../component.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The menu item for caption track settings menu * @@ -44,7 +48,7 @@ class CaptionSettingsMenuItem extends TextTrackMenuItem { * This gets called when an `CaptionSettingsMenuItem` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * diff --git a/src/js/control-bar/text-track-controls/captions-button.js b/src/js/control-bar/text-track-controls/captions-button.js index c03f1c8e04..11c2e90e71 100644 --- a/src/js/control-bar/text-track-controls/captions-button.js +++ b/src/js/control-bar/text-track-controls/captions-button.js @@ -5,6 +5,10 @@ import TextTrackButton from './text-track-button.js'; import Component from '../../component.js'; import CaptionSettingsMenuItem from './caption-settings-menu-item.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The button component for toggling and selecting captions * @@ -21,7 +25,7 @@ class CaptionsButton extends TextTrackButton { * @param {Object} [options] * The key/value store of player options. * - * @param {Component~ReadyCallback} [ready] + * @param {Function} [ready] * The function to call when this component is ready. */ constructor(player, options, ready) { diff --git a/src/js/control-bar/text-track-controls/chapters-button.js b/src/js/control-bar/text-track-controls/chapters-button.js index be047c774c..a002d25bda 100644 --- a/src/js/control-bar/text-track-controls/chapters-button.js +++ b/src/js/control-bar/text-track-controls/chapters-button.js @@ -6,6 +6,12 @@ import Component from '../../component.js'; import ChaptersTrackMenuItem from './chapters-track-menu-item.js'; import {toTitleCase} from '../../utils/str.js'; +/** + * @typedef { import('../../player').default } Player + * @typedef { import('../../menu/menu').default } Menu + * @typedef { import('../text-track-menu-item/menu/').default } TextTrackMenuItem + */ + /** * The button component for toggling and selecting chapters * Chapters act much differently than other text tracks @@ -24,7 +30,7 @@ class ChaptersButton extends TextTrackButton { * @param {Object} [options] * The key/value store of player options. * - * @param {Component~ReadyCallback} [ready] + * @param {Function} [ready] * The function to call when this function is ready. */ constructor(player, options, ready) { @@ -54,7 +60,7 @@ class ChaptersButton extends TextTrackButton { /** * Update the menu based on the current state of its items. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * An event that triggered this function to run. * * @listens TextTrackList#addtrack diff --git a/src/js/control-bar/text-track-controls/chapters-track-menu-item.js b/src/js/control-bar/text-track-controls/chapters-track-menu-item.js index 69ecb5ea93..da5a83f77f 100644 --- a/src/js/control-bar/text-track-controls/chapters-track-menu-item.js +++ b/src/js/control-bar/text-track-controls/chapters-track-menu-item.js @@ -4,6 +4,10 @@ import MenuItem from '../../menu/menu-item.js'; import Component from '../../component.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The chapter track menu item * @@ -40,7 +44,7 @@ class ChaptersTrackMenuItem extends MenuItem { * This gets called when an `ChaptersTrackMenuItem` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `keydown`, `tap`, or `click` event that caused this function to be * called. * diff --git a/src/js/control-bar/text-track-controls/descriptions-button.js b/src/js/control-bar/text-track-controls/descriptions-button.js index 6f67a70912..c2f8744033 100644 --- a/src/js/control-bar/text-track-controls/descriptions-button.js +++ b/src/js/control-bar/text-track-controls/descriptions-button.js @@ -5,6 +5,10 @@ import TextTrackButton from './text-track-button.js'; import Component from '../../component.js'; import * as Fn from '../../utils/fn.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The button component for toggling and selecting descriptions * @@ -21,7 +25,7 @@ class DescriptionsButton extends TextTrackButton { * @param {Object} [options] * The key/value store of player options. * - * @param {Component~ReadyCallback} [ready] + * @param {Function} [ready] * The function to call when this component is ready. */ constructor(player, options, ready) { @@ -39,7 +43,7 @@ class DescriptionsButton extends TextTrackButton { /** * Handle text track change * - * @param {EventTarget~Event} event + * @param {Event} event * The event that caused this function to run * * @listens TextTrackList#change diff --git a/src/js/control-bar/text-track-controls/off-text-track-menu-item.js b/src/js/control-bar/text-track-controls/off-text-track-menu-item.js index ee0c6e6ed4..e862b8ff7b 100644 --- a/src/js/control-bar/text-track-controls/off-text-track-menu-item.js +++ b/src/js/control-bar/text-track-controls/off-text-track-menu-item.js @@ -4,6 +4,10 @@ import TextTrackMenuItem from './text-track-menu-item.js'; import Component from '../../component.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * A special menu item for turning of a specific type of text track * @@ -55,7 +59,7 @@ class OffTextTrackMenuItem extends TextTrackMenuItem { /** * Handle text track change * - * @param {EventTarget~Event} event + * @param {Event} event * The event that caused this function to run */ handleTracksChange(event) { diff --git a/src/js/control-bar/text-track-controls/subs-caps-button.js b/src/js/control-bar/text-track-controls/subs-caps-button.js index 146f35a326..48ad1ac22f 100644 --- a/src/js/control-bar/text-track-controls/subs-caps-button.js +++ b/src/js/control-bar/text-track-controls/subs-caps-button.js @@ -6,6 +6,11 @@ import Component from '../../component.js'; import CaptionSettingsMenuItem from './caption-settings-menu-item.js'; import SubsCapsMenuItem from './subs-caps-menu-item.js'; import {toTitleCase} from '../../utils/str.js'; + +/** + * @typedef { import('../../player').default } Player + */ + /** * The button component for toggling and selecting captions and/or subtitles * @@ -13,6 +18,18 @@ import {toTitleCase} from '../../utils/str.js'; */ class SubsCapsButton extends TextTrackButton { + /** + * Creates an instance of this class. + * + * @param {Player} player + * The `Player` that this class should be attached to. + * + * @param {Object} [options] + * The key/value store of player options. + * + * @param {Function} [ready] + * The function to call when this component is ready. + */ constructor(player, options = {}) { super(player, options); diff --git a/src/js/control-bar/text-track-controls/subtitles-button.js b/src/js/control-bar/text-track-controls/subtitles-button.js index 4b6abdfb67..fe2666a43c 100644 --- a/src/js/control-bar/text-track-controls/subtitles-button.js +++ b/src/js/control-bar/text-track-controls/subtitles-button.js @@ -4,6 +4,10 @@ import TextTrackButton from './text-track-button.js'; import Component from '../../component.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The button component for toggling and selecting subtitles * @@ -20,7 +24,7 @@ class SubtitlesButton extends TextTrackButton { * @param {Object} [options] * The key/value store of player options. * - * @param {Component~ReadyCallback} [ready] + * @param {Function} [ready] * The function to call when this component is ready. */ constructor(player, options, ready) { diff --git a/src/js/control-bar/text-track-controls/text-track-button.js b/src/js/control-bar/text-track-controls/text-track-button.js index 181be2b8f9..2ab9d51747 100644 --- a/src/js/control-bar/text-track-controls/text-track-button.js +++ b/src/js/control-bar/text-track-controls/text-track-button.js @@ -6,6 +6,10 @@ import Component from '../../component.js'; import TextTrackMenuItem from './text-track-menu-item.js'; import OffTextTrackMenuItem from './off-text-track-menu-item.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The base class for buttons that toggle specific text track types (e.g. subtitles) * diff --git a/src/js/control-bar/text-track-controls/text-track-menu-item.js b/src/js/control-bar/text-track-controls/text-track-menu-item.js index 781d22a2e4..ef8a4120d2 100644 --- a/src/js/control-bar/text-track-controls/text-track-menu-item.js +++ b/src/js/control-bar/text-track-controls/text-track-menu-item.js @@ -6,6 +6,10 @@ import Component from '../../component.js'; import window from 'global/window'; import document from 'global/document'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The specific menu item type for selecting a language within a text track kind * @@ -89,7 +93,7 @@ class TextTrackMenuItem extends MenuItem { * This gets called when an `TextTrackMenuItem` is "clicked". See * {@link ClickableComponent} for more detailed information on what a click can be. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -133,7 +137,7 @@ class TextTrackMenuItem extends MenuItem { /** * Handle text track list change * - * @param {EventTarget~Event} event + * @param {Event} event * The `change` event that caused this function to be called. * * @listens TextTrackList#change diff --git a/src/js/control-bar/time-controls/current-time-display.js b/src/js/control-bar/time-controls/current-time-display.js index 02affe8cd4..34bfa3868b 100644 --- a/src/js/control-bar/time-controls/current-time-display.js +++ b/src/js/control-bar/time-controls/current-time-display.js @@ -24,7 +24,7 @@ class CurrentTimeDisplay extends TimeDisplay { /** * Update current time display * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `timeupdate` event that caused this function to run. * * @listens Player#timeupdate diff --git a/src/js/control-bar/time-controls/duration-display.js b/src/js/control-bar/time-controls/duration-display.js index bb73873b94..9f2f8e3d03 100644 --- a/src/js/control-bar/time-controls/duration-display.js +++ b/src/js/control-bar/time-controls/duration-display.js @@ -4,6 +4,10 @@ import TimeDisplay from './time-display'; import Component from '../../component.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * Displays the duration * @@ -54,7 +58,7 @@ class DurationDisplay extends TimeDisplay { /** * Update duration time display. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `durationchange`, `timeupdate`, or `loadedmetadata` event that caused * this function to be called. * diff --git a/src/js/control-bar/time-controls/remaining-time-display.js b/src/js/control-bar/time-controls/remaining-time-display.js index e7a9d6fb74..5fa8fedaf3 100644 --- a/src/js/control-bar/time-controls/remaining-time-display.js +++ b/src/js/control-bar/time-controls/remaining-time-display.js @@ -5,6 +5,10 @@ import TimeDisplay from './time-display'; import Component from '../../component.js'; import * as Dom from '../../utils/dom.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * Displays the time left in the video * @@ -54,7 +58,7 @@ class RemainingTimeDisplay extends TimeDisplay { /** * Update remaining time display. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `timeupdate` or `durationchange` event that caused this to run. * * @listens Player#timeupdate diff --git a/src/js/control-bar/time-controls/time-display.js b/src/js/control-bar/time-controls/time-display.js index d30284f398..0488150c2e 100644 --- a/src/js/control-bar/time-controls/time-display.js +++ b/src/js/control-bar/time-controls/time-display.js @@ -7,6 +7,10 @@ import * as Dom from '../../utils/dom.js'; import {formatTime} from '../../utils/time.js'; import log from '../../utils/log.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * Displays time information about the video * @@ -120,7 +124,7 @@ class TimeDisplay extends Component { * To be filled out in the child class, should update the displayed time * in accordance with the fact that the current time has changed. * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `timeupdate` event that caused this to run. * * @listens Player#timeupdate diff --git a/src/js/control-bar/track-button.js b/src/js/control-bar/track-button.js index 3452f71ec6..8f74c7b56a 100644 --- a/src/js/control-bar/track-button.js +++ b/src/js/control-bar/track-button.js @@ -5,6 +5,10 @@ import MenuButton from '../menu/menu-button.js'; import Component from '../component.js'; import * as Fn from '../utils/fn.js'; +/** + * @typedef { import('./player').default } Player + */ + /** * The base class for buttons that toggle specific track types (e.g. subtitles). * diff --git a/src/js/control-bar/volume-control/check-mute-support.js b/src/js/control-bar/volume-control/check-mute-support.js index f5a6e1fbcf..7876f91bf2 100644 --- a/src/js/control-bar/volume-control/check-mute-support.js +++ b/src/js/control-bar/volume-control/check-mute-support.js @@ -1,3 +1,8 @@ +/** + * @typedef { import('../../player').default } Player + * @typedef { import('../../component').default } Component + */ + /** * Check if muting volume is supported and if it isn't hide the mute toggle * button. diff --git a/src/js/control-bar/volume-control/check-volume-support.js b/src/js/control-bar/volume-control/check-volume-support.js index df4a3c1e94..5d6cfa28ac 100644 --- a/src/js/control-bar/volume-control/check-volume-support.js +++ b/src/js/control-bar/volume-control/check-volume-support.js @@ -1,3 +1,8 @@ +/** + * @typedef { import('../../player').default } Player + * @typedef { import('../../component').default } Component + */ + /** * Check if volume control is supported and if it isn't hide the * `Component` that was passed using the `vjs-hidden` class. diff --git a/src/js/control-bar/volume-control/mouse-volume-level-display.js b/src/js/control-bar/volume-control/mouse-volume-level-display.js index 617693bd0b..f9b5d50d6e 100644 --- a/src/js/control-bar/volume-control/mouse-volume-level-display.js +++ b/src/js/control-bar/volume-control/mouse-volume-level-display.js @@ -1,3 +1,7 @@ +/** + * @typedef { import('../../player').default } Player + */ + /** * @file mouse-volume-level-display.js */ diff --git a/src/js/control-bar/volume-control/volume-bar.js b/src/js/control-bar/volume-control/volume-bar.js index 9824c1482c..46aac589f1 100644 --- a/src/js/control-bar/volume-control/volume-bar.js +++ b/src/js/control-bar/volume-control/volume-bar.js @@ -11,6 +11,11 @@ import {IS_IOS, IS_ANDROID} from '../../utils/browser.js'; import './volume-level.js'; import './mouse-volume-level-display.js'; +/** + * @typedef { import('../../player').default } Player + * @typedef {import('../../event-target').Event} Event + */ + /** * The bar that contains the volume level and can be clicked on to adjust the level * @@ -52,7 +57,7 @@ class VolumeBar extends Slider { /** * Handle mouse down on volume bar * - * @param {EventTarget~Event} event + * @param {Event} event * The `mousedown` event that caused this to run. * * @listens mousedown @@ -68,7 +73,7 @@ class VolumeBar extends Slider { /** * Handle movement events on the {@link VolumeMenuButton}. * - * @param {EventTarget~Event} event + * @param {Event} event * The event that caused this function to run. * * @listens mousemove @@ -140,7 +145,7 @@ class VolumeBar extends Slider { /** * Update ARIA accessibility attributes * - * @param {EventTarget~Event} [event] + * @param {Event} [event] * The `volumechange` event that caused this function to run. * * @listens Player#volumechange diff --git a/src/js/control-bar/volume-control/volume-control.js b/src/js/control-bar/volume-control/volume-control.js index 61ff1c4b91..889249a404 100644 --- a/src/js/control-bar/volume-control/volume-control.js +++ b/src/js/control-bar/volume-control/volume-control.js @@ -9,6 +9,10 @@ import {throttle, bind_, UPDATE_REFRESH_INTERVAL} from '../../utils/fn.js'; // Required children import './volume-bar.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * The component for controlling the volume level * @@ -83,7 +87,7 @@ class VolumeControl extends Component { /** * Handle `mousedown` or `touchstart` events on the `VolumeControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * `mousedown` or `touchstart` event that triggered this function * * @listens mousedown @@ -101,7 +105,7 @@ class VolumeControl extends Component { /** * Handle `mouseup` or `touchend` events on the `VolumeControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * `mouseup` or `touchend` event that triggered this function. * * @listens touchend @@ -119,7 +123,7 @@ class VolumeControl extends Component { /** * Handle `mousedown` or `touchstart` events on the `VolumeControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * `mousedown` or `touchstart` event that triggered this function * * @listens mousedown diff --git a/src/js/control-bar/volume-control/volume-level-tooltip.js b/src/js/control-bar/volume-control/volume-level-tooltip.js index 3fc35c343e..12310ef673 100644 --- a/src/js/control-bar/volume-control/volume-level-tooltip.js +++ b/src/js/control-bar/volume-control/volume-level-tooltip.js @@ -5,6 +5,10 @@ import Component from '../../component'; import * as Dom from '../../utils/dom.js'; import * as Fn from '../../utils/fn.js'; +/** + * @typedef { import('../../player').default } Player + */ + /** * Volume level tooltips display a volume above or side by side the volume bar. * diff --git a/src/js/control-bar/volume-panel.js b/src/js/control-bar/volume-panel.js index b51a1db62a..e1eb9c84bd 100644 --- a/src/js/control-bar/volume-panel.js +++ b/src/js/control-bar/volume-panel.js @@ -7,6 +7,10 @@ import * as Events from '../utils/events.js'; import keycode from 'keycode'; import document from 'global/document'; +/** + * @typedef { import('./player').default } Player + */ + // Required children import './volume-control/volume-control.js'; import './mute-toggle.js'; @@ -132,7 +136,7 @@ class VolumePanel extends Component { * Handles `keyup` events on the `VolumeControl`, looking for ESC, which closes * the volume panel and sets focus on `MuteToggle`. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keyup` event that caused this function to be called. * * @listens keyup @@ -148,7 +152,7 @@ class VolumePanel extends Component { * Turns on listening for `mouseover` event. When they happen it * calls `this.handleMouseOver`. * - * @param {EventTarget~Event} event + * @param {Event} event * The `mouseover` event that caused this function to be called. * * @listens mouseover @@ -163,7 +167,7 @@ class VolumePanel extends Component { * Turns on listening for `mouseout` event. When they happen it * calls `this.handleMouseOut`. * - * @param {EventTarget~Event} event + * @param {Event} event * The `mouseout` event that caused this function to be called. * * @listens mouseout @@ -177,7 +181,7 @@ class VolumePanel extends Component { * Handles `keyup` event on the document or `keydown` event on the `VolumePanel`, * looking for ESC, which hides the `VolumeControl`. * - * @param {EventTarget~Event} event + * @param {Event} event * The keypress that triggered this event. * * @listens keydown | keyup diff --git a/src/js/error-display.js b/src/js/error-display.js index 69767ecb4e..676bf24454 100644 --- a/src/js/error-display.js +++ b/src/js/error-display.js @@ -4,6 +4,10 @@ import Component from './component'; import ModalDialog from './modal-dialog'; +/** + * @typedef { import('./player').default } Player + */ + /** * A display that indicates an error has occurred. This means that the video * is unplayable. diff --git a/src/js/event-target.js b/src/js/event-target.js index edd5b197bf..c76769c697 100644 --- a/src/js/event-target.js +++ b/src/js/event-target.js @@ -22,7 +22,7 @@ class EventTarget { * @param {string|string[]} type * An event name or an array of event names. * - * @param {EventTarget~EventListener} fn + * @param {Function} fn * The function to call with `EventTarget`s */ on(type, fn) { @@ -42,7 +42,7 @@ class EventTarget { * @param {string|string[]} type * An event name or an array of event names. * - * @param {EventTarget~EventListener} fn + * @param {Function} fn * The function to remove. */ off(type, fn) { @@ -56,7 +56,7 @@ class EventTarget { * @param {string|string[]} type * An event name or an array of event names. * - * @param {EventTarget~EventListener} fn + * @param {Function} fn * The function to be called once for each event name. */ one(type, fn) { @@ -68,6 +68,18 @@ class EventTarget { Events.one(this, type, fn); this.addEventListener = ael; } + /** + * This function will add an `event listener` that gets triggered only once and is + * removed from all events. This is like adding an array of `event listener`s + * with {@link EventTarget#on} that calls {@link EventTarget#off} on all events the + * first time it is triggered. + * + * @param {string|string[]} type + * An event name or an array of event names. + * + * @param {Function} fn + * The function to be called once for each event name. + */ any(type, fn) { // Remove the addEventListener aliasing Events.on // so we don't get into an infinite type loop @@ -149,7 +161,7 @@ class EventTarget { /** * A Custom DOM event. * - * @typedef {EventTarget} Event + * @typedef {CustomEvent} Event * @see [Properties]{@link https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent} */ @@ -159,7 +171,7 @@ class EventTarget { * @callback EventTarget~EventListener * @this {EventTarget} * - * @param {EventTarget~Event} event + * @param {Event} event * the event that triggered this function * * @param {Object} [hash] diff --git a/src/js/live-tracker.js b/src/js/live-tracker.js index 256234bbe3..c90bf8dbfe 100644 --- a/src/js/live-tracker.js +++ b/src/js/live-tracker.js @@ -3,6 +3,10 @@ import {merge} from './utils/obj.js'; import window from 'global/window'; import * as Fn from './utils/fn.js'; +/** + * @typedef { import('./player').default } Player + */ + const defaults = { trackingThreshold: 20, liveTolerance: 15 diff --git a/src/js/menu/menu-button.js b/src/js/menu/menu-button.js index 0a101ee3e1..7b8ad9aa3f 100644 --- a/src/js/menu/menu-button.js +++ b/src/js/menu/menu-button.js @@ -11,6 +11,10 @@ import { IS_IOS } from '../utils/browser.js'; import document from 'global/document'; import keycode from 'keycode'; +/** + * @typedef { import('../player').default } Player + */ + /** * A `MenuButton` class for any popup {@link Menu}. * @@ -231,7 +235,7 @@ class MenuButton extends Component { * Handle a click on a `MenuButton`. * See {@link ClickableComponent#handleClick} for instances where this is called. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown`, `tap`, or `click` event that caused this function to be * called. * @@ -249,7 +253,7 @@ class MenuButton extends Component { /** * Handle `mouseleave` for `MenuButton`. * - * @param {EventTarget~Event} event + * @param {Event} event * The `mouseleave` event that caused this function to be called. * * @listens mouseleave @@ -277,7 +281,7 @@ class MenuButton extends Component { * Handle tab, escape, down arrow, and up arrow keys for `MenuButton`. See * {@link ClickableComponent#handleKeyDown} for instances where this is called. * - * @param {EventTarget~Event} event + * @param {Event} event * The `keydown` event that caused this function to be called. * * @listens keydown @@ -309,7 +313,7 @@ class MenuButton extends Component { * Handle a `keyup` event on a `MenuButton`. The listener for this is added in * the constructor. * - * @param {EventTarget~Event} event + * @param {Event} event * Key press event * * @listens keyup @@ -326,7 +330,7 @@ class MenuButton extends Component { * anyone calling `handleSubmenuKeyPress` will not see their method calls * stop working. * - * @param {EventTarget~Event} event + * @param {Event} event * The event that caused this function to be called. */ handleSubmenuKeyPress(event) { @@ -337,7 +341,7 @@ class MenuButton extends Component { * Handle a `keydown` event on a sub-menu. The listener for this is added in * the constructor. * - * @param {EventTarget~Event} event + * @param {Event} event * Key press event * * @listens keydown diff --git a/src/js/menu/menu-item.js b/src/js/menu/menu-item.js index 7a95e19a52..ce961185a0 100644 --- a/src/js/menu/menu-item.js +++ b/src/js/menu/menu-item.js @@ -7,6 +7,10 @@ import {MenuKeys} from './menu-keys.js'; import keycode from 'keycode'; import {createEl} from '../utils/dom.js'; +/** + * @typedef { import('../player').default } Player + */ + /** * The component for a menu item. `