Class Timeline

Implements

Destroyable
ScrollableHorizontally
TimelineApi

Index

Constructors

constructor

new Timeline(config, videoController): Timeline
Parameters
- config: Partial<ConfigWithOptionalStyle<TimelineConfig>>
- videoController: VideoControllerApi
Returns Timeline
- Defined in project/src/timeline/timeline.ts:342

Properties

`Readonly`onPlayheadMove$

onPlayheadMove$: Subject<PlayheadMoveEvent> = ...

Fires on moving the playhead

`Readonly`onReady$

onReady$: BehaviorSubject<undefined | TimelineReadyEvent> = ...

Fires when Timeline is ready and all timeline lanes are created. Initial value is undefined.

`Readonly`onScroll$

onScroll$: Subject<TimelineScrollEvent> = ...

Fires on Timeline scroll

`Readonly`onScrubberMove$

onScrubberMove$: Subject<ScrubberMoveEvent> = ...

Fires on moving the scrubber

`Readonly`onStyleChange$

onStyleChange$: Subject<TimelineStyle> = ...

Fires on Timeline style change

`Readonly`onTimecodeClick$

onTimecodeClick$: Subject<TimecodeClickEvent> = ...

Fires on click anywhere on Timeline where timecode of the video can be determined

`Readonly`onTimecodeMouseMove$

onTimecodeMouseMove$: Subject<TimecodeMouseMoveEvent> = ...

Fires on mouse move anywhere on Timeline where timecode of the video can be determined

`Readonly`onZoom$

onZoom$: Subject<TimelineZoomEvent> = ...

Fires on Timeline zoom

Accessors

config

get config(): TimelineConfig
Returns TimelineConfig
- Defined in project/src/timeline/timeline.ts:1801

descriptionPaneVisible

get descriptionPaneVisible(): boolean
Returns boolean
true if visible, false if not visible
Implementation of TimelineApi.descriptionPaneVisible
- Defined in project/src/timeline/timeline.ts:1805

style

get style(): TimelineStyle
Style getter / setter

Returns TimelineStyle
Implementation of TimelineApi.style
- Defined in project/src/timeline/timeline.ts:1786
set style(value): void
Style getter / setter
Parameters
- value: Partial<TimelineStyle>
Returns void
Implementation of TimelineApi.style
- Defined in project/src/timeline/timeline.ts:1790

thumbnailVttFile

get thumbnailVttFile(): undefined | ThumbnailVttFile
Thumbnail VTT file

Returns undefined | ThumbnailVttFile
Implementation of TimelineApi.thumbnailVttFile
- Defined in project/src/timeline/timeline.ts:1782

Methods

addTimelineLane

addTimelineLane(timelineLane): TimelineLaneApi
Adds instantiated TimelineLane to timeline
Parameters
- timelineLane: TimelineLaneApi
Returns TimelineLaneApi
Implementation of TimelineApi.addTimelineLane
- Defined in project/src/timeline/timeline.ts:1491

addTimelineLaneAtIndex

addTimelineLaneAtIndex(timelineLane, index): TimelineLaneApi
Adds instantiated TimelineLane to timeline
Parameters
- timelineLane: TimelineLaneApi
- index: number
Returns TimelineLaneApi
Implementation of TimelineApi.addTimelineLaneAtIndex
- Defined in project/src/timeline/timeline.ts:1499

addTimelineLanes

addTimelineLanes(timelineLanes): TimelineLaneApi[]
Adds multiple instantiated TimelineLane-s to timeline
Parameters
- timelineLanes: TimelineLaneApi[]
Returns TimelineLaneApi[]
Implementation of TimelineApi.addTimelineLanes
- Defined in project/src/timeline/timeline.ts:1587

addToFooterFlexGroup

addToFooterFlexGroup(flexNode): void
Parameters
- flexNode: FlexNode<any>
Returns void
- Defined in project/src/timeline/timeline.ts:1628

addToSurfaceLayerTimecodedFloatingContent

