Set of Sandstone-styled components to support a custom media player.
import MediaPlayer from '@enact/sandstone/MediaPlayer';Members
MediaControlsComponent
A set of components for controlling media playback and rendering additional components.
This uses Slottable to accept the custom tags, <bottomComponents>
to add components to the bottom of the media controls. Any additional children will be
rendered into the "more" controls area. Showing the additional components is handled by
MediaControls when the user navigates down from the media buttons.
import {MediaControls} from '@enact/sandstone/MediaPlayer';Properties
DOM id for the component.
This child component
ActionGuide's id is generated from the id.The
aria-labelfor the action guide.The label for the action guide.
These components are placed below the action guide. Typically these will be media playlist controls.
- Default: 'jumpbackward'
Disables state on the media "jump" buttons; the outer pair.
- Default: 'jumpforward'
Called with the reference to the mediaControls node.
Disables the media buttons.
When
true, more components are rendered. This does not indicate the visibility of more components.The spotlight ID for the moreComponent container.
Default: 'moreComponents'Removes the "jump" buttons. The buttons that skip forward or backward in the video.
Called when cancel/back key events are fired.
Called when the user clicks the JumpBackward button
Called when the user clicks the JumpForward button.
Called when the user presses a media control button.
Called when the user clicks the Play button.
A string which is sent to the
pauseicon of the player controls. This can be anything that is accepted by Icon. This will be temporarily replaced by the playIcon when the paused boolean isfalse.Default: 'pause'truewhen the video is paused.A string which is sent to the
playicon of the player controls. This can be anything that is accepted by sandstone/Icon.Icon. This will be temporarily replaced by the pauseIcon when the paused boolean istrue.Default: 'play'Disables the media "play"/"pause" button.
truecontrols are disabled from Spotlight.The spotlight ID for the media controls container.
Default: 'mediaControls'The visibility of the component. When
false, the component will be hidden.Default: true
MediaSliderComponent
A customized slider suitable for use within media player components such as VideoPlayer.
import {MediaSlider} from '@enact/sandstone/MediaPlayer';Properties
When
true, the knob will expand. Note that Slider is a controlled component. Changing the value would only affect pressed visual and not the state.Allow moving the knob via pointer or 5-way without emitting
onChangeeventsDefault: falseThe position of the knob when in
previewmodeThe visibility of the component. When
false, the component will be hidden.Default: true
TimesComponent
Sandstone-styled formatted time component.
import {Times} from '@enact/sandstone/MediaPlayer';Properties
An instance of a Duration Formatter from i18n.
Must has a
format()method that returns a string.The current time in seconds of the video source.
Default: 0Removes the current time.
Removes the total time.
The total time (duration) in seconds of the loaded video source.
Default: 0
secondsToTimeFunction
Formats a duration in seconds into a human-readable time.