- Version
- 1.0.1
- License
- MIT
- Requires
- object
- DomSmith
- Source
- Chapters.js, line 15
Constructor
new Chapters(player, parent, optionsopt)
Creates a new instance of the Chapters component.
| Name | Type | Attributes | Description | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
player |
Player |
Reference to the VisionPlayer instance. |
|||||||||
parent |
Controller |
Reference to the parent instance. |
|||||||||
options |
Object | optional |
Additional options.
|
Members
private #config :Object
Configuration options for the Chapters component.
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
showInScrubber
|
boolean | optional | true | Shows chapter segments along the scrubber timeline. |
showInTooltip
|
boolean | optional | true | Shows chapter titles within the scrubber tooltip. |
showInController
|
boolean | optional | true | Displays a controller item with chapter title and navigation controls. |
showControllerButtons
|
boolean | optional | true | Shows previous/next chapter buttons in the controller. |
- Type
- Object
- Source
- Chapters.js, line 25
private #player :Player
Reference to the main player instance.
- Type
- Player
- Source
- Chapters.js, line 36
private #subscriptions :Array<number>
Holds tokens of subscriptions to player events, for later unsubscribe.
- Type
- Array<number>
- Source
- Chapters.js, line 42
private #subs :Array<number>
Holds tokens of secondary subscriptions to player events, for later unsubscribe.
- Type
- Array<number>
- Source
- Chapters.js, line 48
private #scrubber :DomSmith|undefined
If we show chapters on the scrubber timeline, build that DOM here.
- Type
- DomSmith | undefined
- Source
- Chapters.js, line 54
private #controller :DomSmith|undefined
If we show chapters in the controller, build a small UI with prev/next and a title area.
- Type
- DomSmith | undefined
- Source
- Chapters.js, line 60
private #tooltipContainer :DomSmith|undefined
If we show chapters in a tooltip, set it up in the existing scrubber tooltip area.
- Type
- DomSmith | undefined
- Source
- Chapters.js, line 66
private #chapters :Array<Data~mediaItem_chapter>
The array of available chapters, sorted by start time.
- Type
- Array<Data~mediaItem_chapter>
- Source
- Chapters.js, line 72
private #chapter :number
Index of the currently active chapter.
- Type
- number
- Source
- Chapters.js, line 78
Methods
private #onDataReady(mediaItem)
Called when the media data is ready. This obtains the "chapters" array if present, and sets up or hides the relevant UI elements.
| Name | Type | Description | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|
mediaItem |
Data~mediaItem |
Object containing media type info.
|
- Listens
- data/ready
- Source
- Chapters.js, line 182
private #onMediaReady()
Called when the media is ready. This places the chapter segments on the scrubber if needed, and triggers a time update to set the initial UI.
- Listens
- media/ready
- Source
- Chapters.js, line 216
private #onToolTip(percent)
Called when the user hovers on the scrubber tooltip, so we can display the chapter title.
| Name | Type | Description |
|---|---|---|
percent |
number |
The fractional position on the timeline (0..1). |
private #onTimeUpdate()
Called periodically by "media/timeupdate" to highlight the current chapter in the controller and optionally enable/disable next/prev buttons.
- Listens
- media/timeupdate
- Source
- Chapters.js, line 270
private #onSwitchChapter(event)
Called when the user clicks the "prev" or "next" button to switch chapters.
| Name | Type | Description |
|---|---|---|
event |
Event |
The click event. |
- Source
- Chapters.js, line 294
private #enable()
Enables the next / prev button functionality. This method listens to canplay events in order to restore a usable state again when the player recovered from a media error (for example by loading another file).
- Listens
- media/canplay
- Source
- Chapters.js, line 311
private #disable()
Disables the next / prev button functionality. This method listens to media error events which cause the button to be disabled.
- Listens
- media/error
- data/nomedia
- Source
- Chapters.js, line 325
destroy()
This method removes all events, subscriptions and DOM nodes created by this component.
- Source
- Chapters.js, line 337