addToSurfaceLayerTimecodedFloatingContent(node, zIndex?): void
Parameters
- node: Group | Shape<ShapeConfig>
- zIndex: number = 0
Returns void
- Defined in project/src/timeline/timeline.ts:1620

addToTimecodedFloatingContent

addToTimecodedFloatingContent(node, zIndex?): void
Parameters
- node: Group | Shape<ShapeConfig>
- zIndex: number = 0
Returns void
- Defined in project/src/timeline/timeline.ts:1608

addToTimecodedStaticContent

addToTimecodedStaticContent(node, zIndex?): void
Parameters
- node: Group | Shape<ShapeConfig>
- zIndex: number = 0
Returns void
- Defined in project/src/timeline/timeline.ts:1616

constrainTimelinePosition

constrainTimelinePosition(x): number
Parameters
- x: number
Returns number
- Defined in project/src/timeline/timeline.ts:1632

destroy

destroy(): void
Destroys Timeline and it's dependencies

Returns void
Implementation of TimelineApi.destroy
- Defined in project/src/timeline/timeline.ts:1809

getHorizontalScrollPercent

getHorizontalScrollPercent(): number
Returns number
Implementation of ScrollableHorizontally.getHorizontalScrollPercent
- Defined in project/src/timeline/timeline.ts:1077

getScrollHandleHorizontals

getScrollHandleHorizontals(scrollbarWidth): Horizontals
Parameters
- scrollbarWidth: number
Returns Horizontals
Implementation of ScrollableHorizontally.getScrollHandleHorizontals
- Defined in project/src/timeline/timeline.ts:1094

getScrubberLane

getScrubberLane(): ScrubberLane
Returns ScrubberLane
ScrubberLane instance
Implementation of TimelineApi.getScrubberLane
- Defined in project/src/timeline/timeline.ts:1602

getTimecodedContainerDimension

getTimecodedContainerDimension(): Dimension
Returns Dimension
- Defined in project/src/timeline/timeline.ts:1678

getTimecodedFloatingDimension

getTimecodedFloatingDimension(): Dimension
Returns Dimension
- Defined in project/src/timeline/timeline.ts:1682

getTimecodedFloatingHorizontals

getTimecodedFloatingHorizontals(): Horizontals
Returns Horizontals
- Defined in project/src/timeline/timeline.ts:1701

getTimecodedFloatingPosition

getTimecodedFloatingPosition(): Position
Returns Position
- Defined in project/src/timeline/timeline.ts:1686

getTimecodedFloatingRect

getTimecodedFloatingRect(): RectMeasurement
Returns RectMeasurement
- Defined in project/src/timeline/timeline.ts:1694

getTimecodedFloatingRelativePointerPosition

getTimecodedFloatingRelativePointerPosition(): undefined | Position
Returns undefined | Position
- Defined in project/src/timeline/timeline.ts:1690

getTimelineLane

getTimelineLane<T>(id): undefined | T
Type Parameters
- T extends TimelineLaneApi
Parameters
- id: string
  TimelineLane.id
Returns undefined | T
single TimelineLane
Implementation of TimelineApi.getTimelineLane
- Defined in project/src/timeline/timeline.ts:1597

getTimelineLanes

getTimelineLanes(): TimelineLaneApi[]
Returns TimelineLaneApi[]
all TimelineLane-s
Implementation of TimelineApi.getTimelineLanes
- Defined in project/src/timeline/timeline.ts:1593

getVisiblePositionRange

getVisiblePositionRange(): {
end: number;
start: number;
}
Returns {
end: number;
start: number;
}
- end: number
- start: number
- Defined in project/src/timeline/timeline.ts:1708

getVisibleTimeRange

getVisibleTimeRange(): {
end: number;
start: number;
}
Returns {
end: number;
start: number;
}
- end: number
- start: number
- Defined in project/src/timeline/timeline.ts:1727

getZoomPercent

getZoomPercent(): number
Returns number
current zoom perent
Implementation of TimelineApi.getZoomPercent
- Defined in project/src/timeline/timeline.ts:1207

loadThumbnailVttFile

loadThumbnailVttFile(vttFile): void
Load ThumbnailVttFile by url
Parameters
- vttFile: ThumbnailVttFile
Returns void
Implementation of TimelineApi.loadThumbnailVttFile
- Defined in project/src/timeline/timeline.ts:1734

loadThumbnailVttFileFromUrl

loadThumbnailVttFileFromUrl(vttUrl): Observable<undefined | ThumbnailVttFile>
Load ThumbnailVttFile
Parameters
- vttUrl: string
Returns Observable<undefined | ThumbnailVttFile>
Implementation of TimelineApi.loadThumbnailVttFileFromUrl
- Defined in project/src/timeline/timeline.ts:1738

removeAllTimelineLanes

removeAllTimelineLanes(): void
Removes all timeline lanes

Returns void
Implementation of TimelineApi.removeAllTimelineLanes
- Defined in project/src/timeline/timeline.ts:1551

removeTimelineLane

removeTimelineLane(id): void
Removes TimelineLane by id
Parameters
- id: string
Returns void
Implementation of TimelineApi.removeTimelineLane
- Defined in project/src/timeline/timeline.ts:1529

removeTimelineLanes

removeTimelineLanes(ids): void
Removes TimelineLane's by ids
Parameters
- ids: string[]
Returns void
Implementation of TimelineApi.removeTimelineLanes
- Defined in project/src/timeline/timeline.ts:1536

scrollHorizontallyToPercent

scrollHorizontallyToPercent(percent): void
Parameters
- percent: number
Returns void
Implementation of ScrollableHorizontally.scrollHorizontallyToPercent
- Defined in project/src/timeline/timeline.ts:1089

scrollTimeline

scrollTimeline(x): void
Parameters
- x: number
Returns void
- Defined in project/src/timeline/timeline.ts:1179

scrollToEased

scrollToEased(percent): Observable<number>
Scrolls timeline
Parameters
- percent: number
  in range from 0 - timeline start or first timestamp, to 100 - timeline end or last timestamop
Returns Observable<number>
Implementation of TimelineApi.scrollToEased
- Defined in project/src/timeline/timeline.ts:1114

scrollToPlayheadEased

scrollToPlayheadEased(): Observable<number>
Scrolls timeline to playhead position

Returns Observable<number>
Implementation of TimelineApi.scrollToPlayheadEased
- Defined in project/src/timeline/timeline.ts:1123

setDescriptionPaneVisible

setDescriptionPaneVisible(visible): void
Shows or hides Timeline description pane
Parameters
- visible: boolean
Returns void
Implementation of TimelineApi.setDescriptionPaneVisible
- Defined in project/src/timeline/timeline.ts:1750

setDescriptionPaneVisibleEased

setDescriptionPaneVisibleEased(visible): Observable<void>
Shows or hides Timeline description pane
Parameters
- visible: boolean
Returns Observable<void>
Implementation of TimelineApi.setDescriptionPaneVisibleEased
- Defined in project/src/timeline/timeline.ts:1760

settleLayout

settleLayout(): void
Recalculates and settles layout, called on window resize event

Returns void
Implementation of TimelineApi.settleLayout
- Defined in project/src/timeline/timeline.ts:914

timelineContainerPositionToTime

timelineContainerPositionToTime(xOnTimeline): number
Parameters
- xOnTimeline: number
Returns number
- Defined in project/src/timeline/timeline.ts:1642

timelinePositionToFrame

timelinePositionToFrame(x): number
Parameters
- x: number
Returns number
- Defined in project/src/timeline/timeline.ts:1650

timelinePositionToTime

timelinePositionToTime(xOnTimeline): number
Parameters
- xOnTimeline: number
Returns number
- Defined in project/src/timeline/timeline.ts:1638

timelinePositionToTimecode

timelinePositionToTimecode(x): string
Parameters
- x: number
Returns string
- Defined in project/src/timeline/timeline.ts:1646

timeToTimelinePosition

timeToTimelinePosition(time): number
Parameters
- time: number
Returns number
- Defined in project/src/timeline/timeline.ts:1654

toggleDescriptionPaneVisible

toggleDescriptionPaneVisible(): void
Toggles Timeline description pane

Returns void
Implementation of TimelineApi.toggleDescriptionPaneVisible
- Defined in project/src/timeline/timeline.ts:1756

toggleDescriptionPaneVisibleEased

toggleDescriptionPaneVisibleEased(): Observable<void>
Toggles Timeline description pane

Returns Observable<void>
Implementation of TimelineApi.toggleDescriptionPaneVisibleEased
- Defined in project/src/timeline/timeline.ts:1778

zoomInEased

zoomInEased(): Observable<number>
Zoom in. Zoom scale in single method call is defined with TimelineConfig.zoomScale

Returns Observable<number>
Implementation of TimelineApi.zoomInEased
- Defined in project/src/timeline/timeline.ts:1254

zoomOutEased

zoomOutEased(): Observable<number>
Zoom out. Zoom scale in single method call is defined with TimelineConfig.zoomScale

Returns Observable<number>
Implementation of TimelineApi.zoomOutEased
- Defined in project/src/timeline/timeline.ts:1258

zoomTo

zoomTo(percent, zoomFocusPercent?): number
Timeline zoom
Parameters
- percent: number
  number between 100 and TimelineConfig.zoomMax
- zoomFocusPercent: undefined | number = ...
Returns number
Implementation of TimelineApi.zoomTo
- Defined in project/src/timeline/timeline.ts:1218

zoomToEased

zoomToEased(percent, zoomFocusPercent?): Observable<number>
Timeline zoom
Parameters
- percent: number
  number between 100 and TimelineConfig.zoomMax
- zoomFocusPercent: undefined | number = ...
Returns Observable<number>
Implementation of TimelineApi.zoomToEased
- Defined in project/src/timeline/timeline.ts:1234

zoomToMaxEased

zoomToMaxEased(): Observable<number>
Zoom to max resolution

Returns Observable<number>
Implementation of TimelineApi.zoomToMaxEased
- Defined in project/src/timeline/timeline.ts:1262

Class Timeline

Implements

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Parameters

Returns Timeline

Properties

ReadonlyonPlayheadMove$

ReadonlyonReady$

ReadonlyonScroll$

ReadonlyonScrubberMove$

ReadonlyonStyleChange$

ReadonlyonTimecodeClick$

ReadonlyonTimecodeMouseMove$

ReadonlyonZoom$

Accessors

config

Returns TimelineConfig

descriptionPaneVisible

Returns boolean

style

Returns TimelineStyle

Parameters

Returns void

thumbnailVttFile

Returns undefined | ThumbnailVttFile

Methods

addTimelineLane

Parameters

Returns TimelineLaneApi

addTimelineLaneAtIndex

Parameters

Returns TimelineLaneApi

addTimelineLanes

Parameters

Returns TimelineLaneApi[]

addToFooterFlexGroup

Parameters

Returns void

addToSurfaceLayerTimecodedFloatingContent

Parameters

Returns void

addToTimecodedFloatingContent

Parameters

Returns void

addToTimecodedStaticContent

Parameters

Returns void

constrainTimelinePosition

Parameters

Returns number

destroy

Returns void

getHorizontalScrollPercent

Returns number

getScrollHandleHorizontals

Parameters

Returns Horizontals

getScrubberLane

Returns ScrubberLane

getTimecodedContainerDimension

Returns Dimension

getTimecodedFloatingDimension

Returns Dimension

getTimecodedFloatingHorizontals

Returns Horizontals

getTimecodedFloatingPosition

Returns Position

getTimecodedFloatingRect

Returns RectMeasurement

getTimecodedFloatingRelativePointerPosition

Returns undefined | Position

getTimelineLane

Type Parameters

Parameters

`Readonly`onPlayheadMove$

`Readonly`onReady$

`Readonly`onScroll$

`Readonly`onScrubberMove$

`Readonly`onStyleChange$

`Readonly`onTimecodeClick$

`Readonly`onTimecodeMouseMove$

`Readonly`onZoom$

Returns {
end: number;
start: number;
}

Returns {
end: number;
start: number;
}